美感的HTML代碼 |
| 發(fā)布時(shí)間: 2012/9/1 14:15:11 |
|
如何讓代碼具有美感?對于HTML而言,這一切都是手工活。讓我們看看標(biāo)記語言如何能達(dá)到具有美感的境界。
HTML5-HTML5及其新元素帶來了前所未有的美感。 DOCTYPE-HTML5擁有最佳的文檔類型。 Indentation-制表符與空格用于縮進(jìn)代碼,以正確顯示標(biāo)簽之間的父子關(guān)系,強(qiáng)調(diào)層級結(jié)構(gòu)。 Charset-在所有內(nèi)容之前,必須在頭部進(jìn)行字符集聲明。 Title-網(wǎng)站標(biāo)題簡單而清晰。首先表述該頁面的功能,在分隔符之后,用網(wǎng)站標(biāo)題結(jié)尾。 CSS-只用了一個(gè)簡單的樣式表(媒體類型已在樣式表中聲明),并且僅面向于優(yōu)良的瀏覽器。IE6及更低版本將獲取通用的樣式表。 Body-為主體賦予ID,便能在無需更多標(biāo)記的情況下,給不同頁面設(shè)定獨(dú)有的樣式。 JavaScript-從Google(谷歌)調(diào)用了jQuery(最具美感的JavaScript腳本庫)。僅加載了單個(gè)JavaScript文件。各腳本都在頁面底端進(jìn)行引用。 FilePath-為提高效率,站點(diǎn)資源使用相對路徑。從適應(yīng)轉(zhuǎn)載的角度考慮,內(nèi)容性文件(如圖片)則采用絕對路徑。 ImageAttributes-圖片包含替換文字,主要是為圖片缺失情況而服務(wù)的,但同時(shí)也可用于驗(yàn)證。為了提高渲染效率,圖片的寬度與高度最好也要說明。 MainContentFirst–頁面的主要內(nèi)容應(yīng)在,基本的標(biāo)示及導(dǎo)航之后,而在任何輔助內(nèi)容(如:邊欄)之前。 AppropriateDescriptiveBlock-LevelElements–HEADER、NAV、SECTION、ARTICLE、ASIDE……這些新出現(xiàn)的“描述區(qū)段”,都將比從前的DIV更好地描述內(nèi)容。 Hierarchy–大寫標(biāo)題標(biāo)簽將起到實(shí)效,并跟隨著清晰的“層級結(jié)構(gòu)”。 AppropriateDescriptiveTags–根據(jù)不同的需要,列表被標(biāo)記為:未排序、已排序,以及并不常用的自定義列表。 CommonContentIncluded–在不同頁面所出現(xiàn)的相同內(nèi)容,最好能從服務(wù)器端包含到頁面中。(無論通過任何對你行之有效的方式、語言、CMS,等等。) SemanticClasses–不僅需要設(shè)立正確的元素名稱,還更應(yīng)做到類和ID的命名符合語意:即使沒有特定說明,它們也能起到描述的作用。(如“col”比“left”更好) Classes–當(dāng)多個(gè)元素需要用到類似樣式的時(shí)候,盡量為它們定義相同的類。(重用性) IDs–當(dāng)頁面中該元素僅出現(xiàn)一次的時(shí)候,盡量為它們定義ID,而請勿為不同元素定義相同ID。 DynamicElements–動(dòng)態(tài)效果僅在確實(shí)所需的時(shí)候加入。 CharactersEncoded–當(dāng)出現(xiàn)特殊字符的時(shí)候,請注意字符編碼。 FreeFromStyling-頁面上的一切無關(guān)樣式,甚至無需指明需要怎樣的樣式。頁面上的一切僅限以下三項(xiàng):所需的站點(diǎn)資源、內(nèi)容、描述。 Comments-在查看代碼的時(shí)候,那些并不需要特別強(qiáng)調(diào),或者不是格外明顯的內(nèi)容,將會(huì)被包括在評論之中。 Valid-全站的標(biāo)記符合W3C驗(yàn)證。注意標(biāo)簽閉合,保證必要屬性,避免廢棄方法,等等。 本文出自:億恩科技【www.zuiquanben.com】 服務(wù)器租用/服務(wù)器托管中國五強(qiáng)!虛擬主機(jī)域名注冊頂級提供商!15年品質(zhì)保障!--億恩科技[ENKJ.COM] |
京公網(wǎng)安備41019702002023號