帶有 Hx 標題標籤的內容的層次結構

已發表: 2018-01-30

目錄

    在網站上使用內容標題是一個相當流行的主題,它帶來了許多至今仍然存在的神話。 那麼什麼是標題標籤,為什麼要使用它們以及如何在網站上實現標題標籤的最佳結構?

    • 1什麼是標題?
    • 2在 Hx 標題標籤中使用重要內容
    • 3谷歌對 Hx 標題標籤有什麼看法?
    • 4關於內容標題的其他基本信息

    什麼是標題?

    標題標籤用於向用戶展示內容的結構(也包括網絡瀏覽器爬蟲)。 有六種標題大小——從 H1 到 H6 ,儘管其中第一個最相關(它是最重要的標題),而 H5 和 H6 很少使用。

    由於 Hx 標題標籤包含的文本(應該)比內容的其餘部分大得多,因此它是用戶的視覺線索,可以讓他們理解下面的段落描述的內容。 使用各種大小的標題來表示層次結構,使用戶更容易消化內容。

    在 HTML 語法中,我們在 <> 括號中使用標籤:

     <h1>標題 1</h1>
    <h2>標題 2</h2>
    <h3>標題 3</h3>
    <h4>標題 4</h4>
    <h5>標題 5</h5>
    <h6>標題 6</h6>

    但是在網站上,它們會看起來像這樣(顯然,取決於樣式表):

    可以在此處找到示例用法:https://www.w3schools.com/html/html_headings.asp。

    在 Hx 標題標籤中使用重要內容

    當幾乎每天都有新的博客文章、新聞、指南或專家文章出現時,不僅用漂亮的圖片或吸引人的標題,而且用結構化的內容來吸引用戶是值得的。

    在移動設備上瀏覽特定文章時,讀者通常主要關注標題。 除了純粹的審美方面,適當的標題結構可以更容易地解釋和消化內容,因此用戶有可能在給定的網站上停留更長時間。

    不僅用戶可以從結構良好的網站中受益——爬蟲也可以這樣做,因為標題文本對他們也很重要。 這就是為什麼標題標籤包含與頁面上的內容在主題方面相關的關鍵字如此重要的原因。 如果我們使用特定關鍵字定位特定頁面,則最好將它們(即使以不同的形式)放在標題中; 它們自然可以放在文本中,但要在一個理由之內。

    應明確定義結構,並且標題的大小應彼此不同。 將它們設置為與正文相同的樣式或不按重要性區分它們是錯誤的。

    文章中的 Hx 標題

    在寫博客文章時,我們可以創造性地使用標題。 您應該在開始之前定義文章的結構。 標題可能是分隔各個段落的交叉標題(就像在這篇文章中一樣),其中最重要的一個 <h1> 可用於描述主題。 它經常在網站模板中自動定義,因此如果不是這種情況,值得與 SEO 專家和 Web 開發人員討論進行更改。

    一個設計良好的文章結構可以使它看起來更有吸引力。 標題中的有趣內容將清楚地告知讀者(和爬蟲)他們對給定文章的期望。

    在網站主頁上放置哪些標題標籤?

    主頁(或任何其他頁面,例如服務頁面)也應該具有標題的層次結構。 在 <head> 部分,建議將 H1 放在 H2 下方,H3等等,但沒有最大數量的標題標籤。 即使在 H1 的情況下,您也不需要將自己限制在一個標題上(如下所述)。

    但是,您需要記住,標題中的“關於我們”或“了解更多”等部分不會增加太多內容。 此外,使用重要性較低的標題,例如 H5-H6,幾乎沒有意義(文章的佈局方面除外)。

    一頁網站=一個H1標題標籤?

    對於單頁網站,它不像博客文章那樣明顯。 在HTML5 規範(https://www.w3.org/TR/2014/REC-html5-20141028/sections.html) 中,您可以找到負責定義 HTML 文檔中各個部分的<section>標記。 一個部分通常包含一個標題,因此每個部分可能具有不同的層次結構,例如:

     <部分 id=”關於”>
     <h1>關於我</h1>
     <p>一些關於我的文字:)</p>
     <h2>我叫戴維……</h2>
     <p>關於我的第二段。 大聲笑:)</p>
    </節>
    
    <section id=”portfolio”>
     <h1>我的作品集</h1>
     <p>我最近的項目...</p>
    </節>
    
    <部分>
     <h1>推薦</h1>
     <p>滿意客戶的意見...</p>
     <h2>最新推文</h2>
     <p>推文 1</p>
     <p>推文 2</p>
    </節>
    
    <部分>
     <h1>聯繫方式</h1>
    </節>
    

    正如您在上面看到的,每個部分都有一個不同的 H1 標題,然後是一個 H2 標題……儘管您可以決定有一個或多個 H1 標題標籤,然後是 H2、H3 等。

    Google 對 Hx 標籤有什麼看法?

    谷歌員工對標題標籤說了很多,但值得引用他們的最新觀點。 一年前, John Meuller在 Google 網站管理員論壇上寫道:https://productforums.google.com/forum/#!msg/webmasters/BmyI8YX_25A/81hZNQFJDQA

    “我們不會以不同的方式對待 HTML5,並且在一個頁面上有多個 H1 標籤是可以的。 使用它們時要合理,在有意義的地方使用它們。 使用 H1 絕對不會受到任何處罰。”

    稍後,在 2017 年 4 月,John 在 Twitter (https://twitter.com/JohnMu/status/852131231928135680) 上簡短地回答了一個問題,一個頁面上可以使用多少個 H1 標題。

    最後,作為谷歌網站管理員頻道“SEO Snippets”YouTube 系列的一部分,上傳了關於該問題的簡短指南:

    試試 Senuto開始免費試用

    有關內容標題的其他基本信息

    儘管 Google 員工建議(至少在他們的官方聲明中)採用靈活的標題標籤方法,但仍有一些規則值得遵循:

    • 不要過度使用頁面上的標題
    • 在有意義的地方使用標題以及當它們反映其下方的文本時,以幫助用戶確定給定段落的開始和結束位置
    • 不要將整個段落(所有內容)放在標題中
    • 不要只使用關鍵字,尤其是不自然的形式
    • 不要通過對標題和正文使用相同的字體大小來隱藏正文中的標題
    • 保持結構層次有序
    • 也許有時使用 <strong> 標籤而不是標題標籤 ????。

    在創建內容時,既不過度優化也不優化不足; 取而代之的是,力求平衡並關注用戶消化您網站上的內容(包括文章、指南或其他博客文章)的感受。 畢竟,標題是谷歌搜索引擎的排名決定因素,這就是為什麼你不能忽視它們。

    試試 Senuto開始免費試用