W3C標准及規范

概念：W3C標准

　　中文名：萬維網聯盟，外文名：World Wide Web Consortium

　　萬維網聯盟標准不是某一個標准，而是一些列標准的集合。網頁主要有三部分組成：結構（Structure）、表現（Presentation）、行為（Behavior）。

　　對應的標准也有三方面：結構化標准主要包括XHTML和XML，表現標准語言主要包括CSS、行為標准主要包括（如W3C DOM）、ECMAScript等。這些標准大部分是W3C起草發布，也有一是其他標准組織制定的標准，比如ECMAScript（European Computer Manufacturers Association）的ECMAScript的標准。

目的：為什么要遵循標准

　　用一個程序語言來說，我們是轉換器........adapter，我們想方設法讓我們的頁面、我們的程序能夠支持所有瀏覽器，能夠滿足盡可能多的用戶。我們要滿足所有的用戶，即使做不到，我們也要滿足我們技術范圍之內的所有用戶。

目標：一個標准的制作的網站，讓你壓根感覺不到跟標准有關。

受眾： 所有UI設計師、技術工程師、運行維護人員。

標准規范：

1、 需要聲明（DOCTYPE）

　　DOCTYPE（document type）文檔類型的簡寫，用來說明你用的XHTML或者HTML是什么版本。其中DTD叫文檔類型定義，里面包含了文檔的規則，瀏覽器就根據你定義的DTD來解釋你頁面的標識，並展現出來。要建立符合標准的網頁，DOCTYPE聲明是必不可少的關鍵組成部分；除非你的XHTML確定了一個正確的DOCTYPE，否則你的標識和css都不會生效。 有過度的（Transitional）、嚴格的（strict）、框架的（frameset）。

　　參考https://blog.csdn.net/erdfty/article/details/81364064

2、需要定義語言編碼

<meta http-equiv=“Content-Type” content=“text/html; charset=gb2312” />

　　注：如果忘記了定義語言編碼，可能會出現頁面亂碼現象。

3、JavaScript定義

　　Js必須要用<script language="javascript" type="text/javascript">來開頭定義，以保證在不支持js的瀏覽器上直接顯示出來。

4、CSS定義

　　CSS必須要用<style type=“text/css”>開頭來定義，為保證各瀏覽器的兼容性，在寫CSS時請都寫上數量單位，例如：錯誤：.space_10{padding-left:10} 正確：.space_10 {padding-left:10px}

5、使用注釋

　　正確的應用等號或者空格替換內部的虛線。<!--這里是注釋============這里是注釋-->

6、所有標簽的元素和屬性名字都必須使用小寫

　　與HTML不一樣，XHTML對大小寫是敏感的，<title>和<TITLE>是不同的標簽。XHTML要求所有的標簽和屬性的名字都必須使用小寫。

7、所有屬性值必須用引號括起來（"" ''）雙引號或單引號

8、把所有特殊符號用編碼表示

　　空格為&nbsp; 、小於號（<）&lt、大於號（>）&gt、和號（&）&amp等。

9、所有屬性必須有屬性值

　　XHTML規定所有屬性都必須有個值，沒有值就是重復本身。

10、所有的標記都必須有相應的結束標記

　　雙標記：<div></div> 單標記：<img />

11、所有的標記都必須合理嵌套

　　<p><b></p></b>必須修改為：<p><b></b></p>

12、圖片添加有意義的alt屬性

　　圖片加載失敗時可以用alt屬性表明圖片內容。同理添加文字鏈接的title屬性，幫助顯示不完整的內容顯示完整。

13、在form表單中增加label，以增加用戶友好度

<form>
 
    <labelfor="firstname">first name: </label>
 
    <inputtype="text" id="firstname"/>
 
</form>

以上是規范標准

結論：

　　1、標簽規范可以提高搜索引擎對頁面的抓取效率，對SEO（搜索引擎優化）很有幫助。

　　2、盡量使用外鏈css樣式表和js腳本。是結構、表現和行為分為三塊，符合規范。同時提高頁面渲染速度，提高用戶的體驗。

　　3、樣式盡量少用行間樣式表，使結構與表現分離，標簽的id和class等屬性命名要做到見文知義，標簽越少，加載越快，用戶體驗提高，代碼維護簡單，便於改版
————————————————
版權聲明：本文為CSDN博主「哈哈hyc」的原創文章，遵循CC 4.0 BY-SA版權協議，轉載請附上原文出處鏈接及本聲明。
原文鏈接：https://blog.csdn.net/erdfty/article/details/81363893