Inserción de Imágenes
Temario
- Código para añadir Imágenes
- Pasos Para añadir imágenes
Código para añadir Imágenes
<!DOCTYPE html><html lang = "es"><head><title>Inserción de Imágenes</title><meta charset = "UTF-8" /></head><body><h1>Imagen de Muestra</h1><p><img src = "programandoLaNet.jpg" alt = "Imagen de Programando la Net" /></p></body></html>
Lo que veremos en el navegador sera:
En este ejemplo la imagen se llama (programandoLaNet) y su extensión es (.jpg)
Cuando tenemos mas de una imagen en nuestro sitio, es una buena práctica tenerlas almacenadas en una carpeta específica.
Para indicarle al navegador que entre a una determinada carpeta, se antepone el nombre de la carpeta antes del nombre de la imagen
Pasos para Añadir Imágenes
1. Identificar la imagen que desea utilizar. Por supuesto, usted tiene que tener acceso a la imagen antes de poder utilizarlo. Asegúrese de que tiene permiso para poder utilizar la imagen en su sitio.
2. Modificar la imagen si es necesario. Es posible que necesite ajustar la imagen para su uso en la página. Lo mejor es cambiar el tamaño de las imágenes antes de que se utilicen en la Web.
3. Elija el tipo de imagen. Los Navegadores Web pueden mostrar .jpg .gif y .png. Si la imagen está en otro formato, es mejor que busque un editor de imágens que le permita convertir la imagen a alguno de estos tipos
4. Ponga su imagen en el lugar correcto. El archivo de imagen debe estar en el mismo directorio que el archivo HTML. De esta manera, al publicar su página a la servidor, la imagen permanecerá en su lugar.
5. Construye tu página de forma normal. La imagen se coloca con una etiqueta integrada en el cuerpo.
6. Utilice la etiqueta <img> para indicar la imagen. Esta etiqueta debe ser incorporada dentro de un párrafo o div para no tener problemas en la validación.
7. Utilice el atributo src para indicar el archivo que contiene la imagen. Si el archivo de la imagen está en el mismo directorio que la página Web, todo lo que necesita es el nombre de la imagen, si esta en una carpeta, nombre la carpeta como se muestra en el ejemplo y si el archivo de la imagen está en otra parte de Internet, puede utilizar la URL completa que posee la imagen
6. Utilice la etiqueta <img> para indicar la imagen. Esta etiqueta debe ser incorporada dentro de un párrafo o div para no tener problemas en la validación.
7. Utilice el atributo src para indicar el archivo que contiene la imagen. Si el archivo de la imagen está en el mismo directorio que la página Web, todo lo que necesita es el nombre de la imagen, si esta en una carpeta, nombre la carpeta como se muestra en el ejemplo y si el archivo de la imagen está en otra parte de Internet, puede utilizar la URL completa que posee la imagen
Para entrar a una carpeta independiente llamada (img)
<img src = "img/programandoLaNet.jpg" alt = "Imagen de Programando la Net" />
Para el URL de una Imágen
<img src = "http://sphotos-a.ak.fbcdn.net/hphotos-ak-prn1/1017226_376510372450536_1759984972_n.jpg" alt = "Imagen de Programando la Net" />
8. Incluya el atributo alt describir la imagen. El atributo alt contiene texto que describe la imagen.
9. Poner fin a la etiqueta de imagen con un /. La etiqueta img es una etiqueta especial que no posee una etiqueta de cierre. El carácter de barra al final de la etiqueta indica que la etiqueta es impr y sirve como su propia etiqueta final.
No hay comentarios:
Publicar un comentario