對一個(gè)網(wǎng)站設(shè)計(jì)調(diào)查報(bào)告的分析 

 
 
   Francois Briatte最近關(guān)于網(wǎng)站設(shè)計(jì)的調(diào)查報(bào)告引出了很多的閑言碎語。這個(gè)報(bào)告調(diào)查了10個(gè)著名的設(shè)計(jì)師設(shè)計(jì)的網(wǎng)站，并就設(shè)計(jì)師們?nèi)绾翁幚?5個(gè)公共的設(shè)計(jì)元素做了比較。同時(shí)他還就這些網(wǎng)站在那25個(gè)問題上的處理是相同或不相同的比率做了詳細(xì)的分析。

    我向每位設(shè)計(jì)師推薦這一有趣的調(diào)查報(bào)告。如果你沒有時(shí)間的話，我將把我認(rèn)為最重要的觀點(diǎn)概括出來，并加上我自己的一些結(jié)論和解釋（有些可能和Briatte的觀點(diǎn)不同）供你們分享。

網(wǎng)站設(shè)計(jì)的相似點(diǎn)

    據(jù)調(diào)查報(bào)告指出，10位網(wǎng)絡(luò)設(shè)計(jì)師們在處理某幾個(gè)布局因素時(shí)有著顯著的相似性。這是在設(shè)計(jì)師們設(shè)計(jì)的網(wǎng)站上出現(xiàn)概率為80%甚至更高的那些公共元素的一份清單。

鏈接或返回鏈接都用下劃線標(biāo)注

已訪問過的鏈接與常規(guī)鏈接一般通過改變字體顏色加以區(qū)分

在鏈接到主頁或索引頁的頁面頂端都有一個(gè)可以點(diǎn)擊的標(biāo)識(shí)圖標(biāo)

每個(gè)頁面下邊的腳注是一致的

正文背景為白色

正文字體為sans-serif字體

使用恰當(dāng)?shù)姆枺ㄓ脤?shí)體/轉(zhuǎn)義代碼中活字印刷排版式的符號和撇號代替一般正文的普通符號）

導(dǎo)航方法不多于六個(gè)

每個(gè)頁面包含一個(gè)詳細(xì)的版權(quán)聲明

在每個(gè)頁面上標(biāo)注設(shè)計(jì)者的全名

以下是在網(wǎng)站上出現(xiàn)概率低于80%的元素：

XML前件

補(bǔ)充報(bào)道出現(xiàn)在左邊（但是出現(xiàn)在右邊是最普遍的）

按鈕與著名的Steal These按鈕相似

可以用快捷鍵創(chuàng)建鍵盤快捷方式

所有這些設(shè)計(jì)者設(shè)計(jì)清單中一些公共元素時(shí)的處理方法都非常地相似，這并不令人驚奇。使用下劃線的鏈接，在每個(gè)頁面的頂端設(shè)置一個(gè)可點(diǎn)擊的標(biāo)志圖，在底端標(biāo)注一致的腳注，這些都是網(wǎng)站設(shè)計(jì)中約定成俗的慣例做法了。這些布局元素在網(wǎng)站訪問者的印象中已經(jīng)根深蒂固了，設(shè)計(jì)者們當(dāng)然深深地懂得滿足訪問者的這些期望對創(chuàng)建一個(gè)有用的網(wǎng)站是多么的重要。

Briatte認(rèn)為采用白色作為正文的背景主要是從印刷設(shè)計(jì)那兒繼承來的。在某種意義上，這可能是正確的。但是我并不這么認(rèn)為，我覺得設(shè)計(jì)師們是為了努力迎合訪問者的期待而這么做的，因?yàn)榘咨尘澳茏屧L問者閱讀的時(shí)候感覺熟悉和舒適。

與印刷標(biāo)準(zhǔn)不同的是，大多數(shù)設(shè)計(jì)師采用sans-serif作為正文字體。正如Briatte指出的那樣，設(shè)計(jì)師們清楚地懂得：在印刷品中serif字體比較容易辨認(rèn)，而sans-serif字體則更便于在屏幕上閱讀。

很有趣的是，網(wǎng)站設(shè)計(jì)師特別注重排字上的細(xì)節(jié)，比如用波浪線，撇號或破折號等代替普通的引號，其中破折號由連字符組成。

根據(jù)經(jīng)驗(yàn)做法，這些網(wǎng)站都將導(dǎo)航條限制在六個(gè)以內(nèi)。這不稀奇，因?yàn)槭褂昧鶄€(gè)導(dǎo)航條使得網(wǎng)站運(yùn)作得好，于是就演化成了現(xiàn)在的這個(gè)規(guī)則。

