: Will using same colour H1 as background hurt SEO if I use background image? Can it hurt SEO if H1 headings are the same colour as the standard body background colour, even if all H1 headings

@Moriarity557

Posted in: #Css #HiddenText #Html #Seo

Can it hurt SEO if H1 headings are the same colour as the standard body background colour, even if all H1 headings are placed in divs that have a contrasting background image? (So to be clear: the heading will be clearly visible)

To illustrate:

CSS:

body {
color:#4e4e4e;
background-color: #ffffff ;
}
#section1 {
background: url('example.jpg');
}

h1 {
font-weight: bold;
color:#ffffff;
}


(example.jpg in this case would be an image with very dark colours)

HTML:

<div class="section" id="section1">
<h1>Lorem ipsum dolor</h1>
</div>


While at first glance it may seem that H1 headings are hidden, in reality they are not because the white letters will contrast with the dark background image.

Will Google (wrongly) see this as hiding text, as a result hurting SEO? And if so, would it then be better to define H1 colours per div like in the CSS example underneath?

body {
color:#4e4e4e;
background-color: #ffffff ;
}

#section1 {
background: url('example.jpg');
color: #fff;
}


I ask this because, while the second example seems to make more sense if you want to make it clear you're not hiding text, I also have the feeling that this defeats the purpose of a separate CSS file. If I'm going to have to change the font colour for each div I use an H1 in, I might as well switch to inlining.

Vote Up Vote Down

Login to post a comment!