應該避免的過時語法

介紹

許多人藉由觀看原始碼，然後複製貼上來學習 HTML、CSS 及 JavaScript。然而他們並沒有考慮到原本的網站，是否正確實做過。這意味著他們延續了一些過去必要，但現在不需要的程式慣例。這篇文章就是要列出那些隨著時間，變得不必要、或糟糕的程式語法。

Doctype

大約有十來種 (X)HTML文件類型描述（doctype），他們之間的差異非常細微（甚至沒差別），我們建議你使用以下 HTML5 的文件類型宣告：

<!DOCTYPE html>

如此會觸發所有瀏覽器使用標準模式（甚至包含 Internet Explorer 6）。

`<meta>` 元素與 `charset` 屬性

如同以下的原始碼寫法並不少見：

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

然而，就算你把它縮減成這樣，所有的瀏覽器還是會做出相同判定（甚至包括Internet Explorer 6）：

<meta charset="UTF-8" />

這些知識已經透過逆向工程（reverse engineering）與實用主義（pragmatism）證實。用就對了。

不存在的 `<meta>` 元素

許多被棄用或不標準的值，常常因為從某個頁面被複製到另個頁面，而延續了它們的利用。儘管這些元件被廣為利用，它們其實不符合規範、也不會有效用。特別是，不要去使用：

<meta name="MSSmartTagsPreventParsing" content="true"> 這個只有在其中一個 beta 版的 Internet Explorer 6 是有用處的。這個 beta 版已經不再使用，而且這版本的特色聰明標籤（smart tags）已經被移除，也不會再被加回來。
<meta name="robots" content="all"> 雖然 robot 屬性是存在且確實合法的，但請不要去使用根本不存在的值，像是 all。 robots 預設的值為 index, follow，其實這就是你寫的 all 想要做的事。因此請直接移除整個 <meta> 標籤即可。
<meta name="copyright" content="…"> 這個 meta 並不存在。移除它並創建一個版權頁面或 div，或是使用 rel="copyright" 的 <link> (en-US) HTML 元素之連結。
<meta name="rating" content="…"> 這個 meta 並不存在。只要移除整個 <meta> 即可。

HTML 腳本的註解

曾經有一段時間有些瀏覽器了解 <script> 標籤，但有些則否。這有時導致瀏覽器把應該作為腳本的文字，解讀成純文字。有個自然的想法，使得腳本成為 HTML 的註解。這方法，可以讓能執行腳本的瀏覽器做動、而不了解的瀏覽器忽略。

從這時起，我們繼承了：

<script>
<!--
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "bla.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
//-->
</script>

或是：

<script type="text/javascript">
<!--//--><![CDATA[//><!--
Blabla.extend(MyFramework.settings, { "basePath": "/" });
//--><!]]>
</script>

如今，這只會在 strict XML 驗證下，因為註解避開不帶引號標記的誤報，而有所幫助。除此之外，是完全無用的。甚至不執行腳本的瀏覽器，也只會忽略 <script> 標籤。簡單起見，只要把你的腳本寫在 <script> 的開頭與結尾之間就行。更理想的話，把你的腳本變成獨立的檔案，並透過 src 屬性連結。如果你在寫腳本，考慮使用 HTML5 async 與 defer 屬性。

不應再使用的元素

font, basefont (en-US)

這些元素不應再使用。針對元素排版外觀，應當優先考慮 CSS，並藉由元素、ID、或 class 屬性控制目標。

b, i, u

這些往往比較有爭議，但是當有相應的話，盡量去使用個別的 <strong> (en-US)、<em> (en-US) 或是 <span> (en-US) 和 CSS (text-decoration:underline)。

斟酌考慮使用哪個元素。有些以發展為導向的頁面，建議以簡單的 <strong> (en-US) 取代 <b> (en-US)、還有 <em> (en-US) 取代 <i> (en-US)。遵從這個建議不是好主意。<strong> (en-US) 是用作強調陳述，而 <em> (en-US) 只是加粗文字。例如，使用 <em> (en-US) 去簡單完成斜體不是好主意。非強調的斜體文字可以透過你頁面 CSS 的 font-style:italic 完成。類似的，書的標題和藝術作品傳統上都被轉成斜體，但針對這些東西使用 <cite> (en-US) 元素可以給出比 <em> (en-US) 或 <i> (en-US) 更語意的標記。