INSERTAR IMAGENES EN PAGINAS WEB

Sin lugar a dudas una de las características mas representativas en una pagina web son las imágenes que en ella se encuentra. Es muy extraño conseguir paginas web sin ningún tipo de imágenes.
Las imágenes le dan dinamismo, personalidad y un toque diferente a las paginas web, claro, utilizadas de manera equilibrada, porque como sabemos que todo exceso es malo, si llenamos nuestra pagina con imágenes, lo que lograremos es distraer a el ínter nauta o aun peor, hacer que este no espere para entrar a nuestra pagina, ya que la cantidad de imágenes en la misma han demorado el tiempo de descarga.

Las nociones básicas para el uso de archivos gráficos son sencillas, conocerlas, aunque sea ligeramente, nos ayudará a crear sitios agradables y rápidos. Veamos algunas características de los diversos tipos de archivos gráficos utilizados en la elaboración de paginas web.
En web se utilizan principalmente dos tipos de archivos gráficos GIF y JPG. Estos son conocidos como MAPAS DE BITS, estipulados especialmente para evitar la ocupación de grandes espacios en disco, y por consiguiente se trasmitan de manera mas ágil y eficiente por la Red. Adicionalmente, se puede usar un tercer archivo grafico en las páginas web, el PNG. Este formato no tiene tanta aceptación como el GIF o JPG por varias razones, principalmente el desconocimiento del mismo por parte de las personas que crean paginas web, que los programas utilizados para trabajar gráficos (como por ejemplo Photoshop) generalmente no lo soportan y que los navegadores antiguos tienen problemas para visualizarlas. Sin embargo, el formato se caracteriza en cuanto a compresión y calidad del gráfico conseguido.

GIF (Graphics Interchange Format): este tipo de archivo es utilizado para imágenes dibujadas, posee buena comprensión, transparencia (la cual nos permite cambiar la imagen a distintos fondos sin que se note la diferencia) y permite la utilización de paletas de aproximadamente 256 colores, este también implica saber que entre menos colores utilicemos menos espacio ocupara el archivo, mas esto no afecta en consideración la calidad del grafico.

JPEG (Joint Photographics Experts group): es ideal para guardar fotografías, debido a que su comprensión y a la posibilidad de definir la calidad de la imagen, lo que nos permite a su vez decidir cuanto espacio queremos que esta ocupe. Además JPG trabaja siempre con 16 millones de colores, especial para fotografías. Aunque en relación a la trasparencia, este tipo de archivos no tienen esta posibilidad y se necesitaría de un programa de diseño grafico para hacerlo.

Para lograr que los archivos ocupen menos espacio y por consiguiente se transfieran rápidamente por la red, es importante que optimicemos los ficheros. En relación con los archivos GIF se reducen los colores utilizados y los archivos JPEG se ajusta la calidad de la imagen cuando se este bajando; esto se puede hacer con la ayuda de Photoshop u otros optimizadores gráficos.
En general las imágenes digitales de mapas de bits ( GIF y JEPG) poseen una desventaja ya que aunque se utilice cualquier técnica, agrandamos la imagen esta pierde la calidad y, por otra parte, también habremos aumentado su peso en kilobytes... Si disminuimos su tamaño, perderá calidad, aunque quizás también disminuya su peso. “Las imágenes de mapas de bits admiten mal los cambios de tamaño, generalmente ello repercute en su calidad”

Otro tipo de imágenes digitales utilizados en la web, y que ha creado gran sensación debido a lo innovador de su estructura son las IMÁGENES VECTORIALES, ya que vienen definidas por una formula matemática, lo cual les permite generar archivos mas pequeños que se bajan o cargan con mayor rapidez; además no pierden calidad al efectuarse cambios en su tamaño (Las películas FLASH son un ejemplo de estas imágenes)

Para insertar imágenes en un documento de una pagina web, se utiliza el atributo IMG. Esta etiqueta no posee su cierre correspondiente y en ella hemos de especificar obligatoriamente el paradero de nuestro archivo grafico mediante el atributo SRC
En una pequeña formula quedaría así:abre con el signo menor que (<) luego
img src= "camino hacia el archivo" y finaliza con el signo mayor que (>)

Para expresar el camino, se realiza igual que con los enlaces, solo que en esta el lugar de destino es la identificación o código de un archivo grafico.
La etiqueta IMG, también nos permite adicionarle otros atributos a las imágenes por ejemplo:
ALT: dentro de las comillas de este atributo se puede colocar una pequeña descripción a la imagen mientras la misma se descarga. Esto es de gran ayuda sin pensamos en aquellos navegadores que no permiten mostrar imágenes, por lo tanto los navegantes tendrían una idea de la imagen que se encuentra allí.
HEIGHT Y WIDTH
Definen la altura y anchura respectivamente de la imagen en pixels. Estas dimensiones pueden obtenerse a partir del propio diseñador grafico o bien haciendo clic con el botón derecho sobre la imagen vista por el navegador para luego elegir propiedades sobre el menú que se despliega.
determinar estas dimensiones en las imágenes, ayuda al navegador a elaborar unos limites o maquetación correcta, permitiendo que el ínter nauta pueda leer tranquilamente sin que la descarga de las imágenes afecten el texto.
aunque recordemos que si trabajamos con mapas de bits, debemos ser cuidadosos con la alteración de el tamaño de las imágenes ya que afectan su calidad y el tiempo de descarga.
BORDER
Definen el tamaño en píxeles del cuadro que rodea la imagen.
De esta forma podemos recuadrar nuestra imagen si lo deseamos. Es particularmente útil cuando deseamos eliminar el borde que aparece cuando la imagen sirve de enlace. En dicho caso tendremos que especificar border="0".
Para utilizar las imágenes como enlaces, debemos saber las etiquetas para insertar vínculos e imágenes. Primero se inserta el vinculo (abriendo con < y cerrando con >) luego se inserta la imagen abriendo y cerrando con los mismos signos anteriores y finalizando con < seguido de / luego la letra a y cerrando con >
VSPACE Y HSPACE Sirven para indicar el espacio libre, en píxeles, que tiene que colocarse entre la imagen y los otros elementos que la rodean, como texto, otras imágenes, etc.

PAGINAS DONDE CONSIGUE MAYOR INFORMACIÓN:
http://www.studiumweb.net
http://www.aulafacil.org
http://www.desarrolloweb.com