|
2. 使用方便，易于自學
(1). 簡單易記的命名規(guī)則
- 結構語義性：class=”newsList” wrapper、nav
- 表現(xiàn)語義性：class=”textLeft” cRed、f14px
具有語義的內容是最容易理解記憶的。有一種記憶法就是使用一些有一定意義的聯(lián)想來增強對陌生內容的記憶。公用模板中可以使用具有簡明語義的名稱來對選擇符進行命名，這樣，非專業(yè)做重構開發(fā)的模板使用者，不必具有專業(yè)的CSS方面的知識或者是閱讀很復雜的說明文檔即可從命名上對模板中的選擇符的用法進行理解，掌握了其中的規(guī)律，就可以非�？焖俚刈詫W以達到熟練運用。
Web標準的所謂的語義性，主要是指(X)THML標簽上的語義，強調要按照標簽元素最初的定義去使用他們；同時提倡要使用具有結構屬性語義的標簽，而避免使用具有表現(xiàn)語義的標簽。例如使用h(n)來標識各級標題，ol用來建立一個有序列表，li來標識列表項；對于small、b、i、blink、center這類含有元素視覺表現(xiàn)語義的標簽，則要盡量避免使用。事實上除了(X)HTML標簽名上固定的語義，還可以通過一些標簽自定義的屬性值來增強語義。例如后來出現(xiàn)的微格式（Microformat），就是基于class屬性值的語義性的應用。
由于id的唯一性，使用id選擇符的樣式在同一個頁面中不能重用。為了保證定義樣式的可重用性，通常需要使用類定義（class）作為選擇符。在對class屬性值進行語義化命名的時候，嚴格遵循web標準結構與表現(xiàn)分離準則的人可能會排斥使用表現(xiàn)性語義，他們認為一旦需要通過改變CSS定義來更新元素的外觀，類選擇符所含有的表現(xiàn)語義就會與它修改后的實際外觀不符合。例如設置左對齊并且類命名為“textLeft”的樣式，如果把CSS定義更改為右對齊，則類選擇器的命名語義與它的實際內容并不符合。首先要承認這種考慮是非常細致的。但實際項目的開發(fā)往往非常復雜，要綜合考慮多方面需求，很難在某一方面達到理想狀態(tài)。在一個大型系統(tǒng)的諸多頁面中，要將所有使用到樣式的元素都用某個結構特征來進行描述，從我的個人經驗來看這是非常傷神的一件事。這些具有細枝末節(jié)的結構語義的樣式的通用性也很成問題——有些元素只是使用了相同的樣式，比如相同的字體、顏色等，但他們代表的結構屬性卻并不相同，如果選擇器全部以結構語義來進行命名，很多外觀相同但結構語義不同的樣式就要重復定義了。例如，我們在如下兩個地方都用到了紅色字體，一個是報錯警示信息，一個是地方是股票上漲點數(shù)，如果全部用語義命名方式，就需要分別命名一個“error”和一個“strengthen”的類定義，并且都設置屬性“color:red”，這個“color:red”就在這兩個地方重復定義了。如果有一個以表現(xiàn)語義命名的類“cRed”并設置表現(xiàn)語義所對應的紅色樣式，就可以在這兩個地方同時使用“cRed”這個類了。另外還需要強調的是，我們設計制作的是“公用樣式模板”，已經是經過整體規(guī)劃高度抽象化了的具有代表性的元素樣式，應該保持已有CSS的穩(wěn)固，在需求有變的情況下寧愿去改變(X)HTML端的選擇器掛鉤，而不應該隨意改變CSS中已定義好的屬性。在必要的地方使用表現(xiàn)語義進行命名也是有一定合理性的。
所以，任何固有的規(guī)則都會有兩面性，需要我們根據實際情況去權衡利弊。在對可變需求有一定的預見性的情況下，靈活地打破規(guī)則書寫更易維護代碼這也是開發(fā)人員的一項專業(yè)素質�！白袷匾�(guī)范的一個重要標準，就是知道何時打破它，并大膽地打破。”不應該死守教條，這樣只會畫地為牢自筑樊籬。只有擱置爭議，綜合運用，才能在項目需求、開發(fā)成本、維護成本的多方博弈中取得均衡。
出處：163 UED Team
責任編輯：bluehearts
上一頁 公用樣式模板的設計制作 [4] 下一頁 公用樣式模板的設計制作 [6]
◎進入論壇網頁制作、WEB標準化版塊參加討論，我還想發(fā)表評論。
|
第 1 頁 
第 5 頁 公用樣式模板的設計制作 [5]
