Guia y Documentacion HTML: Maquetando Imagenes
Guía y Documentación HTML: Maquetando Imagenes

Las imagenes que soportan directamente los navegadores deben de estar en formatos GIF y/o JPEG.
Las imagenes en formato GIF podran representar hasta 255 colores diferentes, y podran incluir GIF89 multiframes, esto es esas fotos con movimiento.
Además en el formato GIF89 podremos marcar uno o mas colores de la paleta como colores transparentes.
En cambio, en el formato JPG, no podremos situar transparencias, podremos utilizar un gran número de colores hasta 16 Millones de colores, con lo que obtenemos imagenes de mucha calidad.
Además, en una imagen con alto colorido, un JPG puede ocupar hasta 10 veces menos tamaño de fichero que su equivalente en GIF, y esto es muy importante a la hora de insertarla en una página WEB.
En una imagen JPG, tambien podremos seleccionar la relación compresion/calidad de la misma, pudiendo a veces seleccionar mas calidad y menos velocidad al recibir la página o por el contrario, una menor calidad en beneficio de la rapidez con la que el usuario recibirá la fotografia.
En la mayoria de los casos no es ni siquiera necesario que el usuario tenga una configuración de vídeo con mas de 256 colores para que aprecie la diferencia de calidad en la imagen.
Observe en las siguientes imágenes ( cronometre el tiempo que tarda en recibir cada una ):
Esto es un GIF con 256 colores de 212 Kb
Esto es un JPEG de media calidad de 72 Kb

Una imagen puede ser posicionada en cualquier zona de la página, usando las siguientes técnicas:
La imagen ademas puede ser escalada a otros tamaños, usando los códigos WIDTH y HEIGHT dentro del código IMG:
<img src=/tutoriales/manuales/htmldocs/tutankamon_min.jpg width=100> La imagen medira 100 pixels de ancho, y la altura sera proporcional a la imagen original
<img src=/tutoriales/manuales/htmldocs/tutankamon_min.jpg width=100 height=600> La imagen medira 100 pixels de ancho, y la altura sera de 600 pixels, con lo que será distorsionada

Esto es de gran utilidad cuando se desea cargar una imagen de un cierto tamaño y calidad, y se previsiona a un tamaño inferior, de esta forma se evita que se cargen dos imagenes, y se ahorra tiempo de transmisión.


Si usted ya ha llegado hasta aqui, seguro que una vez haya asimilado la base de qué es un HTML, el resto le será mucho más fácil.
Si tiene dudas escribanos a support@interec.com.