Tutorial:XHTML

Imágenes

En el diseño de una página muchas veces interesará incluir imágenes. Los formatos más comunes y que interpretan los navegadores son JPG, GIF y PNG, cada uno con sus pros y sus contras.

Inserción de imágenes en HTML

Para insertar una imagen en HTML se hará mediante la etiqueta <img /> (image). Esta etiqueta no posee su cierre correspondiente. Obligatoriamente deberemos especificar el atributo src (source), cuyo valor será la ubicación del archivo de imagen:

<img src="ruta-de-la-imagen" />

La imagen podrá estar ubicada en nuestro servidor o alojada en uno externo. Para indicar la ruta lo haremos de la misma forma que se definió en los enlaces.

Uso y abuso de imágenes

Las imágenes dan estilo y atraen al usuario. Sin embargo, abusar de éllas provocará tiempos de carga elevados, saturación visual, poca accesibilidad y/o usabilidad.

Es aconsejable utilizar las imágenes únicamente como apoyo visual para el usuario.

Recomendaciones para el alojamiento de imágenes

Una página puede incluir una imagen de cualquier otro sitio web. Además, existen servicios gratuitos online (www.tinypic.com) que permiten almacenar nuestras imágenes en servidores externos.

Esto tendrá ventajas e inconvenientes. El espacio en disco de nuestro servidor será bajo pero no tendremos control total sobre las imágenes (pudiéndose dar el caso de "imagen rota", donde se pierde la referencia).

Para evitar esta problemática es aconsejable crear una carpeta con las imágenes que vayamos a utilizar para tener siempre el control.

Una correcta estructuración de todos los contenidos de nuestro sitio permitirá un mantenimiento posterior sencillo.