HTML标签语义化
<Hx>
<h1>、<h2>、<h3>、<h4>、<h5>、<h6>,作為標題使用,并且依據重要性遞減。<h1>是最高的等級。
P
段 落標記,知道了 p 作為段落,你就不會再使用<br />來換行了,而且不需要<br /> 來區分段落與段落。p中的文字會自動換行,而且換行的效果優于<br />。段落與段落之間的空隙也可以利用CSS來控制,很容易而且清晰的區分出段落與段落。
<ul>、<ol>、<li>
<ul> 無序列表,這個被大家廣泛的使用,<ol>有序列表也挺常用。在web標準化過程中,<ul> 還被更多的用于導航條,本來導航條就是個列表,這樣做是完全正確的,而且當你的瀏覽器不支持CSS的時候,導航鏈接仍然很好使,只是美觀方面差了一點而 已。
<dl>、<dt>、<dd>
dl就是“定義列表”。比如說詞典里面的詞的解釋、定義就可以用這種列表。
<em>、< strong >
<em> 是用作強調的,strong是用作重點強調的。
<table>、<td>、<th>、< caption >、 summary
XHTML 中的表格不再是用來布局。如果是為了標記列表的數據,就應該使用表格了。<th>為表格標題,屬性summar為摘要(要想提高搜索的排名這 個絕對不應該少),<caption>標簽為首部說明,<thead>標簽為表格頭部,<tbody>標簽為表格主 體內容,<tfoot>標簽為表格尾部。
<ins>, <del>
知道del,就不要再用<s>做刪除線了,用del顯然更具有語義化。而且del還帶有cite和datetime來表明刪除的原因以及刪除的時間。ins是表示插入,也有這樣的屬性。
<abbr>、<acronym>
<abbr>標簽是表示web頁面上的簡稱,<acronym>標簽為取首字母縮寫。
alt屬性和title屬性
title屬性用來為元素提供額外說明信息,但是并不是必須的。
alt屬性為不能顯示圖像、窗體或applets的用戶代理(UA),指定替換文字。替換文字的語言由lang屬性指定。
讓你語義化HTML結構的無數條理由:
1.去掉或樣式丟失的時候能讓頁面呈現清晰的結構:
HTML 本身是沒有表現的,我們看到例如<h1>是粗體,字體大小2em,加粗;<strong>是加粗的, 不要誤會這是HTML的表現,這些其實是HTML默認的CSS樣式在起作用。所以去掉或樣式丟失的時候,也能讓頁面呈現清晰的結構,增強頁面的可讀性。
2.屏幕閱讀器(如果訪客有視障)會完全根據你的標記來“讀”你的網頁。
如果你使用的含語義的標記,屏幕閱讀器會根據你的標簽來判斷網頁的內容,而不是一個字母一個字母的拼寫出來。
3.PDA、手機等設備可能無法像普通電腦的瀏覽器一樣來渲染網頁(因為這些設備對CSS的支持較弱)。
使用語義標記可以確保這些設備以一種有意義的方式來渲染網頁。理想情況下,觀看設備的任務是符合設備本身的條件來渲染網頁。
4.搜索引擎的爬蟲也依賴于標記來確定上下文和各個關鍵字的權重。
搜索引擎的爬蟲也是網站的“訪客”,現在它們是極其寶貴的用戶。沒有他們的話,搜索引擎將無法索引你的網站,然后一般用戶將很難過來訪問。
5.便于團隊開發和維護
在團隊中大家都遵循同一個標準,可以減少很多差異化的東西,方便開發和維護,提高開發效率,甚至實現模塊化開發。
轉載于:https://www.cnblogs.com/yhongyu/archive/2012/06/01/2530891.html
總結
- 上一篇: 为什么过桥米线要叫过桥米线?
- 下一篇: 2017年html5行业报告,云适配发布