網(wǎng)頁(yè)設(shè)計(jì)的規(guī)范
理解并遵循網(wǎng)頁(yè)設(shè)計(jì)的規(guī)范是網(wǎng)頁(yè)界面設(shè)計(jì)的基礎(chǔ),網(wǎng)頁(yè)設(shè)計(jì)的規(guī)范在行業(yè)中通常被稱為設(shè)計(jì)的“一貫性”。一個(gè)優(yōu)秀的、有經(jīng)驗(yàn)的設(shè)計(jì)師能把網(wǎng)頁(yè)設(shè)計(jì)的基本規(guī)范自然而本能地融入作品中。在顯示器的方寸顯示空間里,用戶需要以被限定的分辨率來(lái)瀏覽頁(yè)面、以鍵盤和鼠標(biāo)來(lái)交互控制界面、繼而在有限的網(wǎng)絡(luò)傳輸速度下一個(gè)個(gè)層級(jí)地瀏覽整個(gè)站點(diǎn),可想而知其中有多少要素需要規(guī)范化。
形象標(biāo)志(LOGO)、導(dǎo)航、搜索、內(nèi)容區(qū)塊、頁(yè)面長(zhǎng)度、字體字號(hào)等元素是這些規(guī)范中至關(guān)重要的部分。這些元素中大部分都表現(xiàn)在網(wǎng)站的頭部或者是第一屏能顯示的區(qū)域內(nèi):一般的網(wǎng)站通常會(huì)在頭部顯著位置顯示網(wǎng)站LOGO,以合理的層級(jí)關(guān)系及最普通的字體字號(hào)來(lái)展現(xiàn)導(dǎo)航以及設(shè)計(jì)合理的搜索功能塊。
在這里我們需要注意的是除非非常必要,網(wǎng)站的LOGO盡量不要以flash動(dòng)畫展示,同時(shí)導(dǎo)航也盡量不要以flash動(dòng)畫或圖片來(lái)表現(xiàn),因?yàn)闉g覽器有攔截flash的可能;同時(shí),不同終端設(shè)備上瀏覽器對(duì)flash和圖片的不支持也可能造成網(wǎng)站無(wú)法繼續(xù)訪問(wèn)或者根本無(wú)法識(shí)別。
我們可以通過(guò)以下幾個(gè)例子對(duì)比一下網(wǎng)頁(yè)設(shè)計(jì)規(guī)范在實(shí)際應(yīng)用中的效果:圖1,汽車之家的導(dǎo)航設(shè)計(jì),圖文結(jié)合,非常出色;圖2,貴州省人民政府網(wǎng)站,網(wǎng)站標(biāo)題和LOGO全部制作到flash動(dòng)畫中,當(dāng)瀏覽器屏蔽flash的時(shí)候,網(wǎng)站將無(wú)法識(shí)別;圖3,伊利集團(tuán)網(wǎng)站,導(dǎo)航flash也很漂亮,同樣的,當(dāng)瀏覽器屏蔽flash的時(shí)候,導(dǎo)航將不可見(jiàn),網(wǎng)站無(wú)法被繼續(xù)訪問(wèn);圖4,廣東省人民政府網(wǎng)站,非常優(yōu)秀的設(shè)計(jì),導(dǎo)航欄全部以非圖片形式制作,既保證了美觀,又體現(xiàn)了實(shí)用性。
除此之外,網(wǎng)站的各內(nèi)容區(qū)塊應(yīng)切割明顯,讓用戶能很容易地判斷內(nèi)容塊的起始。如果不是門戶類型網(wǎng)站,網(wǎng)站頁(yè)面長(zhǎng)度盡量不要超過(guò)三屏(因?yàn)椴煌@示器分辨率參數(shù)不同,三屏的說(shuō)法不一定適用于所有設(shè)計(jì)),即不要讓用戶在同一頁(yè)面上過(guò)多滾動(dòng)鼠標(biāo)滾輪。中文網(wǎng)站設(shè)計(jì)時(shí)應(yīng)注意內(nèi)容區(qū)域文字盡量使用12像素、14像素等偶數(shù)字號(hào),以準(zhǔn)確表達(dá)中文字體的整齊切割,正文漢字部分應(yīng)嚴(yán)格使用宋體,保證用戶最好的閱讀感受。標(biāo)題部分可以稍微增大字號(hào),頁(yè)面上除裝飾性圖片或廣告之外的地方最多使用兩種字體。如圖5所示的方正字庫(kù)網(wǎng)站,就是一個(gè)很好的例子,左側(cè)列表使用13像素宋體,右側(cè)列表使用12像素宋體,同時(shí)除廣告外還出現(xiàn)了黑體和行楷等數(shù)種字體。
出處:藍(lán)色理想
責(zé)任編輯:bluehearts
上一頁(yè) 需求決定網(wǎng)站產(chǎn)品模型 下 下一頁(yè) 脫離純美術(shù)概念看界面設(shè)計(jì) 中
|