資訊專欄INFORMATION COLUMN
摘要：網(wǎng)站標(biāo)簽的用法和技巧我們首先要明白是什么。所以按照標(biāo)簽的級別，我們理所應(yīng)當(dāng)?shù)膽?yīng)該把標(biāo)簽用在網(wǎng)站最核心的內(nèi)容上。最好是在網(wǎng)頁源代碼的標(biāo)簽一開始的第一個容器中第一行出現(xiàn)。首頁及內(nèi)頁的欄目標(biāo)題均使用標(biāo)簽。
網(wǎng)站h1,h2,h3標(biāo)簽的用法和技巧
我們首先要明白h1,h2是什么。在HTML語言中有到定義標(biāo)題頭的六個不同文字大小的TAGES。本質(zhì)是為了呈現(xiàn)內(nèi)容結(jié)構(gòu)，共有六種標(biāo)簽，文字從大到小，權(quán)重依此反而降低。也就是說H1>H2>H3，依此類推。他在優(yōu)化中也是起著，呈現(xiàn)內(nèi)容結(jié)構(gòu)的一個作用，這樣分配的好處把網(wǎng)頁整個結(jié)構(gòu)由主到次區(qū)分開來，搜索引擎抓取網(wǎng)頁的時候就會按著這樣的順序進(jìn)行抓取索引。
h1,h2標(biāo)簽可以在任何地方使用，任何你覺得可以凸顯網(wǎng)頁內(nèi)容主次的地方進(jìn)行使用。舉個例子，網(wǎng)站的首頁。通常來說網(wǎng)站的首頁最主要的地方就是網(wǎng)站的名稱，因為網(wǎng)站的主題是圍繞網(wǎng)站名稱來進(jìn)行建造的。所以按照標(biāo)簽的級別，我們理所應(yīng)當(dāng)?shù)膽?yīng)該把H1標(biāo)簽用在網(wǎng)站最核心的內(nèi)容上。當(dāng)然也有例外，比如說網(wǎng)站是一個門戶站，例如網(wǎng)站名稱是新浪。但我們思路仍然可以套用，把H1定義在最核心的內(nèi)容上。
首頁的核心內(nèi)容已經(jīng)固定，就剩下導(dǎo)航欄目，還有一些其他調(diào)用的欄目了。網(wǎng)站導(dǎo)航欄目有很多連接指向他，并且是長期固定不變的，必然權(quán)重不會低，所以我們可以把這個H2標(biāo)簽的機(jī)會用在那些不是導(dǎo)航，又在首頁調(diào)用的欄目上。然后就是H3，我們稍加安排就好。
首先我要知道，什么是heading標(biāo)簽？w3school的相關(guān)文字：
-
標(biāo)簽可定義標(biāo)題。 定義最大的標(biāo)題。 定義最小的標(biāo)題。由于 h 元素?fù)碛写_切的語義，因此請您慎重地選擇恰當(dāng)?shù)臉?biāo)簽層級來構(gòu)建文檔的結(jié)構(gòu)。因此，請不要利用標(biāo)題標(biāo)簽來改變同一行中的字體大小。相反，我們應(yīng)當(dāng)使用層疊樣式表定義來達(dá)到漂亮的顯示效果。
注：heading標(biāo)簽均為塊級元素（block）
為什么要使用heading標(biāo)簽？h1，h2，h3 的用法：我們所使用到的標(biāo)簽，都應(yīng)該是有含義的：比如ul是無序列表，適合做新聞列表；ol是有序列表，適合做排行版；del是刪除線，適合用來放
b2c的“原價”；address里放的是地址；blockquote大段引用。其它義語標(biāo)簽的用法，在這里暫不一一列舉，等等這些，為得是能讓搜索引擎知道，這些內(nèi)容到底是什么意思，也算是比較淺顯的所謂人機(jī)交互。
h1 — 大標(biāo)題，放置于首頁頂部區(qū)域，通常即導(dǎo)航以上的部分，全站通用，用來詮釋整個網(wǎng)站的內(nèi)容，應(yīng)包含網(wǎng)站主關(guān)鍵字，但切忌不要進(jìn)行關(guān)鍵字堆砌。最好是在網(wǎng)頁源代碼的body標(biāo)簽一開始的第一個容器中第一行出現(xiàn)。且保證一個頁面中只出現(xiàn)一次或者零次。
h2 — 副標(biāo)題，每個頁面出現(xiàn)的次數(shù)以1-3次為宜。
首頁：同h1，放置于主頭部區(qū)域，于h1的下方，全站調(diào)用，同樣用于概括整站的內(nèi)容。或者在頭部通用區(qū)域的下方，首頁內(nèi)容的開頭或者中間部分使用一次，用于詮釋首頁的內(nèi)容。
子頻道頁：無論頂部區(qū)域是否出現(xiàn)過一次h2，可結(jié)合實際情況在頭部通用區(qū)域的下方，頁面內(nèi)容的開頭部分使用一次，用于詮釋頻道頁面的內(nèi)容。
（以上2種方法可以任選其一，也可以同時并存）
文章/產(chǎn)品內(nèi)頁：文章的標(biāo)題使用h2標(biāo)簽。
按以上方法，h2標(biāo)簽最多會被使用到3次，但是請少使用1次。據(jù)以往經(jīng)驗來看，文章/產(chǎn)品內(nèi)頁使用h2標(biāo)簽效果顯著。
h3 — 三級標(biāo)題，h3的使用次數(shù)，沒有明確的規(guī)定，大家用到該用的地方就行。
首頁及內(nèi)頁的欄目標(biāo)題均使用h3標(biāo)簽。剛才說道h2適用于文章內(nèi)頁的文章標(biāo)題上，那么h3我通常也用到文章的分段標(biāo)題上
本文基本內(nèi)容來自：http://panyanfeng.com/website-h1-h2-h3-tag-usage-and-skills/
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/49541.html
showImg(https://segmentfault.com/img/remote/1460000018747727?w=900&h=500); 簡介 heading 標(biāo)簽、SEO、無障礙閱讀 ps: 內(nèi)容有點多，本來只想講一個點，但是關(guān)聯(lián)性太強(qiáng)了，所以辛苦大家了。 在學(xué)習(xí) HTML 標(biāo)簽的時候，很多教程只告訴你 怎么用 而沒有講清楚 是什么，讓我們一起從 h1 到 h6 開始重新認(rèn)識 HTM...
摘要：在以前寫代碼的時候，一般都會在里添加重置樣式，其內(nèi)容如下但是最近在網(wǎng)上看了看網(wǎng)絡(luò)文章，也感覺有些重置是沒有用的。當(dāng)然重置的優(yōu)點，缺點都不說了，估計心里都非常有數(shù)的，還是要根據(jù)實際項目來。后來主管給我推薦了一款替代重置的替代方案，那就是用。 在以前寫html代碼的時候，一般都會在head里添加重置樣式reset.css，其內(nèi)容如下： @charset utf-8; html, body,...
摘要：前言還有幾天就到國慶中秋了，快要放假了，先祝大家節(jié)日快樂之前寫過的寫作建議和技巧，那么今天就來聊聊吧說到，每一個網(wǎng)頁都離不開，但是對于，很多開發(fā)者的想法就是，只要能用來布局，把效果圖排出來就可以了，其它的細(xì)節(jié)或者優(yōu)化，不需要怎么考慮。 1.前言 還有幾天就到國慶中秋了，快要放假了，先祝大家節(jié)日快樂！之前寫過js的寫作建議和技巧，那么今天就來聊聊css吧！說到css，每一個網(wǎng)頁都離不開c...
摘要：前言還有幾天就到國慶中秋了，快要放假了，先祝大家節(jié)日快樂之前寫過的寫作建議和技巧，那么今天就來聊聊吧說到，每一個網(wǎng)頁都離不開，但是對于，很多開發(fā)者的想法就是，只要能用來布局，把效果圖排出來就可以了，其它的細(xì)節(jié)或者優(yōu)化，不需要怎么考慮。 1.前言 還有幾天就到國慶中秋了，快要放假了，先祝大家節(jié)日快樂！之前寫過js的寫作建議和技巧，那么今天就來聊聊css吧！說到css，每一個網(wǎng)頁都離不開c...
摘要：不均勻的元素會感覺很奇怪即使它們之間的間距是一樣的，視覺效果似乎是不一致的一個超級快速的解決方法是為所有元素設(shè)置相同的寬度。從圖片里提取色盤的開源庫是一個開源庫，有端和端的模塊可用。 .markdown-body{word-break:break-word;line-height:1.75;font-weight:400;font-size:15px;overflow-x:hidden;c...
閱讀 2009·2021-11-24 09:39
閱讀 3579·2021-09-28 09:36
閱讀 3357·2021-09-06 15:10
閱讀 3535·2019-08-30 15:44
閱讀 1204·2019-08-30 15:43
閱讀 1863·2019-08-30 14:20
閱讀 2776·2019-08-30 12:51
閱讀 2090·2019-08-30 11:04