同樣，設(shè)計(jì)師會(huì)在每個(gè)頁面上標(biāo)注一個(gè)詳細(xì)的版權(quán)聲明，這也很合情理。在當(dāng)今社會(huì)，完全有這個(gè)法律上的必要。Briatte比較重視這個(gè)現(xiàn)象，那就是設(shè)計(jì)師們在每個(gè)頁面上注上自己的全名，而不是用綽號。對我而言，如果一個(gè)設(shè)計(jì)師不在他的作品中簽名那才是令人驚訝的事呢。畢竟，他們中的大多數(shù)都是靠網(wǎng)站設(shè)計(jì)謀生的，這樣做后，每個(gè)網(wǎng)頁都是他們的職業(yè)廣告。

在這些設(shè)計(jì)師當(dāng)中，沒人在他們的網(wǎng)站上使用了XML前件。這和官方的推薦正好相反，但是也承認(rèn)了XML前件會(huì)在主瀏覽器上引發(fā)某些問題的事實(shí)。這些網(wǎng)站很少將橫檔置于左邊，而放在右邊的則很普遍（占70%），至于為什么這樣做，我也不太清楚。Briatte認(rèn)為將其置于左邊妨礙閱讀。但是我認(rèn)為在源代碼中將正文置于支撐文本（橫檔的內(nèi)容）之上這是結(jié)構(gòu)上的一種改進(jìn)，再結(jié)合將橫檔置于左邊的做法，相信這是一種風(fēng)格趨勢。

很多網(wǎng)站上的按鈕圖形普遍是基于Steal These的，但是被調(diào)查的這些網(wǎng)站都沒有采用。這些專業(yè)設(shè)計(jì)師當(dāng)然不會(huì)借用別人的設(shè)計(jì)，他們自然會(huì)創(chuàng)造出自己獨(dú)特風(fēng)格的按鈕。

在設(shè)計(jì)者們高度一致的設(shè)計(jì)風(fēng)格中，真正令人驚奇的是，他們當(dāng)中只有兩人為鍵盤設(shè)計(jì)了快捷鍵來導(dǎo)航網(wǎng)頁。很明顯，或者因?yàn)榭稍L問性或者因?yàn)榭捎眯缘脑?，這些設(shè)計(jì)師都認(rèn)為不必麻煩地去設(shè)鍵盤的快捷鍵。這種情況在以后也可能會(huì)改變。

網(wǎng)站設(shè)計(jì)中的分歧

大多數(shù)設(shè)計(jì)師們用同樣的方式處理網(wǎng)站設(shè)計(jì)中的一些元素，這不怎么令人驚奇。但是，調(diào)查報(bào)告并沒有指出他們在其他一些方面某些有趣的不同之處。

當(dāng)我發(fā)現(xiàn)固定布局比流動(dòng)布局多得多的時(shí)候，簡直是目瞪口呆。固定布局自有他們的存身之處，但是我還是期待這些多面手設(shè)計(jì)師能在流動(dòng)布局上顯示他們的身手。設(shè)計(jì)師們可能厭煩了在客戶網(wǎng)站的流動(dòng)布局上的嚴(yán)密的操作。他們更喜歡為個(gè)人網(wǎng)站設(shè)計(jì)相對簡單的固定寬度的布局。

另一個(gè)讓我驚奇的事是僅有70%的設(shè)計(jì)師采用XHTML，我原來設(shè)想是100％的設(shè)計(jì)師會(huì)采用。還有一個(gè)令我驚奇的事是60%的網(wǎng)站在他們的導(dǎo)航條上使用基于圖像的滾動(dòng)條而不是采用純CSS滾動(dòng)。

他們還有一個(gè)有趣的分歧是60%的設(shè)計(jì)師使用嚴(yán)格的文件類型，這意味著他們必須遵循那種規(guī)格的更加嚴(yán)格的編碼標(biāo)準(zhǔn)。比較而言，將近一半的人喜歡比較松散的文件類型，比如過渡型的。

    這些網(wǎng)站的網(wǎng)頁上有著相同的搜索框獨(dú)立的顯示樣式表，這也是他們之間存在的差異。如果這些強(qiáng)烈推薦的方法有利于網(wǎng)站搜索更具特征的話，我就奇怪他們?yōu)槭裁匆龅眠@么普通。一半的網(wǎng)站沒有顯示樣式表，這還比較容易解釋，因?yàn)樗麄兊脑O(shè)計(jì)使得即使在沒有針對印刷品的獨(dú)立的樣式表的情況下也能成功地打印。

同中存異

    我認(rèn)為最有趣的事不是查看調(diào)查報(bào)告里的數(shù)據(jù)，而是去訪問這些實(shí)際的網(wǎng)站。好些網(wǎng)站反映了當(dāng)前的趨勢和布局風(fēng)格。事實(shí)上，有些網(wǎng)站就負(fù)責(zé)形成了這種趨勢。盡管這些網(wǎng)站有著顯著的相似性，他們還是有很大差異的。這畢竟不像切面包——得到的是一個(gè)復(fù)制品的集合。設(shè)計(jì)師們在約定的習(xí)俗和被驗(yàn)證了的技術(shù)的限制框架內(nèi)，有著足夠的空間來發(fā)揮他的創(chuàng)造力和展現(xiàn)其自我表達(dá)能力。