制作網(wǎng)頁并不難,只要有一個文本編輯器,買本入門書,幾分鐘就可以動手做出一個簡單的網(wǎng)頁來。但是,要做一個好的網(wǎng)頁,卻不是一件容易的事情,任何一個有經(jīng)驗的攻城師都知道,工作中的最大考驗和最不可回避的問題就是“變化”。我們在制作網(wǎng)頁的適合,不經(jīng)要實現(xiàn)需求,更重要的是要考慮實現(xiàn)代碼的可維護性,為未來可能出現(xiàn)的“變化”提前做好準備。
要編寫高質(zhì)量易維護的代碼首先要熟悉web標準,即結(jié)構(gòu)、樣式和行為的分離。
W3C是一個專門負責(zé)制定網(wǎng)頁標準的非營利性組織,致力于結(jié)束網(wǎng)頁制作領(lǐng)域混亂不堪的局面,Web標準就是由W3C組織推行的。Web標準由一系列標準組合而成,齊核心理念就是將網(wǎng)頁的結(jié)構(gòu)、樣式和行為分離開來,所以它可以分為三大部分:結(jié)構(gòu)標準、樣式標準和行為標準。結(jié)構(gòu)標準包括XML標準、XHTML標準、HTML標準;樣式標準主要是指CSS標準;行為標注主要包括DM標準和ECMAScirpt標準。
一個符合標準的網(wǎng)頁,標簽中的標簽名應(yīng)該全部都是小寫的,屬性要加上引號,樣式和行為不再夾雜在標簽中,而應(yīng)該分別單獨存放在樣式文件和腳本文件中。理想狀態(tài)下,網(wǎng)頁源代碼由三個部分組成:.html文件、.css文件和.js文件。
關(guān)于高質(zhì)量的HTML每個標簽都有語義,所以我們應(yīng)該使用有語義的標簽,而且搜索引擎看不到視覺效果,看到的只有代碼,只能通過標簽來判斷內(nèi)容的語義。
先確定HTML,確定語義的標簽,再來選用使用的CSS。
如何判斷網(wǎng)頁標簽語義是否良好:去掉樣式,看網(wǎng)頁結(jié)構(gòu)是否組織良好有序,是否仍然有很好的可讀性。
語義化標簽應(yīng)該注意的問題:
關(guān)于高質(zhì)量的CSS
模擬化css,也就是說將面向?qū)ο缶幊趟枷胍玫浇M織css中,使用單一職責(zé)原理來劃分模塊。
1、模塊與模塊之間盡量不要包含相同的部分,如果有相同部分,應(yīng)將它們提取出來,拆分成一個獨立的模塊。
2、模塊應(yīng)在保證數(shù)量盡可能少的原則下,做到盡可能簡單,以提高重用性。
css命名建議:駱駝命名法用于區(qū)分不同單詞,劃線用于表示從屬關(guān)系
在使用樣式的時候,是掛多個class還是新建class,建議多用組合,少用繼承。因為這樣一方面減少了代碼量,提高了可維護性,另一方面使類的職責(zé)更單一,增加了類的重用性,提高了開發(fā)效率。
(相鄰的margin-left和margin-right是不會重合的,但相鄰的margin-top和margin-bottom會產(chǎn)生重合)
如沒特殊注明,文章均為方維網(wǎng)絡(luò)原創(chuàng),轉(zhuǎn)載請注明來自http://m.oulysa.com/news/4890.html