|
語義化實(shí)踐
在上面的內(nèi)容中，已經(jīng)穿插了大部分實(shí)踐的內(nèi)容，在此做總結(jié)性的介紹。
1.文檔結(jié)構(gòu)
“語義化”最簡單地還是從結(jié)構(gòu)開始，選用最符合內(nèi)容意義的標(biāo)簽，重新溫習(xí)《HTML和XHTML權(quán)威指南》，多推敲內(nèi)容的意義而不是僅僅根據(jù)頁面效果圖做出判斷。很多時候，我們都會面臨這樣一個境地，看試簡單的一個效果，為了追求語義的合理，偏要選擇并不那么容易實(shí)現(xiàn)的方案，不是折騰自己么？我想，這也是一個前端工作者對WEB標(biāo)準(zhǔn)的良知和對工作的感悟吧，如何平衡取舍，也是一門學(xué)問，realazy有非常深刻的理解（http://realazy.org/blog/2009/06/29/engineer-vs-scientist/）。
在前期制作階段，也可以多考慮未來情況，根據(jù)內(nèi)容語義，為頁面預(yù)留鉤子。當(dāng)然具體問題具體分析，根據(jù)項(xiàng)目的要求不同，采取的開發(fā)應(yīng)該靈活適應(yīng)，例如，對于宣傳專題頁面，由于后期調(diào)整的需求并不大，在滿足可用性、可訪問性的基本前提之下，應(yīng)采用快速開發(fā)模式，把主要精力集中在還原設(shè)計稿效果之上，而對于大型網(wǎng)站效果，要求就顯然不一樣了。
2．命名規(guī)則
對于ID和Class的規(guī)范的命名方案，網(wǎng)上時有出現(xiàn)，總體的原則還是根據(jù)內(nèi)容的意義來做命名，語義化的命名優(yōu)勢顯而易見，借用網(wǎng)上的一幅圖。
若要改變側(cè)欄的位置，只需修改CSS即可，無需改動網(wǎng)頁結(jié)構(gòu)，對于經(jīng)常出現(xiàn)的頁面模塊，個人推薦在開發(fā)過程中逐漸形成自己的命名規(guī)范，如header/footer/main/hd/bd/nav/box/mode等，使用連字符“-”或駝峰法形成更為復(fù)雜命名，如site-nav/quick-menu/secondaryContent/。
但回到具體情況，不同的項(xiàng)目也應(yīng)該根據(jù)具體情況對命名方式作出選擇，不同方式的命名規(guī)則應(yīng)該結(jié)合使用，大型網(wǎng)站，如淘寶，更適合使用柵格化和語義命名結(jié)合的方式，對于頁面的樣式修改，能快速敏捷地做出相應(yīng)調(diào)整，對于制作，能快速地拼湊，而大部分宣稱型的單頁，個人更推薦使用結(jié)構(gòu)化得命名方式，頁面制作者能方便快速地完成頁面，而不用多把時間陷近命名的考慮中，
3. 微格式
微格式（Microformat）是在標(biāo)準(zhǔn) XHTML 代碼中嵌入結(jié)構(gòu)化數(shù)據(jù)的一種新方法，簡單的說，就是通過一套已定的Class命名標(biāo)準(zhǔn)，來申明文檔中的內(nèi)容。大多數(shù)人了解的微格式都是從hCard開始， 以下是一段是簡單的hCard實(shí)例（http://www.oppenheim.com.au/），這是James Oppenheim應(yīng)用到頁腳的hCard。
其中，vcard url fn given-name given-name adr locality region類名都是為了格式化微格式而產(chǎn)生的，大家也應(yīng)該注意到，為了添加Class名，添加了數(shù)個span標(biāo)簽。那微格式的意義又在于什么地方呢？通過Firefox的Operator插件，我將自己的名片從簡歷中導(dǎo)出（http://adriancheng.name/resume.html）
導(dǎo)出的vcf我可以隨意導(dǎo)入到各個郵件客戶端作為聯(lián)系人信息，或者導(dǎo)入到手機(jī)內(nèi)的通訊錄（http://tommyfan.com/blog/skill/add_phone_from_hcard/），可見通過微格式的標(biāo)準(zhǔn)，可以方便于各種不同的用戶端來處理網(wǎng)頁中的數(shù)據(jù)，此時的微格式扮演的角色也類似于網(wǎng)頁中的API，當(dāng)然微格式有更恢弘的愿景，關(guān)于其他格式標(biāo)準(zhǔn)，可以瀏覽http://microformats.org/ 了解詳細(xì)。
結(jié)語
“語義化”的實(shí)踐非常簡單，可以說是前端最基礎(chǔ)的部分，但由于種種原因，或被誤解，或被忽視，沒有得到應(yīng)有的重視，寫這篇文章，旨在梳理自己過去一個階段的學(xué)習(xí)積累，希望能帶給所有讀者對WEB標(biāo)準(zhǔn)的一點(diǎn)思考。
本文鏈接：http://www.95time.cn/tech/web/2010/7687.asp 
出處：藍(lán)色理想
責(zé)任編輯：bluehearts
上一頁 從語義開始–概念、意義、實(shí)踐 [3] 下一頁
◎進(jìn)入論壇網(wǎng)頁制作、WEB標(biāo)準(zhǔn)化版塊參加討論，我還想發(fā)表評論。
|
第 1 頁 
第 4 頁 從語義開始–概念、意義、實(shí)踐 [4]
