搜尋
首頁web前端html教學如何使用h1標籤才能更符合SEO的規範

在網站優化過程中SEOer常會利用HTML標籤來增加最佳化效果。其中H標籤就是我們常會用到的html標籤之一,H標籤在網頁中對文字標題起到著重強調的一種標籤,可以引起搜尋引擎的專注,在搜尋引擎造訪網頁進行抓取時,H標籤的內容作為強調部分。在seo圈內,有許多人認為網站該用H1標籤,可以促進關鍵字排名,可也有一些人認為H1不能用,會造成優化過度,也可能影響頁面美觀,也起不到什麼作用。

儘管現在各大搜尋引擎中頁面中是否存在H1標籤以及H1標籤中是否存在關鍵字的作用效果減弱,但H1標籤的效果是仍然存在的,Google演算法也指出,H標籤之間的文字,一定比其它地方的文章具備更重要的意義,只是過度的使用容易產生不利的影響。所以我們完全可以好好利用,沒有必要說是完全抵制。那麼H1標籤該如何用才才符合SEO優化的原理呢? 一、H標籤是什麼?

# H標籤也叫做Heading標籤,在HTML語言裡一共有六種大小的heading標籤,是網頁html 中對文字標題所進行的著重強調的一種標籤,以標籤

、< ;h3>到定義標題頭的七個不同文字大小的tags,本質是為了呈現內容結構。共有六對,文字從大到小,依此顯示重要性的遞減,也就是權重依序降低。

W3C指出h1-h7標籤可定義標題,h1定義最大的標題,h6定義最小的標題。 h標籤是成對出現的,以開始,以結束。 h1,h2,h3,h4,h5,h6,h7作為標題標籤,並且依據重要性遞減。遵循這樣的原則是很有必要的,它能讓頁面的層級關係更清楚,讓搜尋引擎更好地抓取和分析出頁面的主題內容等等。

二、各大門戶網站對H標籤的使用

搜尋引擎對H標籤極為敏感,用的好搜尋引擎會給予非常高的權重,可提升整個網站的關鍵字權重,甚至帶來大量的長尾字。亂用H標籤不但不會為網站帶來好的權重,同時也有可能被搜尋引擎認為作弊,最後導致K站。所以,用好H標籤至關重要。

1、H1標籤的使用情況

#(1)、網易首頁

網易首頁中只在LOGO前面出現一次H1標籤,文字內容是網易,但仔細觀察,這次H1標籤就是為了突出品牌關鍵字,純粹給搜尋引擎看的,對於用戶是隱藏的。

(2)、A5站長網首頁

# A5站長網的首頁也只用了一次,用在了網站LOGO。  

(3)、站長之家首頁

站長之家首頁也是只用一次,也是用在LOGO。

從上面的截圖馬海祥發現,各大網站首頁對於H1標籤都只是用了一次,要么用在網站的品牌關鍵字,要么直接用在LOGO上。在網頁設計中直接使用H1標籤可能產生不夠美觀的效果,所以很多人會用css來隱藏。或將H1標籤加到網站的LOGO中使用。這樣不僅能對主關鍵字起到強調效果,增強相關性,同時也不會影響美觀。而在內容頁,也都是用一次,一般都是對內容頁大標題再次進行強化。

2、H2標籤的使用情況

#(1)、網易首

# 從上面的截圖,馬海祥發現在網易首頁出現7次,有的是文章標題,有的直接只是加粗使用。 

(2)、A5站長網首頁

# A5站長網也就出現8個詞,全部是首頁的文章標題,至於站長之家是直接沒有H2標籤。從上圖馬海祥可以發現H2標籤各大網站用得就比較多一些,主要是用在網頁的主要文章標題或欄目標題,有的甚至直接用在加粗了,只不過用H2來加粗強調效果肯定是強於strong標籤的。後面的H3、H4等大家可以透過馬海祥博客的文章看一下,因為也不是太重要,所以在這就不多說了。

三、H標籤的作用

# 在html裡的每個標籤都有其自身的意義,而H標籤作為標題標籤,它的意義更是至關重要。對於H標籤的用法特別是h1的用法一直是個爭議的問題。

1.H標籤直觀的告訴用戶,網頁哪部分是重要的,哪些是不那麼重要的。 heading標籤通常用來為使用者展現網頁的結構,由於heading標籤通常會使某些文字比普通的文字大,對於使用者來說,便於他們更直觀地看出這些文字的重要性,而且可以幫助他們理解heading文字下方的內容。多種漸層大小的heading一開始主要為網頁的內容創造分層結構,方便使用者直覺地瀏覽網站。

