Question

When styling a link with a background image, where the link has text in it which is replaced with text in the image, is it OK SEO-wise to set the font-size to 0 to avoid the text being over the image?

Like this:

<a href="htp://google.com" title="Google, the Best Search Engine!" class="googleLink"> Google </a>

<style>
    .googleLink {
        display: block; height: 40px; width: 40px;
        background: url('googleLinkImage-40x40.png') no-repeat;
        font-size: 0;
    }
<style>

I understand font size 0 is bad if you’re abusing it to hide keywords, but does this technique hurt SEO when used sincerely?.

Thanks.

Answer 1

The important thing here is using your alt tag attribute for SEO, Google recommends it this way.

Having said that there are several css techniques for this. The one i recommend one is using text-indent: -99999em; instead of decresing the font-size.