| 外 套 | wrap | 主導航 | mainnav | 子導航 | subnav |
| 頁 腳 | footer | 整個頁面 | content | 頁 眉 | header |
| 商 標 | label | 標 題 | title | 頂導航 | topnav |
| 邊導航 | sidebar | 左導航 | leftsidebar | 右導航 | rightsidebar |
| 旗 志 | logo | 標 語 | banner | 子菜單 | submenu |
| 容器 | container | 內容 | content | 當前的 | current |
問題是,上面的諸如leftsidebar,rightsidebar等擁有很強指向性的命名在以后的布局變化中會怎么樣呢?如果left出現的位置不是左側,是中間或者是右側怎么辦呢?如果rightsidebar出現在左側怎么辦呢?這時的命名似乎有點不合邏輯了。有人常和我說,你這樣的考慮有意義嗎?多余的!真正有幾個網站會用同樣的結構去做兩次不一樣的布局,頂多就是改版了,改版的時候連結構都變了,這樣的考慮完全多余。的確,經常會有這樣的問題,有些網站不一次成形到下次改版前風格基本上不會改變,但是有些網站,比如我的博客,你再去看看pjblog的官方博客,同樣的結構卻有截然不同的表現。
看下面的代碼:
怎么去命名他們呢?bar1和bar2可以出現在兩側,也可能出現在一側,無論使用right、left、middle都不太合適。那么怎么去命名會比較合適一點呢?
這里提供一個來自adobe.com的創意,它使用的是 父元素-欄目組-欄目,其中欄目(column)使用無實際意義的字符表示,如a、b、c等。例如 wrap-ab-a,意思已經id為wrap的元素下包含著兩個div——a和b,現在要進行操作的是a。這樣的命名完全和元素沒有關系,而且意義還比較清晰。例如上面的命名就可以寫成:
"container_abc_a",說明是對container下有三個并列的元素(它們的id分別是a、b、c),目前指向的是第一個,即a。這樣做的好處就是不受布局的影響,名稱和頁面最終表現想分離,不過一個缺點就是,下因為a、b、c的意義使得再次嵌套的時候命名有點“亂”,如 id="container_abc_a_abc_a",層次深了就不太清晰了。
個人感覺這樣的命名比較新穎,非常值得借鑒。不過正如一開始所說的,“只要一個團隊有統一的命名規則要求,在日常開發和維護中不至于出現混亂就應該說是好的命名規則”。
原文連接:http://www.dudo.org/article.asp?id=246
新聞熱點
疑難解答