表單應(yīng)該就像個(gè)溫柔又有禮貌的服務(wù)生。想象你走進(jìn)一間超級(jí)市場(chǎng)，走過(guò)兩旁堆滿商品的走道之后，左轉(zhuǎn)右轉(zhuǎn)，看到你想買(mǎi)的果醬并且挑選了兩罐放在購(gòu)物袋中。

終于你走向結(jié)賬柜臺(tái)，一個(gè)笑容甜美的收銀人員對(duì)你溫柔的問(wèn)好，并接過(guò)你手中的果醬，告訴你價(jià)錢(qián)，幫你包裝，然后找給你零錢(qián)和發(fā)票并且愉快的說(shuō)再見(jiàn)。

現(xiàn)在你來(lái)到一個(gè)購(gòu)物網(wǎng)站，在首頁(yè)看到許多特價(jià)商品，你點(diǎn)選了食品的分類選項(xiàng)，來(lái)到果醬的分類。稍微看了一下果醬的介紹文章，然后點(diǎn)擊鼠標(biāo)把果醬放到購(gòu)物車中，并點(diǎn)選結(jié)賬：結(jié)果出現(xiàn)的是一個(gè)冷淡又死氣沉沉的表單（Form）。

表單絕對(duì)是網(wǎng)站中用戶和系統(tǒng)互動(dòng)的最主要的元素，網(wǎng)站透過(guò)表單向用戶提出問(wèn)題，用戶則透過(guò)表單向網(wǎng)站表達(dá)他的想法。標(biāo)單又可以細(xì)分成三種元素：1、說(shuō)明目的的標(biāo)簽；2、提供響應(yīng)的輸入方塊或選單；3、以及提交表單的按鈕。表單的設(shè)計(jì)就可以想象成一個(gè)稱職的服務(wù)生，他的服務(wù)應(yīng)該要符合下面幾個(gè)項(xiàng)目：

老實(shí)說(shuō)，你瀏覽過(guò)幾個(gè)水平滑動(dòng)的網(wǎng)站？如果讓我來(lái)回答這個(gè)問(wèn)題，我得說(shuō)我沒(méi)瀏覽過(guò)幾個(gè)。而且水平滾動(dòng)網(wǎng)站似乎在網(wǎng)頁(yè)設(shè)計(jì)中并不流行。或者會(huì)被一些專家說(shuō)這是反人類的瀏覽體驗(yàn)。
好吧，對(duì)無(wú)創(chuàng)意毋寧死的設(shè)計(jì)師來(lái)說(shuō)。咱們就是愛(ài)打破常規(guī)，弄點(diǎn)新穎奇特的設(shè)計(jì)出來(lái)。

不過(guò)不得不說(shuō)，水平滾動(dòng)網(wǎng)頁(yè)設(shè)計(jì)有點(diǎn)命途多舛，剛出來(lái)的時(shí)候短暫流行過(guò)一陣子，但后來(lái)漸漸消隱于大眾視線，
有人說(shuō)這種風(fēng)格的網(wǎng)頁(yè)，瀏覽起來(lái)非常不順暢，有人說(shuō)他們就沒(méi)見(jiàn)過(guò)認(rèn)真設(shè)計(jì)的水平滾動(dòng)網(wǎng)站。但是本文將介紹幾例優(yōu)秀案例。

隨著設(shè)計(jì)技藝和風(fēng)格理解的提高，優(yōu)秀水平滾動(dòng)設(shè)計(jì)漸漸多了起來(lái)。
當(dāng)然，還有重要的一點(diǎn)需要考慮，不是每一種內(nèi)容都適合用水平滾動(dòng)的布局方式呈現(xiàn)。大多數(shù)采用水平滾動(dòng)方式設(shè)計(jì)的網(wǎng)站，內(nèi)容一般都是圖片和簡(jiǎn)潔的文字資料。

相較于垂直頁(yè)面設(shè)計(jì)，圖片展示是水平滾動(dòng)設(shè)計(jì)唯一具有壓倒性優(yōu)勢(shì)的地方。在眾多的垂直布局網(wǎng)站中，如果出現(xiàn)一款水平滾動(dòng)設(shè)計(jì)的圖片網(wǎng)站，就會(huì)有鶴立雞群的效果。

Samuel Esteves

Samuel Esteves是采用水平滾動(dòng)設(shè)計(jì)的圖庫(kù)類網(wǎng)站范例。該網(wǎng)站中的很多圖庫(kù)都很有趣。

Mariana Onate

正如我之前說(shuō)的那樣，水平滾動(dòng)網(wǎng)頁(yè)設(shè)計(jì)極度適合圖片展示，看看Mariana Onate。采用了多種技術(shù)，以及簡(jiǎn)單點(diǎn)擊的滾動(dòng)操作給圖像瀏覽帶來(lái)高雅體驗(yàn)。

Lucuma

此作品集與眾不同，通過(guò)水平滾動(dòng)設(shè)計(jì)，提供了更多作品的細(xì)節(jié)，而作品本身也非常適合采用水平滾動(dòng)

Asiance

Asiance是亞洲的數(shù)字服務(wù)商。通過(guò)水平滾動(dòng)，用戶可以獲取大量有用的信息。

Alex Flueras

對(duì)于Alex Flueras我無(wú)話可說(shuō)。這是個(gè)非常棒的水品滾動(dòng)圖庫(kù)網(wǎng)站。

C.L. Holloway

