html5語義化標簽:1、header標簽;2、nav標簽;3、footer標簽;4、hgroup標簽;5、section標簽;6、article標簽;7、aside標簽;8、figure標簽;9、time標簽;10、address標簽。
本教程操作環(huán)境:windows7系統(tǒng)、HTML5版、Dell G3電腦。
HTML語義化:
每個HTML標簽都有自己特定含義(語義),語義化是指使用語義恰當?shù)臉撕?/strong>,使頁面有良好的結(jié)構(gòu),頁面元素有含義,能夠讓人和搜索引擎都容易理解。
看過一個比較形象的例子:
蓋一棟房子的時候,有的地方該用磚頭,有的部分該用瓷片,還有的地方得用水泥糊上,這樣蓋出來房子才會結(jié)實,整潔和美觀。
如果硬是要瓷片替代磚頭,房子勉強也能蓋起來,但是這樣的房子不牢固,容易倒塌,外觀也不好看。
同樣,生活很多事物都有相似相同之處!該用什么標簽表示就用什么標簽表示,結(jié)構(gòu)良好,更易人和搜索引擎理解。還有一點,就是便于開發(fā)和維護啊,看過好多網(wǎng)頁結(jié)構(gòu),各種想吐槽好嗎?各種混亂不堪,外觀表現(xiàn)的任務(wù)交由css去實現(xiàn)就行啦,不要為了外觀表現(xiàn)而布局!
語義化的意義與作用
- 去掉或者丟失樣式的時候能夠讓頁面呈現(xiàn)出清晰的結(jié)構(gòu)
- 用戶體驗:例如title、alt用于解釋名詞或解釋圖片信息、label標簽的活用;
- 有利于SEO:和搜索引擎建立良好溝通,有助于爬蟲抓取