2、H標籤引導搜尋引擎,網頁哪些是重要的內容。對搜尋引擎來說,標籤的主要意義是告訴搜尋引擎這個是一段文字的標題或說是主題,起強調作用,h標籤的權重會高於Strong,因此在搜尋引擎優化中H標籤的運用非常重要。

因為,搜尋引擎需要在一堆文字中明白它寫的是什麼,所以,它也依照人們的閱讀習慣,首先尋找文章的標題,然而,不像人們那樣可以迅速確定標題是什麼,搜尋引擎是“盲人”,所以,使用標籤就指導搜尋引擎標題在那裡,便於它們迅速掌握文本大意。

標題(H1-H6)標籤是採用關鍵字的重要地方,這個標籤應該包括文本中最重要的關鍵字,Google演算法就指出,這個直接的題頭文字,一定比其它地方的文章具備更重要的意義,但是,過分的使用容易產生不利的影響。關於更多的Google的演算法,大家可以透過馬海祥部落格的《盤點Google(Google)歷年來對搜尋引擎演算法的更新改進》來具體了解。

四、如何使用H1標籤?

1.H1標籤最好用在H2-H6之前,並且一個頁面只用一次,不要一直使用。有些網站在一個頁面大量的使用,甚至出現了幾十次,看到關鍵字就用,覺得可以增強效果,其實不然。 H1可以用但不要氾濫,我們是有效的堆砌而不是胡亂的強塞。合理的使用H1標籤可以為網站帶來好的效果,而使用的不恰當會對網站帶來不利影響,嚴重的甚至會導致K站。

2.H1標籤中使用的關鍵字,應該是頁面最主要的關鍵字或品牌詞,並且應該是在網頁標題中使用的關鍵字。 H2-H6根據這個原理逐級遞減,從一般關鍵字到長尾關鍵字,從長尾關鍵字到標題,不過一般H3以後就用得比較少了,因為H1代表最重要的,H6代表相對最不重要的,再者越到後面意義越來越小。

3.H1標籤之間肯定是需要包含關鍵字的,但是這個關鍵字也是需要具有可讀性和合理性,不要為了強調而把這個關鍵字加進去,而是因為這個關鍵字需要被強調才來加上H1標籤,注意先後。是先有關鍵字,然後再給關鍵字加上H1標籤。

4.如果把H1標籤加在LOGO圖片,圖片ALT訊息上要加上網站名稱或品牌詞,這樣才能更加突出首頁的關鍵字,不然給一個圖片加H1,你覺得會有什麼效果呢?

5.H1標籤盡量靠近在html中的body標籤,越近越好,以便讓搜尋引擎最快的找到主題。從上面的例子馬海祥就可以發現H1標籤都在body程式碼的最前面,為什麼?因為搜尋引擎的抓取就是從上而下來的,這樣可以讓H1標籤強調的關鍵字最快被發現。

6.內容頁H1標籤一般都是用在內容的大標題,最好也是只用一次,不過有很多內容頁也用了2次,一次用在LOGO或出現在網頁最前面的主關鍵詞,一次用在內容的大標題。如果最前面沒有主要的關鍵字,建議最好還是只用在大標題上一次。

7.當不想將H1標籤用在LOGO上並且網頁主要的關鍵字在後面的時候,如果還是想加H1標籤並且想H1標籤的關鍵字靠前,馬海祥建議可以利用DIV+CSS佈局來調整主關鍵詞的位置,這樣也不會影響頁面效果。

8.不要總是想著加H1標籤,很多大網站也是沒有用H1標籤,像百度、新浪、愛站網等壓根就沒用H1標籤,所以只要真真切切的為用戶提供資訊就可以了,至於是不是一定要用H1標籤就不一定了。

五、H標籤使用的SEO建議

# 1.每個網頁只能擁有一個

標籤。

2、

用來修飾網頁的主標題,一般是網頁的標題,文章標題,

中部署主關鍵字。

盡量靠近在html中的標籤,越近越好,以便讓搜尋引擎最快的領略主題。

3、

表示一個段落的標題,或者說副標題,部署長尾關鍵字。

4、

表示段落的小節標題,

效果跟Strong差不多,通常用在段落小節。

5、

-

基本上很少用到,是告訴搜尋引擎這些不是很重要的內容,當一篇文章內容較多的時候,可以用來說明一些內容是不很重要的。

