¿Deberíamos poner nuestro logotipo superior como una imagen o como un <h1>?
Este es un interesante debate que lleva mucho tiempo entre nosotros, y es que no sabemos si es mejor utilizar una imagen como logotipo o por el contrario utilizar un texto <h1> con el fin de mejorar nuestro SEO. Lo que está claro es que si nuestro logo es una imagen no puede ser un <h1>. Personalmente apuesto por la imagen con su correspondiente alt y title para el posicionamiento, sin forzar el <h1> con esa capa para mostrar luego la imagen por css. ¿Cual es vuestra elección?
Este el código ejemplo si utilizamos una imagen:
<a href="/" title="Volver al inicio" id="logo">
<img src="/images/carrerologo.gif" alt="Carrero logo" title="Carrero logo" />
</a>y este un ejemplo utilizando <h1>:
<h1><a href="/" title="Volver al inicio">Carrero</a></h1>
h1 a{
width:;
height:;
display:block;
text-indent:-9999px;
background:url(/images/carrerologo.gif);
}Tu logo es un contenido, no un estilo.
Estilo vs contenido, en un tema sensible en los estándares de la web, cierto es que tenemos que diferenciar entre lo que es contenido y lo que es un estilo para el diseño.
Un logo es contenido. Este es un elemento totalmente independiente en tu diseño web y no debe estar controlado por un estilo. Además imagina que alguien visita tu web y su navegador no soporta o no carga estilos, que pasaría con nuestra imagen de marca, no estaría presente y es algo que no debemos permitir. Nuestra imagen corporativa es una representación virtual de lo que significa nuestra marca, por eso es un contenido y no debemos insertarla mediante un estilo.
Y si lo que quieres es un <h1> cuanto antes en tu diseño por temas de posicionamiento en buscadores, quizás tendrías que optar por un ejemplo así:
<a href="/" title="Volver al inicio" id="logo">
<img src="/images/carrerologo.gif" alt="Carrero logo" title="Carrero logo" />
</a>
...
<h1>Bienvenido al sitio web de los Hermanos Carrero</h1>fuente: CSS Wizardry y @danielulczyk