摘要:語(yǔ)義化簡(jiǎn)單來說,我們可以理解為用正確的標(biāo)簽做正確的事情。正確使用語(yǔ)義標(biāo)簽可以帶來很多好處。一些語(yǔ)義類標(biāo)簽介紹用于展示介紹性內(nèi)容,通常包含一組介紹性的或是輔助導(dǎo)航的實(shí)用元素。表示小時(shí)制時(shí)間。表示術(shù)語(yǔ)的一個(gè)定義。
本文最初于 2018-09-21 發(fā)布于 知乎 ,后在 《重學(xué)前端》 專欄的學(xué)習(xí)中,重新復(fù)習(xí)整理,發(fā)布于 Github 上,并計(jì)劃寫一系列前端學(xué)習(xí)相關(guān)的文章。歡迎 star 。HTML 語(yǔ)義化
簡(jiǎn)單來說,我們可以理解為:用正確的標(biāo)簽做正確的事情。
例如:
段落用 p 標(biāo)簽,標(biāo)題用 h 系列標(biāo)簽,邊欄用 aside 標(biāo)簽,主要內(nèi)容用 main 標(biāo)簽。正確使用語(yǔ)義標(biāo)簽可以帶來很多好處。
為什么要關(guān)注 HTML 語(yǔ)義化?(為什么要使用語(yǔ)義類標(biāo)簽?)對(duì)人:
增強(qiáng)可讀性,對(duì)開發(fā)者更友好,在沒有 CSS 的情況下也能較好地呈現(xiàn)網(wǎng)頁(yè)的內(nèi)容結(jié)構(gòu)與代碼結(jié)構(gòu),便于團(tuán)隊(duì)的開發(fā)和維護(hù)。
對(duì)機(jī)器:
有利于 SEO ,可以讓搜索引擎爬蟲更好地獲取到更多有效信息,搜索引擎的爬蟲依賴于標(biāo)簽來確定上下文和各個(gè)關(guān)鍵字的權(quán)重,有效提升網(wǎng)頁(yè)的搜索量。
支持讀屏軟件,方便其他設(shè)備的解析(如屏幕閱讀器、盲人閱讀器等),利于無障礙閱讀,提高可訪問性。
一些語(yǔ)義類標(biāo)簽介紹用于展示介紹性內(nèi)容,通常包含一組介紹性的或是輔助導(dǎo)航的實(shí)用元素。
表示最近一個(gè)章節(jié)內(nèi)容或者根節(jié)點(diǎn)元素的頁(yè)腳。通常出現(xiàn)在尾部,包含一些作者信息、相關(guān)鏈接、版權(quán)信息等。
表示跟文章主體不那么相關(guān)的部分,可能包含導(dǎo)航、廣告等工具性質(zhì)的內(nèi)容。
側(cè)邊欄是 aside,aside 不一定是側(cè)邊欄。
aside 和 header 中都可能出現(xiàn)導(dǎo)航 ,header 中的導(dǎo)航多數(shù)是到文章的目錄,而 aside 中的導(dǎo)航多是到關(guān)聯(lián)頁(yè)面或者整站地圖。
footer 中可以包含此元素。
容易誤用,并非表示單純的地址,而是表示「文章作者的聯(lián)系方式」。
可以讓作者為它最近的 或者 祖先元素提供聯(lián)系信息。在后一種情況下,它應(yīng)用于整個(gè)文檔。
表示標(biāo)題組。
表示重音。同樣一句話里如果重音不同,表達(dá)的意思也許大相徑庭。
表示文本十分重要,一般用粗體顯示。
表示縮寫。
橫向分割線,表示段落級(jí)元素之間的主題轉(zhuǎn)換(例如,一個(gè)故事中的場(chǎng)景的改變,或一個(gè)章節(jié)的主題的改變)。
表示段落級(jí)引述內(nèi)容。
表示行內(nèi)的引述內(nèi)容。
表示引述的作品名。
表示24小時(shí)制時(shí)間。
和
兩者常配合使用,表示一段獨(dú)立的內(nèi)容,并且作為一個(gè)獨(dú)立的引用單元。
當(dāng)它屬于主體(main flow)時(shí),它的位置獨(dú)立于主體。這個(gè)標(biāo)簽經(jīng)常是在主文中引用的圖片,插圖,表格,代碼段等等,當(dāng)這部分轉(zhuǎn)移到附錄中或者其他頁(yè)面時(shí)不會(huì)影響到主體。 -- MDN
表示術(shù)語(yǔ)的一個(gè)定義。
The Internet is a global system of interconnected networks that use the Internet Protocol Suite (TCP/IP) to serve billions of users worldwide.
導(dǎo)航欄、有序列表、無序列表
中的內(nèi)容會(huì)保持原有格式。
元素用于標(biāo)識(shí)計(jì)算機(jī)程序輸出。
表示一段計(jì)算機(jī)代碼。
對(duì)于語(yǔ)義類標(biāo)簽的使用也許會(huì)帶來一些爭(zhēng)議,我們應(yīng)該遵循的原則是:
盡量只用自己熟悉的語(yǔ)義標(biāo)簽。用對(duì)比不用好,不用比用錯(cuò)好。
提示:
你可以在百度或者谷歌搜索中輸入「標(biāo)簽名稱」+「MDN」這兩個(gè)關(guān)鍵字來查看更加專業(yè)和詳細(xì)的解釋。
另外安利一個(gè) HTML 標(biāo)簽的學(xué)習(xí)鏈接:
HTML Reference - A free guide to all HTML elements and attributes
(完)
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://specialneedsforspecialkids.com/yun/53803.html
摘要:代碼示例語(yǔ)義化語(yǔ)義化語(yǔ)義化語(yǔ)義化語(yǔ)義化年月日小維語(yǔ)義化標(biāo)簽包括還有等。而沒有語(yǔ)義化的元素如則推薦使用。語(yǔ)義化包含了標(biāo)簽語(yǔ)義化和命名語(yǔ)義化。 什么是Web語(yǔ)義化 Web語(yǔ)義化是指使用恰當(dāng)語(yǔ)義的html標(biāo)簽、class類名等內(nèi)容,讓頁(yè)面具有良好的結(jié)構(gòu)與含義,從而讓人和機(jī)器都能快速理解網(wǎng)頁(yè)內(nèi)容。語(yǔ)義化的web頁(yè)面一方面可以讓機(jī)器在更少的人類干預(yù)情況下收集并研究網(wǎng)頁(yè)的信息,從而可以讀懂網(wǎng)頁(yè)的內(nèi)...
摘要:語(yǔ)義化的頁(yè)面一方面可以讓機(jī)器在更少的人類干預(yù)情況下收集并研究網(wǎng)頁(yè)的信息,從而可以讀懂網(wǎng)頁(yè)的內(nèi)容,然后將收集匯總的信息進(jìn)行分析,結(jié)果為人類所用另一方面它可以讓開發(fā)人員讀懂結(jié)構(gòu)和用戶以及屏幕閱讀器如果訪客有視障能夠讀懂內(nèi)容。 我眼中的Web 語(yǔ)義化 web語(yǔ)義化是什么? Web語(yǔ)義化,使用語(yǔ)義恰當(dāng)?shù)臉?biāo)簽,可以讓頁(yè)面具有良好的結(jié)構(gòu),頁(yè)面元素具有良好的含義,從而讓人和機(jī)器都能快速理解。語(yǔ)義化的...
摘要:語(yǔ)義化的頁(yè)面一方面可以讓機(jī)器在更少的人類干預(yù)情況下收集并研究網(wǎng)頁(yè)的信息,從而可以讀懂網(wǎng)頁(yè)的內(nèi)容,然后將收集匯總的信息進(jìn)行分析,結(jié)果為人類所用另一方面它可以讓開發(fā)人員讀懂結(jié)構(gòu)和用戶以及屏幕閱讀器如果訪客有視障能夠讀懂內(nèi)容。 我眼中的Web 語(yǔ)義化 web語(yǔ)義化是什么? Web語(yǔ)義化,使用語(yǔ)義恰當(dāng)?shù)臉?biāo)簽,可以讓頁(yè)面具有良好的結(jié)構(gòu),頁(yè)面元素具有良好的含義,從而讓人和機(jī)器都能快速理解。語(yǔ)義化的...
摘要:邏輯學(xué)的語(yǔ)義學(xué)著眼點(diǎn)在于邏輯系統(tǒng)的語(yǔ)義解釋,是一個(gè)理想化的模型系統(tǒng),不直接涉及自然語(yǔ)言。例如,通過幫助臨床研究中的決策,語(yǔ)義技術(shù)將跨機(jī)構(gòu)橋接多種形式的生物和醫(yī)學(xué)信息。 showImg(https://segmentfault.com/img/bVbrJYw?w=758&h=420); 前端工程師的招聘中,經(jīng)常有這樣的要求:對(duì)Web 語(yǔ)義化有深刻理解。那么到底什么才是深刻理解Web語(yǔ)義化...
閱讀 1246·2021-09-04 16:41
閱讀 2403·2021-09-02 10:18
閱讀 917·2019-08-29 16:40
閱讀 2614·2019-08-29 16:14
閱讀 898·2019-08-26 13:41
閱讀 1299·2019-08-26 12:24
閱讀 731·2019-08-26 10:24
閱讀 2869·2019-08-23 17:54