-
Is there any problem with using a “ghost” H1 heading?
Posted by on October 3, 2025 at 10:47 pmI’m building the hero/header section for a website and love the way the H1 headings look when they’re short and clean — for example, just “Commercial Construction.” The problem is, for SEO, I’ll probably want the actual H1 to include more keywords or the primary location, which doesn’t look nearly as clean in the hero.
Here’s the idea I’m considering:
- In the hero section, I’d style the simple page title (e.g., “Commercial Construction”) to look like an H1 but actually make it a <span>.
- Then, in the first section under the hero, I’d add a longer, keyword-rich heading. It would be styled as an H2 visually but marked up as the true H1 heading in the code.
That way, I’d get both the clean look I want in the hero and the SEO-optimized H1 for crawlers and screen readers.
Is there any downside to this approach, either for SEO or accessibility?
Thanks in advance for your input!
-
1 Reply
-
The H1 tag is the most important. That’s your money tag.
They even teach this in the computer science HTML 101.
-
You can argue that google ignores it, and sometimes it seemingly does in practice (normally low difficulty high authority site)… however, save yourself the fucken brain damage and just use a span tag and some css to get the same look, name your IDs correctly and have it not be an issue.
No point making life hard for yourself
-
Here’s the thing – search engines crawl pages from top to bottom. Putting your h1 under other page content might mess up the onpage SEO.
The design often matters less than the page SEO and structure.
-
I dont remember what group it was but they did test this and apparently google didnt care where you put your H1 – not sure if that’s still the case it’s been 4 years since I read that paper. But I once put the H1 in a FAQ accordion at the bottom of the page in a couple of sites and they ranked fine.
-
Sure lots of pages do this and rank just fine. I actually recommend doing something similar to clients who want to use a more sales oriented heading compared to the keyword optimized headings.
I will say that it has never made a difference in sales, so take that for what its worth.
-
Nothing wrong using span or p for a kicker before an H1.
-
For accessibility make sure you have a consistent and meaningful hierarchy of headings. Imagine you just displayed the H1, H2 H3 etc on a page – it needs to make sense.
-
I do it frequently. You’ll have no problems with SEO because of it.
-
This is perfectly fine to do.
-
Ive heard mixed opinions but I like to design my pages in a similar way as how you are describing it. Im a big fan of subheading in my designs so what I tend to do for heros is write a keyword rich H1 that is around 3-6 words and an H2 below it. Visually, the H1 looks like an H2 because its smaller font and less bold and the true H2 looks visually like the H1.
My thought is that I write the H1 for Google and the H2 for the visitors and I emphasize them accordingly with my designs.
For all other sections of the page I do the same, I use a keyword rich H2 as the “subheading” and emotionally driven H3 as the Primary Heading.
Haven’t had any problems with this approach so far.
-
You can set some classes to have the same styling as your headers. Then use the h1 tag for structure and h1 (or whatever you name it) class for styling.
Log in to reply.