2021-01-08 分類: 網(wǎng)站建設(shè)
前兩天參加了公司組織的一個WD培訓(xùn),有一節(jié)課講了標(biāo)簽語義化,聽了之后感覺特別有用,更正了我以前對 HTML 和 CSS 的錯誤看法。
首先說明的一點是,人可以通過視覺的劃分判斷內(nèi)容的語義,搜索引擎看到的只是代碼。搜索引擎只能通過標(biāo)簽來判斷內(nèi)容的語義。 以前我真的沒有怎么重視過搜索引擎,現(xiàn)在開始比較在意了,因為頁面的很大一部分流量是來自搜索引擎的,要使頁面盡可能地對搜索引擎友好,所以就要盡可能地使標(biāo)簽語義化。
以前以我對web開發(fā)的粗淺理解,覺得寫一個好的符合標(biāo)準(zhǔn)的頁面只需要把結(jié)構(gòu)和表現(xiàn)分離,然后不要使用table,font等標(biāo)簽就行了,至于通篇都是div我也不會覺得有什么問題,因為CSS很強(qiáng)大。但是,所有的標(biāo)簽都是有自己的語義的,下面給出一部分標(biāo)簽的語義:
div 語義:Division(分隔)
span 語義:Span(范圍)
ol 語義:Ordered List(排序列表)
ul 語義:Unordered List(不排序列表)
li 語義:List Item(列表項目)
…………
如果無視標(biāo)簽語義和默認(rèn)樣式,所有標(biāo)簽都用div,其實也是可以寫出來視覺效果很好的頁面,只要你靈活運用CSS。但是那樣的話雖然視覺上達(dá)到了要求,但是整個頁面一點語義都沒有,搜索引擎還是看不懂。所以,要記?。?/p>
結(jié)構(gòu)(html)才是重點,樣式(css)是用來修飾結(jié)構(gòu)的。所以,要先確定html,確定標(biāo)簽,再來選用合適的css。
一般來說,所有的標(biāo)簽都會有一個默認(rèn)的樣式,所以一個簡單的判斷網(wǎng)頁標(biāo)簽語義是否良好的方法就是:去掉樣式,看網(wǎng)頁結(jié)構(gòu)是否組織良好有序,是否仍然有很好的可讀性。
另外,值得重點提及的是h標(biāo)簽,h標(biāo)簽的語意是標(biāo)題,搜索引擎對這個標(biāo)簽比較敏感,特別是h1,和h2。一個語義良好的頁面,h標(biāo)簽應(yīng)該是完整有序沒有斷層的。也就是說,要h1,h2,h3,h4這樣推下來,不要h1,h3,h4,漏掉h2。一個結(jié)構(gòu)良好的網(wǎng)頁,h標(biāo)簽可以組織起一個網(wǎng)頁的大綱。
以上這些東西都是WD的工程師阿當(dāng)講的,我受益匪淺,加深了對html的理解。HTML 雖然很簡單,但是要用好也是很不容易的。
當(dāng)前標(biāo)題:加深對HTML和CSS標(biāo)簽語義化的理解
網(wǎng)站鏈接:http://jinyejixie.com/news/96290.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供微信小程序、外貿(mào)建站、網(wǎng)站維護(hù)、關(guān)鍵詞優(yōu)化、網(wǎng)站營銷、小程序開發(fā)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容