Text enlloc d’un logo mitjançant el CSS text-indent

“text-indent” estableix la tabulació de la primera línia de text d’un element. La tabulació es pot indicar mitjançant qualsevol de les unitats de mesura definides per CSS 2, incloent els percentatges.

Amb la propietat text-indent podem amagar el text, per exemple, d’una capa, i colocar-hi una imatge o logotip amb un link com a imatge de fons. Dit d’una altra manera: podem substituir un logotip per text pla, però el que visualitzarem serà únicament el logotip.

<style type="text/css">
h1 a {
   display: block;
   text-decoration: none;
   width: 128px;
   height: 128px;
   bottom: 0px;
   background: url(mozilla-icon.png) no-repeat left top;
   text-indent: -99999px;
}
</style>

<h1><a href="http://www.mozilla-europe.org/ca">Mozilla</a></h1>

La solució de text-indent és més enrevessada que la típica imatge amb etiquetes alt i title, però és millor de cara al SEO.