對(duì)網(wǎng)頁(yè)視覺(jué)設(shè)計(jì)效果的常見(jiàn)誤解(二) |
發(fā)布時(shí)間:2024-06-19 文章來(lái)源:本站 瀏覽次數(shù):807 |
7. Footer
“Footer”包含網(wǎng)站的一些附加信息,這部分還能夠命名為: “copyright“.
二.需要注意的幾點(diǎn):
1.盡量考慮為元素命名其本身的效果或”意圖”,達(dá)到語(yǔ)義化。不要運(yùn)用外表形式的命名. 如:red/left/big等。
2.組合命名規(guī)矩:
[元素類(lèi)型]-[元素效果/內(nèi)容]
如:查找按鈕: btn-search
登錄表單:form-login
新聞列表:list-news
3.觸及到交互行為的元素命名:
凡觸及交互行為的元素通常會(huì)有正常、懸停、點(diǎn)擊和已閱讀等不同樣式,命名可參考以下規(guī)矩:
鼠標(biāo)懸停::hover 點(diǎn)擊:click 已閱讀:visited
如:查找按鈕: btn-search、btn-search-hover、btn-search-visited
三.Photoshop圖層結(jié)構(gòu)規(guī)范:
Photoshop圖層命名遵從樹(shù)形結(jié)構(gòu),凡某元素組成的圖層大于3層,即可形成組,所有圖層盡量防止運(yùn)用默認(rèn)命名(圖層+編號(hào))。
第一級(jí)圖層結(jié)構(gòu)如下圖:
第二級(jí)結(jié)構(gòu)圖例(醫(yī)院網(wǎng)站):
第三級(jí)結(jié)構(gòu)圖例及效果圖對(duì)比(醫(yī)院新聞欄目):
四.常用命名匯總:
頁(yè)頭:header 登錄條:loginbar 標(biāo)志:logo 側(cè)欄:sidebar 廣告條:banner 導(dǎo)航:nav 子導(dǎo)航:subNav 菜單:menu 子菜單:subMenu 下拉菜單:dropMenu 工具條: toolbar 表單:form 欄目:column 箭頭:arrow 查找:search 查找按鈕:btn-search 滾動(dòng)條:scroll 內(nèi)容:content 標(biāo)簽頁(yè):tab 文章列表:list 提示信息:msg 小技巧:tips 欄目標(biāo)題:title 鏈接:links 頁(yè)腳:footer 服務(wù):service 熱門(mén):hot 新聞:news 下載:download 注冊(cè):regsiter 狀況:status 按鈕:btn 投票:vote 合作伙伴:partner 版權(quán):copyright 網(wǎng)站地圖: sitemap
只有正確認(rèn)識(shí)其價(jià)值和作用,才能充分發(fā)揮網(wǎng)頁(yè)視覺(jué)設(shè)計(jì)在提升用戶(hù)體驗(yàn)、促進(jìn)業(yè)務(wù)發(fā)展方面的重要作用。 |
|