html學習之——標簽語義化
阿新 • • 發佈:2017-09-11
使用 標題 網站 省略符 顯示 del class itl tle
html語義化在前端學習中會經常出現,下面對html語義化做個總結
一、什麽是HTML語義化
HTML語義化總的來說就是用正確的標簽做正確的事。圍繞著一些標簽展開,如h1-h6。把適當的標簽用在合適的地方。是頁面結構更加的清晰。
二、html語義化有什麽作用
1、使用html語義化,能使頁面結構更清晰,便於解析。
2、有利於SEO。搜索引擎爬蟲依賴於html標簽來確定上下文和關鍵字權重。
3、使用html語義化,在沒有css樣式的時候頁面也能正確清晰的呈現
4、有利於各種設備的解析,如盲人閱讀器,屏幕閱讀器
5、有利於團隊合作開發與維護。
三、html5增加的語義化標簽
1、<title></title>
頁面的標題,具有唯一性,標題的取名盡量包含網頁幾個關鍵字。
2、<h1-h6></h1-h6>
用於分級標題,創建網頁的層級關系。如果搜的的關鍵詞與分級標題相匹配,則標題就會被賦予很高的權重。
3、<header></header>
網站的標誌,主導航,搜索框等
4、<nav></nav>
網站的導航。
5、<mian></mian>
網頁的主要內容,一個網頁只能有一個
6、<article></article>
一個獨立的容器,比如文檔,網頁,像報紙一樣包起來。
7、<section><section>
網站相似主題的一些內容,如自我介紹、聯系信息等 。
8、<aside></aside>
附註欄,比如側欄,引述,產品列表,鏈接等。
9、<footer></footer>
表示頁腳
10、<small></small>
指定細則,輸入免責聲明、註解、署名、版權。
11、<strong></strong>
表示內容的重要性
12、<em></em>
強調內容的重要性
13、<mark></mark>
突出顯示文本,梯形讀者
14、<cite></cite>
指明引用或參考的內容,並不從中引述
15、<blockquoto></blockquoto>
表示引述的內容
16、<q></q>
表示短引述
17、<figure></figure>
創建圖
18、figurecaption></figurecaption>
創建圖的標題,必須在前面或者結尾
19、<abbr></abbr>
省略符
20、<dfn></dfn>
定義術語元素
21、<time></time>
表示時間
22、<code></code>
表示編碼
23、<address></address>
表示一些信息,如地址
24、<del></del>
表示刪除的內容
25、<ins></ins>
表示添加的內容
<pre></pre>
預格式化文本
html學習之——標簽語義化