、
這篇文章帶給大家了html中語意化的相關知識,所謂語意化,就是憑著HTML本身,也能體驗出人性化的結構,希望對大家有幫助。
在講什麼是語意化之前,先看看語意化的背景。
在先前的文章中提到HTML最重要的特性,那就是標籤。但是項目一大,標籤多的看不懂,一堆疊一堆。有些命名奇奇怪怪,想維護被勸退,團隊協作導致團戰開始!
因此語意化迫在眉睫!
在我們寫HTML時其實無所謂,因為你裡面長啥樣,使用者看不到,也不用看到。
因為你有CSS的漂亮衣服,即使你的HTML一塌糊塗,CSS也可以讓它光鮮亮麗。
但是使用者看不到,開發者看得到呀!因此,這個語意化的友善者就是開發者本身。
所謂語意化,就是憑著HTML本身,也能體驗出人性化的結構!
在沒有CSS的情況下,頁面也能呈現出很好地內容結構、程式碼結構。這樣開發者一眼就明了你的意圖,一秒破冰!
對SEO友善。對開發者友好,那麼對開發者的小蟲子們也是當然!
當標籤應用得當,體現出上下文中你想要關鍵字的權重,那麼搜尋引擎爬蟲就到了你的頭上了。那麼網站的訪問量不就來了嗎。
可以支援一些特殊的裝置(盲人閱讀、行動裝置),網頁翻譯等。
最直觀的一點,便是你的隊友都希望和你合作!你的程式碼的語意化,隊友都愛啊!
語意化更具可讀性,遵循W3C標準的團隊都遵循這個標準,可以減少差異化。 (跳槽快速融入?)
不要使用一些純樣式標籤,這些CSS會幫我們做到。如:b、font、u等一些標籤。
需要強調的文本,可以包含在strong或em標籤中(,strong預設樣式是加粗(不要用b),em是斜體(不用i)。使用mark標籤來表示標註的/突出顯示的文字。
但是還是可以考慮使用CSS來完成。
每個input標籤對應的說明文字都需要使用label標籤,並且透過為input設定id屬性,在lable標籤中設定for=someld來讓說明文字和相對應的input關聯起來。
表單域要用fieldset標籤包起來,並用legend標籤說明表單的用途。
應該使用<h1> - <h6></h6>
</h1>
#來表示標題。
#當用CSS寫樣式的時候命名也需要遵循HTML的結構,體現出語義化的本質。
1、
通常包含頁面的正副標題。
<header> <h1>他真的是美男子吗?</h1> <p>据现场勘查,他真的是美男子!</p> </header>
、
或
<main> <h1>我的介绍</h1> <p>我是一个聪明的孩子</p></main>
4、<section></section>
標籤定義文件中的片段。
例如章節、頁首、頁尾或文件中的其他部分。
<section> <h1>PRC</h1> <p>The People's Republic of China was born in 1949...</p></section>
5、<article></article>
標籤規定獨立的自包含內容
例如文章下的評論之類的
<article> <h1>我为什么聪明呢</h1> <p>我聪明的秘诀是我爱思考</p></article>
以上是講講對HTML5的一大特性之語意化的理解的詳細內容。更多資訊請關注PHP中文網其他相關文章!