Nueve técnicas de sustitución de imágenes con CSS

0 - , - 06/02/2010 08:50:02

La sustitución de imágenes mediante CSS es, a grandes rasgos, una técnica de sustitución de un elemento de terxto de una pagina por una imagen. Quizá uno de los ejemplos más clarificadores sería a la hora de incluir el logo en una web. Es posible que desees utilizar una etiqueta <h1> y texto por accesibilidad y los beneficios en cuanto a SEO, pero a la vez, y por razones estéticas, te gustaría mostrar tu logo y no el texto.

Un ejemplo:

<h1 id="logo">
	<span>Intenta
</h1>

y el css:

h1#logo {
        width: 250px;
        height: 25px;
        background-image: url(logo.gif);
}
h1#logo span {
        display: none;
}

En CSS-Tricks puedes encontrar el análisis de nueve de estas técnicas, cómo se realizan y las ventajas y desventajas de cada una.

Nine Techniques for CSS Image Replacement » »

Deja tu comentario

  • El comentario debe estar relacionado con el contenido de la entrada.
  • Comentarios ofensivos, con spam o con lenguaje inapropiado serán eliminados.

captcha