{"id":17657,"date":"2026-05-10T04:48:59","date_gmt":"2026-05-10T04:48:59","guid":{"rendered":"https:\/\/siteskyline.com\/?p=17657"},"modified":"2026-06-07T03:29:08","modified_gmt":"2026-06-07T03:29:08","slug":"h1-tags-wordpress-heading-structure-hierarchy","status":"publish","type":"post","link":"https:\/\/siteskyline.com\/vi\/h1-tags-wordpress-heading-structure-hierarchy\/","title":{"rendered":"

Th\u1ebb H1 WordPress: Kh\u1eafc ph\u1ee5c c\u00e1c v\u1ea5n \u0111\u1ec1 v\u1ec1 ph\u00e2n c\u1ea5p ti\u00eau \u0111\u1ec1<\/p>"},"content":{"rendered":"

B\u1ea1n \u0111\u00e3 d\u00e0nh h\u00e0ng gi\u1edd \u0111\u1ec3 t\u1ea1o ra trang WordPress ho\u00e0n h\u1ea3o. N\u1ed9i dung r\u1ea5t ch\u1eafc ch\u1eafn. C\u00e1c t\u1eeb kh\u00f3a \u0111\u00e3 \u0111\u01b0\u1ee3c \u0111\u1eb7t. Plugin SEO c\u1ee7a b\u1ea1n hi\u1ec3n th\u1ecb d\u1ea5u ki\u1ec3m m\u00e0u xanh l\u00e1 c\u00e2y.<\/p>

But open your browser’s developer tools and inspect the heading structure, and you’ll see something that can quietly kill your organic traffic: a broken heading hierarchy. Two H1s. A site title wrapped in `\uff1ch1\uff1e`. Sections jumping from H2 straight to H4. Or worse — no H1 at all.<\/p>

This isn’t a l\u1ed7i c\u1ee7a ng\u01b0\u1eddi m\u1edbi b\u1eaft \u0111\u1ea7u<\/a>. It’s a v\u1ea5n \u0111\u1ec1 c\u1ea5u tr\u00fac<\/a> baked into how WordPress, themes, page builders, and the Gutenberg editor interact — and most site owners never know it’s happening.<\/p>

This guide exists to fix that. Whether you’re a WordPress site owner managing your own content, or an agency building sites for dozens of clients, you’ll leave here knowing exactly how to ki\u1ec3m tra, ch\u1ea9n \u0111o\u00e1n v\u00e0 gi\u1ea3i quy\u1ebft tri\u1ec7t \u0111\u1ec3 <\/a>v\u1ea5n \u0111\u1ec1 th\u1ee9 t\u1ef1 ti\u00eau \u0111\u1ec1 trong WordPress.<\/p>

Th\u1ebb H1 l\u00e0 g\u00ec v\u00e0 t\u1ea1i sao n\u00f3 l\u1ea1i quan tr\u1ecdng trong WordPress?<\/h2>

An H1 tag (\uff1ch1>) is the top-level HTML heading element. In semantic HTML, it signals to browsers, search engines, and assistive technologies: “This is the primary topic of this page.”<\/strong><\/p>

H\u00e3y coi c\u00e1c th\u1ebb ti\u00eau \u0111\u1ec1 nh\u01b0 m\u1ed9t d\u00e0n \u00fd t\u00e0i li\u1ec7u:<\/p>

H1 – Main page title (only one per page)\n \u251c\u2500\u2500 H2 – First major section\n \u2502    \u251c\u2500\u2500 H3 – Subsection\n \u2502    \u2514\u2500\u2500 H3 – Another subsection\n \u251c\u2500\u2500 H2 – Second major section\n \u2502    \u251c\u2500\u2500 H3 – Subsection\n \u2502    \u2502    \u2514\u2500\u2500 H4 – Detail within subsection\n \u2514\u2500\u2500 H2 – Third major section<\/code><\/pre>
Skip a level — jumping from H2 to H4 — and you break the outline. Use two H1s and you create structural ambiguity. Use H3 tags for visual styling and you introduce ghost headings that confuse crawlers.<\/p>
In WordPress specifically, this gets complicated fast. Unlike a static HTML page where you write every tag manually, WordPress generates heading markup from at least four different sources simultaneously: the theme’s header template, the post title, the editor content, and any widgets or page builder modules you’ve added.<\/p>
Google th\u1ef1c s\u1ef1 n\u00f3i g\u00ec v\u1ec1 th\u1ebb H1<\/h3>
Let’s settle the cu\u1ed9c tranh lu\u1eadn v\u1ec1 x\u1ebfp h\u1ea1ng<\/a> s\u1edbm.<\/p>
In July 2026, Google’s Gary Illyes addressed this directly during the SEO Office Hours podcast: arranging headings in semantic order is genuinely helpful for accessibility (especially screen reader users), but it doesn’t significantly impact Google’s ranking algorithms. John Mueller has also stated that multiple H1 tags on a page don’t confuse crawlers and have zero direct SEO impact.<\/p>
V\u1eady \u0111i\u1ec1u n\u00e0y c\u00f3 quan tr\u1ecdng kh\u00f4ng?<\/p>
Yes — but not for the reason most SEO guides say.<\/p>
Nh\u1eefng l\u00fd do th\u1ef1c s\u1ef1 \u0111\u1ec3 quan t\u00e2m \u0111\u1ebfn c\u1ea5u tr\u00fac ti\u00eau \u0111\u1ec1 trong WordPress l\u00e0:<\/p>
    \n
  1. Tu\u00e2n th\u1ee7 kh\u1ea3 n\u0103ng truy c\u1eadp<\/strong> — WCAG 2.1 success criterion 1.3.1 requires information and relationships to be programmatically determinable. Broken heading hierarchies fail this.<\/li>\n\n\n\n
  2. Kh\u1ea3 n\u0103ng thu th\u1eadp d\u1eef li\u1ec7u v\u00e0 t\u00edn hi\u1ec7u n\u1ed9i dung<\/strong> — While Google can parse messy markup, a clean H1 gives the clearest possible signal about page topic, which matters in ambiguous cases.<\/li>\n\n\n\n
  3. Tr\u1ea3i nghi\u1ec7m ng\u01b0\u1eddi d\u00f9ng v\u00e0 th\u1eddi gian d\u1eebng l\u1ea1i<\/strong> — Readers scan headings. A logical hierarchy helps them navigate and stay longer — both indirect ranking signals.<\/li>\n\n\n\n
  4. S\u1ef1 s\u1ea1ch s\u1ebd trong ki\u1ec3m to\u00e1n k\u1ef9 thu\u1eadt<\/strong> — For agencies, heading issues surface in every audit tool (Screaming Frog, Ahrefs, SEMrush, Rank Math, Yoast). Client-facing reports look bad even if the direct ranking impact is debated.<\/li>\n<\/ol>
    C\u00e1ch WordPress t\u1ea1o th\u1ebb ti\u00eau \u0111\u1ec1: B\u1ed1n ngu\u1ed3n xung \u0111\u1ed9t<\/h2>
    Hi\u1ec3u t\u1ea1i sao<\/em> c\u1ea5u tr\u00fac ti\u00eau \u0111\u1ec1 WordPress b\u1ecb h\u1ecfng \u0111\u00f2i h\u1ecfi ph\u1ea3i hi\u1ec3u b\u1ed1n n\u01a1i m\u00e0 n\u00f3 t\u1ea1o ra c\u00e1c ti\u00eau \u0111\u1ec1.<\/p>
    Source 1: The Theme’s Header Template<\/h3>
    Most WordPress themes output the site title in the header area. Older and poorly coded themes wrap this in an \uff1ch1> tag — on every single page. This means every page on your site starts with the same H1: your brand name.<\/p>
    Sau \u0111\u00f3, khi ti\u00eau \u0111\u1ec1 trang ho\u1eb7c b\u00e0i vi\u1ebft hi\u1ec3n th\u1ecb (th\u1ee9 n\u00ean<\/em> l\u00e0 H1), n\u00f3 s\u1ebd tr\u1edf th\u00e0nh H1 th\u1ee9 hai ho\u1eb7c b\u1ecb h\u1ea1 c\u1ea5p xu\u1ed1ng H2.<\/p>
    Here’s what this looks like in a broken theme’s header.php<\/code>:<\/p>
    php<\/p>
    \/\/ Broken — site title as H1 on every page\n\uff1ch1\uff1e\uff1c?php bloginfo('name'); ?\uff1e\uff1c\/h1\uff1e\n\uff1ch2\uff1e\uff1c?php the_title(); ?\uff1e\uff1c\/h2\uff1e  \/\/ Post title wrongly demoted<\/code><\/pre>
    N\u00f3 s\u1ebd tr\u00f4ng nh\u01b0 th\u1ebf n\u00e0o:<\/p>
    php<\/p>
    \/\/ Correct — site title is a link or span, post title is H1\n\uff1cp class=\"site-title\"\uff1e\uff1ca href=\"\uff1c?php echo home_url(); ?\uff1e\"\uff1e\uff1c?php bloginfo('name'); ?\uff1e<\/strong>\uff1c\/a\uff1e\uff1c\/p\uff1e\n\uff1ch1\uff1e\uff1c?php the_title(); ?\uff1e\uff1c\/h1\uff1e<\/code><\/pre>
    This is one of the most common WordPress H1 issues and it’s entirely invisible unless you inspect the page source. You can have an SEO plugin, a green readability score, and n\u1ed9i dung ho\u00e0n h\u1ea3o<\/a> — and still be outputting duplicate H1s on every page.<\/p>
    Ngu\u1ed3n 2: Tr\u00ecnh ch\u1ec9nh s\u1eeda kh\u1ed1i Gutenberg<\/h3>
    The WordPress block editor introduced deliberate changes to H1 behavior. By default, Gutenberg de-emphasizes the H1 option in the Heading block — the assumption is that the post title is already rendering as H1, so content-area headings should start at H2.<\/p>
    Tr\u00ean th\u1ef1c t\u1ebf, \u0111i\u1ec1u n\u00e0y t\u1ea1o ra hai v\u1ea5n \u0111\u1ec1:<\/p>
    V\u1ea5n \u0111\u1ec1 A:<\/strong> M\u1ed9t s\u1ed1 ch\u1ee7 \u0111\u1ec1 kh\u00f4ng<\/em> output the post title as H1. If your theme renders the title in a \uff1cdiv> or \uff1ch2> for stylistic reasons, and Gutenberg has hidden H1 from the heading block options, you end up with zero H1 tags on the page.<\/p>
    This is exactly the situation flagged in a long-running GitHub issue in the Gutenberg repository — users requesting the ability to remove the H1 option entirely for enterprise and agency setups where the H1 is controlled at the template level. The issue highlights real confusion: the editor’s default behavior and the theme’s template need to be explicitly coordinated, but WordPress provides no automated check for this.<\/p>
    V\u1ea5n \u0111\u1ec1 B:<\/strong> Content editors can still select H1 in the block editor by changing the heading level. If your theme already outputs the post title as H1, an editor adding another H1 block inside the content area creates a duplicate — and no warning appears.<\/p>
    Ngu\u1ed3n 3: Tr\u00ecnh t\u1ea1o trang (Elementor, Divi, Beaver Builder)<\/h3>
    Tr\u00ecnh t\u1ea1o trang l\u00e0 ngu\u1ed3n l\u1edbn nh\u1ea5t g\u00e2y ra s\u1ef1 h\u1ed7n lo\u1ea1n v\u1ec1 ph\u00e2n c\u1ea5p ti\u00eau \u0111\u1ec1 trong WordPress.<\/p>
    Here’s why: page builders give you granular visual control. You can drag a text element anywhere, style it any way, and assign any heading level. This is powerful for design. It’s disastrous for structure.<\/p>
    V\u1ea5n \u0111\u1ec1 ti\u00eau \u0111\u1ec1 tr\u00ecnh t\u1ea1o trang \u0111i\u1ec3n h\u00ecnh tr\u00f4ng nh\u01b0 th\u1ebf n\u00e0y:<\/p>