Is h1 tag that's hidden using display:none given prominence by search engines?

Question

When content is hidden by CSS (display:none), is that read by Search engines or are sites penalised for that ? In my case, due to some CMS and other reasons, I need to serve alternative content to users and hide the H1 tag on the page using display:none. I wanted to know if the Search Engine will still treat the H1 tag with the same prominence as when its not hidden.

Answer 1

It's against Google's policy. It's called keyword stuffing and will get you delisted from Google, which means your site wont even show up on Google anymore. A good rule of thumb is to only show googlebot what users of your site can perceive display.

If you show the information to people at some point, then you can argue you're not keyword stuffing I guess, but Google will delist you first and then you'll have to file an appeal.

Answer 2

I don't believe that Google will penalize you automatically (meaning without human review), but it's definitely a risk, especially if the hidden text appears to be that way solely for SEO purposes.

Google Quality Guidelines - Hidden text and links

Answer 3

Search engine builders have had about 15 years to learn every trick that people use to get better search engine ratings, so you can be sure that the robots notice something simple like hidden text.

If the header tag is not visible on the page, it's pointless to have it there at all. At best the search engines will ignore the tag. At worst they will ignore your site.

Answer 4

Search engines are getting wise with regard to CSS techniques to hide information in attempts to game them. There is likely to be a threshold however, so one or two such techniques, for valid enough reasons won't be too problematic for you. If you can, do try to avoid them, and especially en-mass.

Answer 5

There is no reason why you can't hide the H1 tag - it's not necessarily a bad thing. Vision impaired people who are reading your website with a screen reader would find the hidden H1 useful regardless if it's hidden (because most screen readers read the HTML not the visual page). Also if you visually have a business logo on the page and then have a hidden H1 with the business name, this is also fine. In this case the H1 is an alternative to the Logo so it is therefore fine for purely semantic reasons.

Also you can have hidden content that can 'appear' by user interaction (say clicking on a 'more' link). This is also fine. Hiding text is not wrong providing there is a good, usability reason for doing it. Of course keyword stuffing is wrong and this should never be done - so an SEO reason is never enough alone to hide text - there must be some other reason.

Answer 6

Its not a discussion about that search engine should consider it or not. Its a question about what search engine will do. Here is your answer http://support.google.com/webmasters/bin/answer.py?hl=en&answer=66353

Search engine will discard it, and also its against their terms of use so they have right to even remove your site from search result.

Answer 7

Using a .visuallyhidden class might be a better idea than the good old display:none; Screen readers will read the content in .visuallyhidden as if it were plain text.

.visuallyhidden {
    border: 0 none;
    clip: rect(0px, 0px, 0px, 0px);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px; 
}

I'm not sure if Google penalizes the use of such classes in h1 tags. But in any case I think it is a better option than using display: none;

Answer 8

As already mentioned, it is not a good idea to hide information for many purposes.

If actually, what you really want is to serve visitors an alternate media than plain text, there are a lot of ways to do that, just see Nine Techniques for CSS Image Replacement for further details, or sIFR.

Answer 9

You're better off not doing this.

Search Engines like Google are smart and they check for this type of thing and when you're caught, you'll get flagged and your SEO is useless.

Work within the system, don't try to cheat it. Google offers a ton of tools for developers looking to do legitimate SEO.

Answer 10

you can set the background to the as the image you want people to see and then text indent the text to -9999px.