語義研究的是標(biāo)志與符號(hào)之間的關(guān)系，以及它們所代表的意義。在語言學(xué)中，它主要是研究這些標(biāo)志（如單詞，短語，或者聲音）在語言中的意義。而在前端開發(fā)領(lǐng)域，語義主要涉及的是HTML元素、屬性和屬性值（包括像Microdata這樣的擴(kuò)展）所約定的意義。這些在規(guī)范中常用的正式約定語義，可以幫助程序（以及后來參與開發(fā)的人）更好地理解一個(gè)網(wǎng)站各方面的信息。然而，即使這些元素、屬性和屬性值的語義是正式化的，它們依然得服從于開發(fā)者的適應(yīng)程度以及共同選擇的結(jié)果。這使得正式的約定語義也可能會(huì)在今后被修改（而這正是HTML設(shè)計(jì)原則之一）。
區(qū)分不同類型的HTML語義

遵守編寫“語義化的HTML”這個(gè)原則，是現(xiàn)代專業(yè)前端開發(fā)的基礎(chǔ)之一。絕大多數(shù)的語義都與當(dāng)前或預(yù)期的內(nèi)容性質(zhì)有關(guān)（如：h1元素，lang屬性，type屬性的email值，Microdata）。

然而，并非所有的語義都需要以內(nèi)容為導(dǎo)向。類名不能“無語義”。不管是用什么名字命名，它們都必須要有意義與目的。類名的語義可以和那些HTML元素不同。我們可以借助HTML元素、某些HTML屬性、Microdata等所具有的“全局性”語義，然后利用網(wǎng)站或應(yīng)用的“局部性”特定語義加以區(qū)分，這些特定語義通常包含在屬性值中，比如class屬性。

盡管在HTML5規(guī)范的class屬性這一章節(jié)中重申了這個(gè)假定的“最佳實(shí)踐”…

…鼓勵(lì)開發(fā)者使用class屬性值描述實(shí)際內(nèi)容，而不是描述期望展現(xiàn)的內(nèi)容。

…并沒有什么內(nèi)在的原因非這樣做不可。事實(shí)上，當(dāng)這種方法在大型網(wǎng)站或者應(yīng)用中運(yùn)用時(shí)，它往往會(huì)成為一種障礙。

HTML元素和其它屬性已經(jīng)提供了內(nèi)容層的語義
對(duì)于機(jī)器或訪問者來說，類名所能透露的有用的語義信息非常少，甚至沒有。除非它是已經(jīng)約定的那一小部分名稱（機(jī)器同樣可讀） —— Mircoformats
類名的主要用途是成為CSS和JavaScript的鉤子。如果你不需要為你的頁面添加表現(xiàn)和行為，那么你或許不必在你的HTML里添加類名
類名應(yīng)該為開發(fā)者傳達(dá)有用的信息。當(dāng)你閱讀一個(gè)DOM片段時(shí)，它將有助于理解某個(gè)類名的具體作用。尤其是在多人協(xié)作的開發(fā)團(tuán)隊(duì)里，與HTML組件打交道的可不光只有前端開發(fā)者。

舉一個(gè)非常簡(jiǎn)單的例子：

總的來說，可擴(kuò)展的HTML/CSS必須依賴HTML中的class，以便創(chuàng)建可重用的組件。一個(gè)靈活的、可重用的組件，既不依賴DOM樹中的某一部分，也不需要使用特定類型的元素。它應(yīng)該能適應(yīng)不同的容器，并且可以很容易地更換主題。如果有必要，額外的HTML元素（超出標(biāo)記內(nèi)容所必須的元素之外的元素）可以讓組件更加強(qiáng)壯。Nicole Sullivan所說的media object就是一個(gè)很好的例子。
避免用類型選擇器支持class，可以讓組件更容易合并。下面這個(gè)例子中，btn組件與uilist組件不易于合并。問題在于.btn的權(quán)重比.uilist a要小（這將覆蓋任何共享屬性）。而且ulist組件需要錨點(diǎn)作為子節(jié)點(diǎn)。
輸出的小10%。但是當(dāng)所有的文件都通過gzip壓縮后，預(yù)處理程序

深度剖析HTML的語意和與其相關(guān)的前端框架_HTML/Xhtml_網(wǎng)頁制作

深度剖析HTML的語意和與其相關(guān)的前端框架_HTML/Xhtml_網(wǎng)頁制作:關(guān)于語義 語義研究的是標(biāo)志與符號(hào)之間的關(guān)系，以及它們所代表的意義。在語言學(xué)中，它主要是研究這些標(biāo)志（如單詞，短語，或者聲音）在語言中的意義。而在前端開發(fā)領(lǐng)域，語義主要涉及的是HTML元素、屬性和屬性值（包括像Microdata這樣的擴(kuò)展）所約定的意義。這

推薦度：

點(diǎn)擊下載本文 文檔為doc格式