Let’s say I want to have responsive page text like the below:

<h1 class=“hide-sm”>My Awesome Widgets</h1>
<h1 class=“show-sm”>Widgets</h1>

Let’s say for argument’s sake my content editor doesn’t allow for sub-h1-span creation to responsively show/hide content within a single h1.

The question is, would Google penalize this content for the “Widgets” keyword? Is it going to read this as blackhat SEO / keyword stuffing, or will it be smart enough to know only one of those titles appears per device size, and rank the content accordingly?

1 Answer 1


The best practice for mobile content is using browser and CSS tools to change the display. And google reads the page both as desktop and mobile, letting you know if it sees any problems with mobile usage, (such as your links are too close together to be used on a touch screen).

@media screen and (max-width: 768px) {
    .show-sm {

They are very good at what they do, and I don't know of any problems or failures that exist in improper interpretations.

However, it is extremely difficult to test small changes, as so much of the algo is based on off-page signals and they delay showing any effect of small content changes preventing reverse engineering of their algos.

In your example you are using the word widget two times instead of once; that is not an unnatural amount of usage. If you were sniffing the browser and using different wording for say 20 different models of mobile devices that would be an unnatural amount of usage and not in line with best practices.

Side note: If Widgets is not the main headline of the page I would strongly suggest using the h2 tag instead. The semantics for screen readers is h1 is the main title not a sub-title, and google is their big friend helping this standard. If you use the h1 for styling purposes then add a class.

h1 .h1 { 

<h1>main title</h1>
<h2 class="h1">sub title styled as main title</h2>

Over-optimization speculations

It has been speculated by black hats that there exists an over the top amount of optimization. That is if the perfect keyword density for a word were 2.35% in content, 1 usage in the title and description, 3 usages in links and everything was perfected ... the perfectly optimized page would go over the top and the page that has 2% or 3% usage less than perfect would be used instead.

The argument against an over-the-top algo, is tweaking and submitting the same page over and over again may be a signal for Google and they just demote the URL until the tweaking stops.

But again there is no way to reverse engineer Google's algos. They are intentionally none responsive to minor tweaks to the content and may intentionally add some random noise that makes it impossible.

Natural, not written for search engine copy, is what Google wants to promote.

  • Thanks @Wayne - I'm clear on all the basic SEO tips. Specifically, just want to ensure that if I have a responsively visible "Widgets" h1 and hidden "Widgets" h1, Google won't see this as blackhat. I ask because it used to be a common tactic among blackhats to use hidden text for keyword stuffing. Obviously, I'd expect Google to be able to distinguish, but wanted to be sure and ask those with experience using responsive content for SEO. Nov 16, 2022 at 19:45
  • 1
    @StevenMoseley, I think the black hats moved to link schemes and such, but old information exists in the back corners of the internet where information is immortal. And there was a time when search engines did not know how to parse CSS, and hidden text had an effect. Again, if you are using (at)media Google is one the team that supported its usage in CSS3 so -- as a side note if you open youtube and press the tab key a "hidden" link will appear to bypass navigation, it's for those with sight problems, and google is their friend. Nov 17, 2022 at 23:27

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.