網絡是個不斷髮展變化的有機體，如何建設可以長久適應互聯網發展的頁面是很重要的，它可以是你的網站在互聯網發展的激流中迅速跟進。
使用整潔的HTML標 記，構建符合標準的頁面可以幫助你做到這些，更重要的，它可以是你在未來的運營中節省大量的時間和金錢。
網頁技術是跟隨互聯網技術的發展而 進步的，HTML技術已經發展了很長時間，它的伴生技術也已發展穩定。
首先是Javascript，然後是CSS、XML，直到現在的 AJAX，HTML5的大規模運用也已初現端倪——Firefox、Safari、 Opera和Chrome已經基本完全支持HTML5（在這個問題上，微軟的Internet Explorer再一次阻礙了互聯網的發展#-_-）
在 這篇文章裏，我們會探討基礎的web標準，討論它們是什麼，他們有什麼意義，以及這些重要但常被忽視的問題的解決方法。
什麼是“整潔”的 HTML標記？
簡單來說，“整潔”的HTML標記指的是：沒有累贅，符合標準，使用有意義的標籤和結構 。
沒 有累贅的HTML代碼可以充分的利用標籤，消除了不必要的代碼，僅保存有意義的標記。它避免了無用的屬性，比如嵌入式CSS，保持了文檔結構的整齊。
同 樣的，沒有累贅的CSS代碼應該避免自身的重複，使用可繼承的屬性(記住CSS的本意是層疊樣式表)，並且科學的重用CSS Class。
符 合標準指的是你的頁面可以通過W3C 的HTML、CSS、XML標準驗證，使用免費的 W3C驗證器，找出並修改錯誤，繼續測試知道100%符合標準。
爲什麼要這樣？只要能正常顯示不就夠了嗎？
每個項目都有一個緊迫的時限，用戶希望網站越早發佈越好。所以網站開發和設計人員都被要求快速高效的完成工作。
人 很容易陷入一種陷阱——快速就意味着草率，書寫整潔、符合標準的代碼會浪費時間。經常有人說：“它正常顯示了，就沒問題了”。
雖然此時此刻 它顯示了，但明年呢？三年以後呢？瀏覽器換代怎麼辦？設備兼容嗎？
你真的以爲搜索引擎會去一行一行的摳你的代碼嗎，它們是很挑剔的，如果你 不使用標準化的代碼，就相當於你自己趕跑了搜索引擎。
如果有其他的員工來修改你的代碼會怎樣，如果你被老闆炒了，或者自己跳槽了會怎樣？會 有繼任者來看你的代碼，理解它們的意思。你是想讓這件事變得簡單，還是想讓他在背地裏扎你的小人？
開始正確的書寫它吧，這並不是一項煩人的 事情，它會節省你的時間和金錢，並且讓你少些後顧之憂。
你可能以爲使用嵌入式CSS寫頁面更快，你也可能覺得不考慮結構直接書寫HTML更 方便。
但是當你修改文檔或者將來你要改版網站的時候，你會花更多的時間來彌補劣質代碼造成的干擾。如果你建立了新的樣式表，那分散在 HTML代碼中的嵌入式CSS會給你帶來很大麻煩，你可能會花幾小時的時間來剝離他們。
可擴展，設備友好，語義化和易升級
手 機瀏覽器的發展越來越快，手機上網不再是黑莓的專利，現在每天有數以億計的人在使用手機瀏覽網頁。
具備爲視力障礙人士開發的輔助瀏覽技術或 爲肢體不方便的人設計的特殊操作界面的設備已經很常見。如果你不想失去這麼龐大的用戶羣的話，就要考慮設備友好的問題。
你的網站可能會被以
盲文的形式提供給用戶，有了 互聯網內容存儲
、 Google快照
等工具，
你的網頁即使被刪除，也可能會在網絡上被保留很長時間。
使 用整潔、符合標準的標記可以使你輕鬆應對以上的情況。
Do和Don't ("要"和"不要")
DO - 使用預定義的標籤。 例如：h1是一個網頁內容中最重要的部分，然後是h2,h3等等，一個網頁中只能有一個h1；
DO - 使用有意義的元素命名。 問問自己如果別人來閱讀代碼的話，會不會明白你的class和ID的命名的意思，比如，同樣一個層， 用#box12 還是#comment-footer，你覺得哪個更好些？
DO - 充分利用CSS的繼承性。 例 如：你在一個container中設置了字體屬性，那麼你就不必在其子元素中再分別設置了，除非它用不同的字體。這會使你的樣式表明晰簡潔。
DO - 讓你的HTML、CSS、XML代碼符合標準。 使用W3C驗證器驗證錯誤和警告，修改它們知道100%符合標準。
DO - 雙向檢查所見即所得編輯器產生的代碼。 所見即所得瀏覽器是產生垃圾代碼的大頭，一定要儘量精簡它產生的代碼。
DON'T - 不要使用嵌入式css樣式和無關的標記和屬性。 及時你很忙亂，也不要順手加這些東西。
DON'T - 不要滿足於“正確顯示”。 因爲隱藏在頁面中的錯誤可能會在其他瀏覽器或設備中把頁面毀的面目全非。
擴展閱讀
- 使用Web標準進行設計 : Jeffrey Zeldman
- W3C 標準驗證器: XHTML 驗證 , CSS 驗證
- W3C 建議 如何書寫整潔的代碼
- Web可擴展性教程
- Web標準項目 - Web標準的信息、發展趨勢和很多實例代碼
作者
原作：Alvaro Guzman @ Wedsigner
Depot
翻譯：Oncoding
編碼營