這是一位藝術(shù)家的網(wǎng)站，色彩非常的平滑，沒(méi)有突兀感。通過(guò)水平滾動(dòng)，讓人有一種漫步于畫(huà)廊的感覺(jué)，創(chuàng)意和實(shí)際的完美結(jié)合。

我們總是會(huì)聽(tīng)到 “少即是多”。
有時(shí)，剝離了所有的噱頭和幻想的元素從布局和專注于核心設(shè)計(jì)的原則出發(fā)，就會(huì)得到一個(gè)更美觀的網(wǎng)頁(yè)設(shè)計(jì)。
這篇文章向我們展示了一些極簡(jiǎn)主義的網(wǎng)站示例。

Yaron Schoen

Dan Cassaro

Dodge & Burn

Friends of The Web

Color Grade It

Simon Foster

Nudge

Johann Lucchini

Paravel

百度廣告管家是一款面向中高端媒體的穩(wěn)定、高速、易用、免費(fèi)的廣告管理系統(tǒng)。排期1.0自2011年上線以來(lái)，為網(wǎng)站主隨時(shí)記錄和更新廣告位的售出情況，避免了資源沖突。但也面臨著一些問(wèn)題，尋找影響用戶使用線上系統(tǒng)進(jìn)行排期管理的主要因素，挖掘排期的核心需求，找出使用的痛點(diǎn)，提供貼心的功能亮點(diǎn)，由此排期2.0應(yīng)運(yùn)而生。

我們灰常樂(lè)意每周在網(wǎng)頁(yè)設(shè)計(jì)佳作列表中展現(xiàn)設(shè)計(jì)精美的網(wǎng)站，不斷為你提供靈感。而今天我們打算另辟蹊徑，為網(wǎng)頁(yè)設(shè)計(jì)師收集了既能提供設(shè)計(jì)靈感又實(shí)用的優(yōu)秀案例，與過(guò)往選擇單一”主題”的例子有所不同。我們將為你呈現(xiàn)不同的工具和技術(shù)分享網(wǎng)站，可讓你在得到靈感的同時(shí)還能發(fā)現(xiàn)不錯(cuò)的工具或服務(wù)。在這篇文章中你將看到22個(gè)美觀又實(shí)用的網(wǎng)站，全部都不容錯(cuò)過(guò)哦親！

當(dāng)下社會(huì)，“Flat Design”設(shè)計(jì)方式似乎已經(jīng)成為網(wǎng)頁(yè)和交互設(shè)計(jì)的潮流。Flat design指的是網(wǎng)頁(yè)設(shè)計(jì)者在設(shè)計(jì)網(wǎng)頁(yè)的時(shí)候，常常使用圖片投影，細(xì)微的紋理，純色漸變，簡(jiǎn)潔的設(shè)計(jì)布局和對(duì)比強(qiáng)烈的排版，這些設(shè)計(jì)類似于Win8和Metro UI的界面。本文收集了20個(gè)極好的Flat Design網(wǎng)頁(yè)設(shè)計(jì)案列，請(qǐng)您欣賞。

LayerVault

圖像占據(jù)了網(wǎng)頁(yè)設(shè)計(jì)的中心舞臺(tái)。們已經(jīng)看到了一些真正美麗的網(wǎng)站使用了圓滑圖像作為焦點(diǎn)，引人注目。在網(wǎng)頁(yè)設(shè)計(jì)中，從簡(jiǎn)約設(shè)計(jì)的概念到全屏的背景圖片，有幾種不同的圖像使用方法。所以今天我們將告訴你一些啟發(fā)性的例子。聚集在這里的網(wǎng)站將證明美麗和高品質(zhì)的圖像可以傳遞信息，彰顯個(gè)性并迎合用戶的喜好。

Taasky

讓我們一起看看網(wǎng)頁(yè)設(shè)計(jì)師是如何運(yùn)用“翡翠綠”來(lái)配色。

Popular color for 2013

這里也有一些關(guān)于翡翠綠的介紹以及作品欣賞

查看網(wǎng)頁(yè)

一般設(shè)計(jì)師的入門(mén)方法之一就是臨摹優(yōu)秀的大師級(jí)作品，網(wǎng)頁(yè)設(shè)計(jì)也不例外，如果你想學(xué)習(xí)優(yōu)秀網(wǎng)頁(yè)設(shè)計(jì)，而且是設(shè)計(jì)新手，那么臨摹別人的設(shè)計(jì)作品是最好的方法，當(dāng)然前提是你要懂photoshop的一些基本用法。

下面設(shè)計(jì)達(dá)人網(wǎng)為大家分享2013流行的網(wǎng)站UI模板，分別有fackbook、Github、apple等優(yōu)秀網(wǎng)站，這些網(wǎng)站UI設(shè)計(jì)十分優(yōu)秀，源文件的字體、圖標(biāo)、排版布局大小都和原來(lái)網(wǎng)站的一模一樣，細(xì)節(jié)很到位，值得下載來(lái)學(xué)習(xí)！

Facebook Timeline 網(wǎng)站模板

下載地址：微盤(pán)下載

對(duì)于新手網(wǎng)頁(yè)設(shè)計(jì)師來(lái)說(shuō)，可能拿到優(yōu)秀的網(wǎng)站模板PSD源文件是很好的，因?yàn)檫@樣可以從里面深入學(xué)習(xí)很多有用的技術(shù)和技巧，這些網(wǎng)頁(yè)模板設(shè)計(jì)很精致，設(shè)計(jì)師們應(yīng)該認(rèn)真看看它們的設(shè)計(jì)細(xì)節(jié)、如何用柵格線布局、配色方案等等。