2

So hiding text can be seen by Google as a black hat SEO trick, that's what I have read on many articles out there. So when a user is viewing my website on their mobile, There are usually a few things I think they don't need to see.

As a developer that uses Bootstrap, I often use the class hidden-xs or visible-lg which hides elements on the page using display: none. When using hidden I'm concerned about the SEO consequences.

Question(s):

When using hidden- will Google consider this blackhat and punish the site?

2

Google does not punish sites with hidden elements, in fact its been like this for several years. Nowadays Google is much smarter than it was a decade ago, their bots are able to understand a great deal of standard JavaScript scripts, CSS code and modern CSS3 stylesheets.

Google rarely punishes sites for hiding text because keyword stuffing no longer works as it once did. However hidden elements that have no way of being un-hidden will not be counted towards the page content.

Googlebot can make sense of:

  • JavaScript triggers (onclick, jQuery, MooTools, DoJo etc)
  • CSS3 Viewpoint triggers (@Media, Screen etc)
  • CSS Triggers (focus, hover, active etc)

Bootstraps uses the following CSS media queries to hide elements:

@media (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
    display: none !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-md {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  .hidden-lg {
    display: none !important;
}

Google will make sense of the media queries and know what content is hidden in which mode.

  • 100 % agree, Google is pretty good on that :) – Goyllo Mar 4 '16 at 18:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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