以上是如何使用h1標籤才能更符合SEO的規範的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
如何在標籤上設置lang屬性?為什麼這很重要?如何在標籤上設置lang屬性?為什麼這很重要?May 08, 2025 am 12:03 AM

設置標籤的lang屬性是優化網頁可訪問性和SEO的關鍵步驟。 1)在標籤中設置lang屬性,如。 2)在多語言內容中,為不同語言部分設置lang屬性,如。 3)使用符合ISO639-1標準的語言代碼,如"en"、"fr"、"zh"等。正確設置lang屬性可以提高網頁的可訪問性和搜索引擎排名。

HTML屬性的目的是什麼?HTML屬性的目的是什麼?May 07, 2025 am 12:01 AM

htmlattributeseresene forenhancingwebelements'functionalityandAppearance.TheyAdDinformationTodeFineBehavior,外觀和互動,使網站互動,響應式,visalalyAppealing.AttributesLikutesLikeSlikEslikesrc,href,href,href,類,類型,類型,和dissabledtransfransformformformformformformformformformformformformformformforment

您如何在HTML中創建列表?您如何在HTML中創建列表?May 06, 2025 am 12:01 AM

toCreateAlistInHtml,useforforunordedlistsandfororderedlists:1)forunorderedlists,wrapitemsinanduseforeachItem,RenderingeringAsabulletedList.2)fororderedlists,useandfornumberedlists,useandfornumberedlists,casundfornumberedlists,casundfornthetthetthetthetthetthetthetttributefordforderfordforderforderentnumberingsnumberingsnumberingStys。

HTML行動:網站結構的示例HTML行動:網站結構的示例May 05, 2025 am 12:03 AM

HTML用於構建結構清晰的網站。 1)使用標籤如、、定義網站結構。 2)示例展示了博客和電商網站的結構。 3)避免常見錯誤如標籤嵌套不正確。 4)優化性能通過減少HTTP請求和使用語義化標籤。

您如何將圖像插入HTML頁面?您如何將圖像插入HTML頁面?May 04, 2025 am 12:02 AM

toinsertanimageIntoanhtmlpage,usethetagwithsrcandaltattributes.1)usealttextforAcccessibilityandseo.2)instementRcsetForresponSiveImages.3)applylazyloadingWithLoadingWithLoading =“ lazy” tooptimizeperformance.4)tooptimizeperformance.4)

HTML的目的:啟用Web瀏覽器可以顯示內容HTML的目的:啟用Web瀏覽器可以顯示內容May 03, 2025 am 12:03 AM

HTML的核心目的在於讓瀏覽器理解並展示網頁內容。 1.HTML通過標籤定義網頁結構和內容,如、到、等。 2.HTML5增強了多媒體支持,引入了和標籤。 3.HTML提供了表單元素,支持用戶交互。 4.優化HTML代碼可提升網頁性能,如減少HTTP請求和壓縮HTML。

為什麼HTML標籤對Web開發很重要?為什麼HTML標籤對Web開發很重要?May 02, 2025 am 12:03 AM

htmltagsareessentialforwebdevelopmentastheyandendenhancewebpages.1)semantictagsimproveaccessibilityandseo.2)semanteLayOut,語義和互動性。 3)poseriblesibilityandseoandseo.3)poseriblesoftagscanoftagscanoftagscanoptagscanoptimizeperefeneandimizeanDenSuroceRecRoscRoss-BrowserCrowserCercerComercompatibility。

說明將一致的編碼樣式用於HTML標籤和屬性的重要性。說明將一致的編碼樣式用於HTML標籤和屬性的重要性。May 01, 2025 am 12:01 AM

一致的HTML編碼風格很重要,因為它提高了代碼的可讀性、可維護性和效率。 1)使用小寫標籤和屬性,2)保持一致的縮進,3)選擇並堅持使用單引號或雙引號,4)避免在項目中混合使用不同風格,5)利用自動化工具如Prettier或ESLint來確保風格的一致性。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

將Eclipse與SAP NetWeaver應用伺服器整合。

mPDF

mPDF

mPDF是一個PHP庫,可以從UTF-8編碼的HTML產生PDF檔案。原作者Ian Back編寫mPDF以從他的網站上「即時」輸出PDF文件,並處理不同的語言。與原始腳本如HTML2FPDF相比,它的速度較慢,並且在使用Unicode字體時產生的檔案較大,但支援CSS樣式等,並進行了大量增強。支援幾乎所有語言,包括RTL(阿拉伯語和希伯來語)和CJK(中日韓)。支援嵌套的區塊級元素(如P、DIV),

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境