教你打造乾淨清晰的html代碼

本文原創自news.mkq.online
版權聲明:本文爲原創文章,版權牛站新聞所有
轉載請註明http://www.niuzhan.com/Bago/
2.1.使用 Strict 模式- Strict DOCTYPE
使用 Strict 模式可以保證我們的代碼不隱藏任何錯誤。
教你打造乾淨清晰的html代碼

  1. 字符集聲明,特殊字符進行編碼處理
    字符集聲明應當放在 <head> 部分的最前面,以便讓瀏覽器知道如何顯示網頁中的所有內容,包括標題。另外,一些特殊字符,如 & 最好用 & 代替,這是一種最安全的方法。
    教你打造乾淨清晰的html代碼

  2. 恰當的縮進
    縮進不會影響網頁的渲染,但會明顯改善閱讀源代碼時的體驗。縮進沒有特定的規則,但始終保持一致是個好習慣。
    教你打造乾淨清晰的html代碼

  3. 將 CSS 和 Javascript 放在外部文件中
    將 CSS 和 Javascript 放在外部文件中引用,不僅減低單個網頁的尺寸,而且意味着其它網頁也可以共用這些代碼,另外,瀏覽器的緩存機制可以很好地降低對相同代碼的重複下載。
    教你打造乾淨清晰的html代碼

  4. 正確地嵌套 Tag 標籤
    如下圖,第一行代碼中,<h1>標籤嵌套在 <a>標籤中,儘管多數瀏覽器會正確渲染,但這不是好的習慣, 標籤是 block 對象,而 是 inline 對象,inline 對象不應該容納 block 對象。
    教你打造乾淨清晰的html代碼
  5. 消除不必要的 <div>
    <div> 常被濫用(尤其在我們現在所處的 DIV+CSS 神話中 - 譯者),人們希望把任何東西都放在 <div> 中以便爲它們分配 CSS 式樣,這種濫用會導致的臃腫。
    教你打造乾淨清晰的html代碼

  6. 使用更好的命名規則
    如下圖,Cat 的 CSS 類被命名爲 red italic,暗示着 Cat 使用紅色斜體,如果你想將 Cat 改成蘭色的粗體呢?
    教你打造乾淨清晰的html代碼

  7. 儘量使用 CSS 控制文字的排版
    如下圖所示,不要直接使用大寫,用 CSS 對這些文字排版方面的格式進行控制,這樣會更靈活。
    教你打造乾淨清晰的html代碼

  8. 爲 <body> 分配獨立的 class/id
    爲 body Tag 分配一個獨立的 class/id,可以很好地定位頁面中任何對象,因爲頁面中所有對象都位於 body 中。
    教你打造乾淨清晰的html代碼

  9. 驗證
    無需多言,你應當儘可能對網頁的代碼進行驗證,儘管有些代碼錯誤瀏覽器能自動更正,但有些錯誤是會帶來不好的後果的,尤其當你位於 Strict 模式下。即使什麼都不爲,看到那個綠色的 W3C 驗證標誌至少可以讓自己舒服一些。
    W3C 驗證是否通過並不一定要什麼拘泥,Web 設計中存在更多的考量,只拘泥 W3C 驗證結果,可能影響一些更重要的因素,比如,IE6 在 W3C 標準方面存在不少 BUG,如果你爲了100%通過 W3C 驗證而宣佈自己的網站不支持 IE6,至少在國內會得不償失的 - 譯者
    教你打造乾淨清晰的html代碼

  10. 合理的結構次序
    將網頁結構保持一個合乎邏輯的次序。
    教你打造乾淨清晰的html代碼
  11. 盡你所能
    如果你從零開始寫,保持以上的原則當然要容易的多,如果要修改舊的代碼,將會很痛苦,一些 CMS 系統拙劣的編碼會讓你陷入泥沼,或者你的網站規模宏大要改動的東西太多,不管怎樣,始終保持良好的習慣非常重要。
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章