Texto + Imágenes = Multimedia
Multimedia + WWW = Global HyperMedia
¿Lo coge?
esta imagen de una "Gran M".
El formato HTML para la etiqueta de la imagen inline es:
<img src="nombre_de_archivo.gif">
donde nombre_de_archivo.gif es el nombre de un archivo GIF que resida en el mismo directorio/carpeta que su documento HTML. Por "inline" queremos dar a entender que un web Browser mostrará la imagen "dentro" del texto.
Note cómo el texto sigue inmediatamente a continuación de la "Gran M" ¿Cómo haríamos si quisiéramos que la "Gran M" estuviera sóla en su propia línea? Para forzar a la imagen a aparecer en una línea separada
simplemente insertaríamos una etiqueta de parágrafo antes de la etiqueta de imagen:
<p> <img src="nombre_de_archivo.gif">
<img align=top src="nombre_de_archivo.gif">
<img align=middle src="nombre_de_archivo.gif">
<img align=bottom src="nombre_de_archivo.gif">
Note cómo sólo se alinea una línea de texto... (haga más pequeña o más grande la ventana de su web Browser para ver qué ocurre). Con HTML 2.0 no se pueden tener bloques de texto adyacentes a la imagen. En una lección posterior veremos un modo para crear dicho efecto.
En este ejercicio usted añadirá una imagen de un volcán como introducción a su lección.
<img src="lava.gif">
Este código HTML insertará al principio de su página, la imagen de lava que se bajó en la lección previa.
Bajo estas condiciones, un browser sin capacidad gráfica verá una descripción de la misma tal y como por ejemplo nuestra página de trabajo:
[IMAGE]
Web de Volcanes
En esta lección usará la Internet para buscar información
sobre volcanes y luego escribir un informe sobre los resultados.
-----------------------------------------------------------------
En Esta Lección...
Esto le permite a un browser saber que ahí hay un gráfico, en dicha posición. Sin embargo, se puede modificar
la etiqueta <img> de modo que mejor que un "recordatorio gráfico" aparezca un texto alternativo.
Por ejemplo, en nuestra lección podríamos añadir eso de "Una Lección Sobre:" modificando la etiqueta <img>
y que quede como:
<img alt="Una Lección Sobre:" src="lava.gif">El atributo alt="..." remplazará el icono gráfico con una cadena de texto en los browsers de sólo-texto (o browser gráfico con la carga de imágenes desactivada) mostrando:
Una Lección Sobre:
Web de Volcanes
En esta lección usará la Internet para buscar información
sobre volcanes y luego escribir un informe sobre los resultados.
-----------------------------------------------------------------
En Esta Lección...
Añada ahora esta modificación en la etiqueta <img> que muestra la imagen del volcán en su página HTML.
El formato para incluir esta opción es:
<img src="nombre_de_archivo.gif" width=X height=Y >donde X es la anchura de la imagen e Y es la altura de la misma en pixeles.
Existen programas gráficos usuales que ayudan a determinar estos números. Otro modo de conocer las dimensiones del tamaño de una imagen es cargarlas en su web Browser (debe ser capaz de disponer de "drag-n-drop" y entonces arrastrar el icono del archivo en la ventana del Browser) y la altura y anchura aparecerán en la barra de títulos.
Para nuestro ejemplo en esta lección, la imagen lava.gif es 300 pixeles de ancho por 259 de alto. Así, ahora debería editar su archivo volc.htm de modo que quede como:
<img alt="Una Lección Sobre:" src="lava.gif" width=300 height=259>
NOTA: El orden de los atributos dentro de la etiqueta <img> no tiene importancia.A menudo nos preguntamos si se puede alterar el tamaño de la imagen insertando números distintos de las dimensiones reales de la misma. La respuesta es si, pero los resultados pueden ser no los mejor deseados. Si incluye números muy grandes (para hacer la imagen más grande) el resultado será un bloque. Con números pequeños, para hacer la imagen más pequeña, la imagen saldrá distrosionada. Puede experimentar y verlo usted mismo. ¡Querríamos equivocarnos!
Si ve un icono con una interrogación:
asegúrese primero de que el archivo HTML y la imagen GIF residen ambos en el mismo directorio o carpeta. Luego compruebe que el nombre del archivo de la imagen es el correcto en su archivo HTML, en la etiqueta <img... >
NOTA IMPORTANTE: Algunos sistemas informáticos (por ejemplo, UNIX) distinguen entre mayúsculas y minúsculas (del inglés, "case sensitive") para los nombres de los ficheros, queriendo esto decir que el archivo "lava.GIF" NO ES el mismo que "lava.gif". Otros ordenadores (como el Macintosh) los consideran un mismo archivo. Pero, incluso si su ordenador no diferencia entre caracteres le recomendamos encarecidamente que sea lo más consistente posible con estos pequeños detalles como el de que los nombres de los archivos sean los mismos, tanto el nombre en sí como la referencia en un documento HTML. Incluso haciendo la distinción entre mayúsculas y minúsculas. (Muchos servidores de WWW corren sobre UNIX)
El enlace con el MCLI es Alan Levine --}
Comentarios a levine@maricopa.edu
Traducido al español por agma@usa.net
URL: