Hidden text within CSS – Don’t try to fool Google!

The ever-growing SEO team at Coast Digital is always keen to tell our readers of recent experiences in developing natural results for our clients.

A recent case is a good example of how one business had made the mistake of applying CSS to hide text content off-page on their website.

The content wasn’t necessarily put in place to cheat search engines, but more to focus on the design elements of the website in question, which features lots of nice graphics and visual impact. Unfortunately in this instance the hidden text resulted in a black mark from Google.
 
In adherence with Google’s guidelines on not hiding content we’re always keen to emphasise to clients the importance of how each web page should deliver genuine content that can be read on screen.

Implementing ethical SEO is often a balancing act, as you don’t want to completely overhaul an eye-catching website design with piles of text or headings.

Below is an example of CSS hiding content off-page:

.hidden {
            position: centre;
            left: 0px;
            top: -1000px;
            width: 1px;
            height: 4px;
            overflow: hidden;

The above CSS would be considered bad practice SEO. If a visitor can trawl through the page coding and locate this information then you are guaranteed that the search engine robots and spiders can too.

Before Coast Digital became involved in the SEO of this particular domain its natural listings were in a state of limbo, as Google wasn’t prepared to issue competitive page 1 / position 1 listings, despite a strong inbound link popularity to the domain.

Removing the black mark against your website in Google can take time. Coast Digital recommends the following strategies to get your website back on the right track: