對一個(gè)網(wǎng)站設計調查報告的分析
Francois Briatte最近關(guān)于網(wǎng)站設計的調查報告引出了很多的閑言碎語(yǔ)。這個(gè)報告調查了10個(gè)著(zhù)名的設計師設計的網(wǎng)站,并就設計師們如何處理25個(gè)公共的設計元素做了比較。同時(shí)他還就這些網(wǎng)站在那25個(gè)問(wèn)題上的處理是相同或不相同的比率做了詳細的分析。
我向每位設計師推薦這一有趣的調查報告。如果你沒(méi)有時(shí)間的話(huà),我將把我認為最重要的觀(guān)點(diǎn)概括出來(lái),并加上我自己的一些結論和解釋?zhuān)ㄓ行┛赡芎虰riatte的觀(guān)點(diǎn)不同)供你們分享。
網(wǎng)站設計的相似點(diǎn)
據調查報告指出,10位網(wǎng)絡(luò )設計師們在處理某幾個(gè)布局因素時(shí)有著(zhù)顯著(zhù)的相似性。這是在設計師們設計的網(wǎng)站上出現概率為80%甚至更高的那些公共元素的一份清單。
鏈接或返回鏈接都用下劃線(xiàn)標注
已訪(fǎng)問(wèn)過(guò)的鏈接與常規鏈接一般通過(guò)改變字體顏色加以區分
在鏈接到主頁(yè)或索引頁(yè)的頁(yè)面頂端都有一個(gè)可以點(diǎn)擊的標識圖標
每個(gè)頁(yè)面下邊的腳注是一致的
正文背景為白色
正文字體為sans-serif字體
使用恰當的符號(用實(shí)體/轉義代碼中活字印刷排版式的符號和撇號代替一般正文的普通符號)
導航方法不多于六個(gè)
每個(gè)頁(yè)面包含一個(gè)詳細的版權聲明
在每個(gè)頁(yè)面上標注設計者的全名
以下是在網(wǎng)站上出現概率低于80%的元素:
XML前件
補充報道出現在左邊(但是出現在右邊是最普遍的)
按鈕與著(zhù)名的Steal These按鈕相似
可以用快捷鍵創(chuàng )建鍵盤(pán)快捷方式
所有這些設計者設計清單中一些公共元素時(shí)的處理方法都非常地相似,這并不令人驚奇。使用下劃線(xiàn)的鏈接,在每個(gè)頁(yè)面的頂端設置一個(gè)可點(diǎn)擊的標志圖,在底端標注一致的腳注,這些都是網(wǎng)站設計中約定成俗的慣例做法了。這些布局元素在網(wǎng)站訪(fǎng)問(wèn)者的印象中已經(jīng)根深蒂固了,設計者們當然深深地懂得滿(mǎn)足訪(fǎng)問(wèn)者的這些期望對創(chuàng )建一個(gè)有用的網(wǎng)站是多么的重要。
Briatte認為采用白色作為正文的背景主要是從印刷設計那兒繼承來(lái)的。在某種意義上,這可能是正確的。但是我并不這么認為,我覺(jué)得設計師們是為了努力迎合訪(fǎng)問(wèn)者的期待而這么做的,因為白色背景能讓訪(fǎng)問(wèn)者閱讀的時(shí)候感覺(jué)熟悉和舒適。
與印刷標準不同的是,大多數設計師采用sans-serif作為正文字體。正如Briatte指出的那樣,設計師們清楚地懂得:在印刷品中serif字體比較容易辨認,而sans-serif字體則更便于在屏幕上閱讀。
很有趣的是,網(wǎng)站設計師特別注重排字上的細節,比如用波浪線(xiàn),撇號或破折號等代替普通的引號,其中破折號由連字符組成。
根據經(jīng)驗做法,這些網(wǎng)站都將導航條限制在六個(gè)以?xún)?。這不稀奇,因為使用六個(gè)導航條使得網(wǎng)站運作得好,于是就演化成了現在的這個(gè)規則。
同樣,設計師會(huì )在每個(gè)頁(yè)面上標注一個(gè)詳細的版權聲明,這也很合情理。在當今社會(huì ),完全有這個(gè)法律上的必要。Briatte比較重視這個(gè)現象,那就是設計師們在每個(gè)頁(yè)面上注上自己的全名,而不是用綽號。對我而言,如果一個(gè)設計師不在他的作品中簽名那才是令人驚訝的事呢。畢竟,他們中的大多數都是靠網(wǎng)站設計謀生的,這樣做后,每個(gè)網(wǎng)頁(yè)都是他們的職業(yè)廣告。
在這些設計師當中,沒(méi)人在他們的網(wǎng)站上使用了XML前件。這和官方的推薦正好相反,但是也承認了XML前件會(huì )在主瀏覽器上引發(fā)某些問(wèn)題的事實(shí)。這些網(wǎng)站很少將橫檔置于左邊,而放在右邊的則很普遍(占70%),至于為什么這樣做,我也不太清楚。Briatte認為將其置于左邊妨礙閱讀。但是我認為在源代碼中將正文置于支撐文本(橫檔的內容)之上這是結構上的一種改進(jìn),再結合將橫檔置于左邊的做法,相信這是一種風(fēng)格趨勢。
很多網(wǎng)站上的按鈕圖形普遍是基于Steal These的,但是被調查的這些網(wǎng)站都沒(méi)有采用。這些專(zhuān)業(yè)設計師當然不會(huì )借用別人的設計,他們自然會(huì )創(chuàng )造出自己獨特風(fēng)格的按鈕。
在設計者們高度一致的設計風(fēng)格中,真正令人驚奇的是,他們當中只有兩人為鍵盤(pán)設計了快捷鍵來(lái)導航網(wǎng)頁(yè)。很明顯,或者因為可訪(fǎng)問(wèn)性或者因為可用性的原因,這些設計師都認為不必麻煩地去設鍵盤(pán)的快捷鍵。這種情況在以后也可能會(huì )改變。
網(wǎng)站設計中的分歧
大多數設計師們用同樣的方式處理網(wǎng)站設計中的一些元素,這不怎么令人驚奇。但是,調查報告并沒(méi)有指出他們在其他一些方面某些有趣的不同之處。
當我發(fā)現固定布局比流動(dòng)布局多得多的時(shí)候,簡(jiǎn)直是目瞪口呆。固定布局自有他們的存身之處,但是我還是期待這些多面手設計師能在流動(dòng)布局上顯示他們的身手。設計師們可能厭煩了在客戶(hù)網(wǎng)站的流動(dòng)布局上的嚴密的操作。他們更喜歡為個(gè)人網(wǎng)站設計相對簡(jiǎn)單的固定寬度的布局。
另一個(gè)讓我驚奇的事是僅有70%的設計師采用XHTML,我原來(lái)設想是100%的設計師會(huì )采用。還有一個(gè)令我驚奇的事是60%的網(wǎng)站在他們的導航條上使用基于圖像的滾動(dòng)條而不是采用純CSS滾動(dòng)。
他們還有一個(gè)有趣的分歧是60%的設計師使用嚴格的文件類(lèi)型,這意味著(zhù)他們必須遵循那種規格的更加嚴格的編碼標準。比較而言,將近一半的人喜歡比較松散的文件類(lèi)型,比如過(guò)渡型的。
這些網(wǎng)站的網(wǎng)頁(yè)上有著(zhù)相同的搜索框獨立的顯示樣式表,這也是他們之間存在的差異。如果這些強烈推薦的方法有利于網(wǎng)站搜索更具特征的話(huà),我就奇怪他們?yōu)槭裁匆龅眠@么普通。一半的網(wǎng)站沒(méi)有顯示樣式表,這還比較容易解釋?zhuān)驗樗麄兊脑O計使得即使在沒(méi)有針對印刷品的獨立的樣式表的情況下也能成功地打印。
同中存異
我認為最有趣的事不是查看調查報告里的數據,而是去訪(fǎng)問(wèn)這些實(shí)際的網(wǎng)站。好些網(wǎng)站反映了當前的趨勢和布局風(fēng)格。事實(shí)上,有些網(wǎng)站就負責形成了這種趨勢。盡管這些網(wǎng)站有著(zhù)顯著(zhù)的相似性,他們還是有很大差異的。這畢竟不像切面包——得到的是一個(gè)復制品的集合。設計師們在約定的習俗和被驗證了的技術(shù)的限制框架內,有著(zhù)足夠的空間來(lái)發(fā)揮他的創(chuàng )造力和展現其自我表達能力。
聯(lián)系客服