淺談HTML的語(yǔ)義化和一些簡(jiǎn)單優(yōu)化
我要評(píng)論1、什么是語(yǔ)義化？
必應(yīng)網(wǎng)典的解釋
語(yǔ)義化是指用合理HTML標(biāo)記以及其特有的屬性去格式化文檔內(nèi)容。通俗地講,語(yǔ)義化就是對(duì)數(shù)據(jù)和信息進(jìn)行處理,使得機(jī)器可以理解. 語(yǔ)義化的(X)HTML文檔有助于提升你的網(wǎng)站對(duì)訪客的易用性，比如使用PDA、文字瀏覽器以及殘障人士將從中受益。對(duì)于搜索引擎或者爬蟲(chóng)軟件來(lái)說(shuō)，則有助于它們建立索引，并可能給予一個(gè)較高的權(quán)值。 事實(shí)上SEO最有效的一種辦法，就是對(duì)網(wǎng)頁(yè)的HTML結(jié)構(gòu)進(jìn)行重構(gòu)，實(shí)質(zhì)上就是語(yǔ)義化。
簡(jiǎn)單來(lái)說(shuō)，就是根據(jù)內(nèi)容的結(jié)構(gòu)化（內(nèi)容語(yǔ)義化），選擇合適的標(biāo)簽（代碼語(yǔ)義化）便于開(kāi)發(fā)者閱讀和寫(xiě)出更優(yōu)雅的代碼的同時(shí)讓瀏覽器的爬蟲(chóng)和機(jī)器很好地解析，什么樣的內(nèi)容就用什么樣的標(biāo)簽。
2、語(yǔ)義化的好處？
在css文件沒(méi)有成功加載的時(shí)候頁(yè)面也能呈現(xiàn)好的內(nèi)容結(jié)構(gòu)；利于SEO，讓搜索引擎和爬蟲(chóng)軟件抓取更多有用的信息，建立索引，獲取較高的權(quán)值；方便其他設(shè)備解析（如屏幕閱讀器、盲人閱讀器、移動(dòng)設(shè)備）以意義的方式來(lái)渲染網(wǎng)頁(yè)；3、HTML5的語(yǔ)義化
最新的HTML5就網(wǎng)頁(yè)結(jié)構(gòu)化增加了一系統(tǒng)的結(jié)構(gòu)化標(biāo)簽
結(jié)構(gòu)：
- <header>頭部</header>
- <nav>導(dǎo)航</nav>
- <article>
- <section>內(nèi)容1</section>
- <section>內(nèi)容2</section>
- <section>內(nèi)容3</section>
- </article>
- <aside>側(cè)邊欄</aside>
- <footer>底部</footer>
4、寫(xiě)HTML需要注意的點(diǎn)
標(biāo)簽閉合</>，/>;
正確使用標(biāo)簽嵌套，避免行內(nèi)元素包圍塊元素；
合理使用標(biāo)簽，盡量少使用無(wú)語(yǔ)義的標(biāo)簽div，span，在css文件沒(méi)有成功加載的時(shí)候頁(yè)面也能呈現(xiàn)好的內(nèi)容結(jié)構(gòu)；
使用<h1>、<h2>、<h3>、<h4>、<h5>、<h6>,作為標(biāo)題使用，并且依據(jù)重要性遞減，<h1>是最高的等級(jí)；
使用<p>區(qū)分段落，避免使用<br />換行；
不要使用純樣式的標(biāo)簽，b，font，u等，改為css設(shè)置；
使用表格時(shí)，使用<thead>，<tbody>，<tfoot>包圍頭部，主體內(nèi)容，表格；
5、關(guān)于SEO優(yōu)化，HTML需要做些什么？
文檔類(lèi)型統(tǒng)一使用HTML5 doctype <!DOCTYPE HTML>；
meta標(biāo)簽優(yōu)化，主要有title、description、keywords三個(gè)地方，結(jié)束不要使用“ />”，應(yīng)該直接寫(xiě)“>”；
css文件最好使用一個(gè)，放在頭部<head>標(biāo)簽里面；
js文件最好放在底部，避免因加載js文件阻塞HTML的渲染；
使用外聯(lián)文件，避免在HTML直接寫(xiě)css和js的代碼；
引入文件時(shí)使用絕對(duì)地址，絕對(duì)地址包括了網(wǎng)站的域名；
img標(biāo)簽加上alt關(guān)鍵字，利于SEO優(yōu)化，盡量不要使用“的”、“上”、“好”、“等等”等，搜索引擎數(shù)據(jù)庫(kù)默認(rèn)不收錄的字；
logo處加h1標(biāo)簽，搜索引擎默認(rèn)h1標(biāo)簽這個(gè)標(biāo)題是網(wǎng)頁(yè)中最重要的信息，所以我們把最重要信息入在<H1>標(biāo)簽內(nèi)；
關(guān)于html網(wǎng)頁(yè)是否符合標(biāo)準(zhǔn)，可以在這個(gè)網(wǎng)頁(yè)檢查，直接輸入鏈接即可查看檢查結(jié)果
以上就是小編為大家?guī)?lái)的淺談HTML的語(yǔ)義化和一些簡(jiǎn)單優(yōu)化全部?jī)?nèi)容了，希望大家多多支持腳本之家~
相關(guān)文章
- 這篇文章主要介紹了HTML5語(yǔ)義化元素的相關(guān)知識(shí)，非常不錯(cuò)，具有一定的參考借鑒價(jià)值，需要的朋友參考下吧2019-08-22
- HTML5 只有一個(gè)簡(jiǎn)單的文檔類(lèi)型：<!DOCTYPE html>，表示瀏覽器會(huì)按照標(biāo)準(zhǔn)模式解析。今天小編給大家?guī)?lái)了HTML5新特性之語(yǔ)義化標(biāo)簽，感興趣的朋友一起看看吧2017-10-31
- b 和 i 標(biāo)簽在現(xiàn)在的 Web 標(biāo)準(zhǔn)潛規(guī)則中是不推薦使用，甚至是反對(duì)使用的，因?yàn)檎J(rèn)為他們只是“表現(xiàn)”粗體和斜體，而沒(méi)有任何“語(yǔ)義”。更多的用 strong2008-10-17
HTML5 語(yǔ)義化結(jié)構(gòu)化規(guī)范化
HTML結(jié)構(gòu)更加清晰、規(guī)范，學(xué)習(xí)HTML5優(yōu)化結(jié)構(gòu)的思路。 HTML5添加了一些新元素，用來(lái)標(biāo)識(shí)常用的結(jié)構(gòu)，是html更具語(yǔ)義化，可是我們無(wú)法直接使用，即使可能用到還要等他個(gè)十年2008-10-17- 本篇文章小編為大家介紹HTML標(biāo)簽語(yǔ)義化（含H5） ，有需要的朋友可以參考一下2013-04-08
這篇文章主要介紹了詳解HTML5常用的語(yǔ)義化標(biāo)簽的相關(guān)資料,需要的朋友可以參考下2019-09-27淺談?wù)Z義化的HTML結(jié)構(gòu)到底有什么好處
下面小編就為大家?guī)?lái)一篇淺談?wù)Z義化的HTML結(jié)構(gòu)到底有什么好處。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-08-05使用語(yǔ)義化標(biāo)簽去寫(xiě)你的HTML 兼容IE6,7,8
下面小編就為大家?guī)?lái)一篇使用語(yǔ)義化標(biāo)簽去寫(xiě)你的HTML 兼容IE6,7,8。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考，一起跟隨小編過(guò)來(lái)看看吧2016-04-14- html標(biāo)簽語(yǔ)義：即html標(biāo)簽的含義2012-11-17
- 前兩天參加了公司組織的一個(gè)WD培訓(xùn)，有一節(jié)課講了標(biāo)簽語(yǔ)義化，聽(tīng)了之后感覺(jué)特別有用，更正了我以前對(duì) HTML 和 CSS 的錯(cuò)誤看法。2011-01-25
