CETPRO PUNO Operación de Computadoras

Etiqueta enlaces

Insertar Imágenes.

La etiqueta para introducir una imagen en nuestra página es <img src="nombre.gif"> (src de source
en inglés fuente u origen de la imagen) y siendo nombre el nombre que tiene la imagen y .gif su
formato.
La etiqueta funcionará bien siempre y cuando la imagen esté en la misma carpeta en la que se
encuentra la página web desde la que la llamamos. Es habitual (y recomendable) colocar todas las
imágenes en otra carpeta interna, en ese caso, habrá que darle la ruta en la cual se encuentra nuestra
imagen. Supongamos que la imagen nombre.gif se encuentra en una carpeta denominada imágenes,
pues bien, la etiqueta sería <img src="imagenes/nombre.gif">
En este caso el formato de la imagen es .jpg (junto con el .gif y el .png los formatos de imágenes
más habituales en internet). La imagen se denomina: paisaje1.jpg

Pág. 28
CETPRO PUNO Operación de Computadoras

Atributos de la imagen width y height.

Es muy importante introducir las medidas de la imagen (las podemos averiguar desde un programa
gráfico como PhotoShop) dentro de la etiqueta <img>. De esta manera cuando el navegador va
recorriendo la página reserva el espacio justo para la imagen y, el resto de la página se va cargando
sin problemas mientras se acaba de cargar la imagen. En nuestro caso la imagen tiene 500 de ancho
y 300 de alto. Escribiríamos:

CREAR ENLACES O VÍNCULOS.

Es una de las herramientas más interesantes de los documentos html. La sintaxis para establecer un
enlace es: <a href="destino">texto</a>
Donde destino es el documento con el que se enlaza y texto es la palabra o palabras que, al pulsar,
nos llevan a ese destino (también puede ser una imagen).
Víncular a otro documento del mismo sitio. Nuestro sitio estará formado por varios archivos
generadores de varios documentos. Los documentos tendrán la extensión .html (o .htm).
Vínculos a otro documento externo al sitio. En este caso en destino deberemos escribir toda la
dirección URL del sitio. Vamos a establecer un enlace a la página del buscador Google cuya dirección
URL es http://www.google.com y blogger del CETPRO PUNO

Pág. 29
CETPRO PUNO Operación de Computadoras

Insertar imágenes animadas Imagen como vínculo a otro documento.

Los archivos GIF deben estar en la misma carpeta donde se ubica el archivo HTML

Carpeta imágenes con los siguientes

archivos

PRACTICA:
Insertar imágenes
animadas desde internet
obteniendo la dirección.

Tener listo una página en

HTML para insertar
imágenes de internet

Ingresar a Google y
buscar GIFS
ANIMADAS

Pág. 30
CETPRO PUNO Operación de Computadoras

Ingresar al primer dibujo animado

La imagen debe estar moviéndose
Botón derecho mouse sobre dibujo animado y clic en Inspeccionar

Muestra la dirección de dicho gif. Clic botón derecho mouse, sobre subrayado

Clic Edit attribute

Pág. 31
CETPRO PUNO Operación de Computadoras

Queda seleccionada la
dirección, copiar y
pegar a nuestra página
web
haciendo Ctrl +C y
llevar a nuestra página
web y hacer Ctrl + V

https://www.chiquipedia.com/imagenes/gifs-animados-pokemon-picachu-1.gif
De igual manera insertar otros dibujos animados o distintos formatos

Pág. 32