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