Ordenadores y Portátiles
Añadir gráficos
Añadir gráficos a nuestra Web

Añadir gráficos e imágenes en tu Web

Las imágenes en las páginas Web suelen ser casi siempre del tipo de fichero GIF o JPG. Existen otros tipos de imágenes pero estos son los más usados y con los que seguramente trabajaremos casi siempre. Cualquier imagen contendrá una de estas extensiones, por lo que si tienes una imagen con el nombre de “prueba”, estará etiquetada con el nombre “prueba.gif” o “prueba.jpg”. Debes asegurarte de almacenar todas las imágenes y gráficos que se mostrarán en tu sitio Web en la misma carpeta o directorio donde tienes los ficheros html. Puedes también crear un subdirectorio y poner todas las imágenes ahí, y apuntar a ellas en nuestros ficheros html. De otra manera, tu ordenador tendrá problemas encontrando la foto que quieres mostrar. Asegúrate también de teclear el nombre exactamente igual a como se salvo en el directorio.

La etiqueta html utilizada para poner imágenes y gráficos en tu Web es la siguiente:

  • <img src="nombre del fichero y su extensión">

Por defecto, tu texto e imágenes se muestran a la izquierda del navegador, lo cual significa que automáticamente se alinean en el margen izquierdo. Si los quieres centrar cualquier porción de tu página, puedes usar la siguiente etiqueta:



  • <center> Texto o imagen </center>

También puede aplicar estos códigos de divisiones, ya sea una palabra o línea de texto, a toda la página. Se puede empezar la división con la etiqueta de alineamiento siguiente:

  • <div align="center"> y cerrar la etiqueta con </div>

Con la información que has aprendido hasta ahora en este corto tutorial, puedes comenzar a crear páginas Web interesantes y atrayentes. Intenta experimentar con una página Web con todas las etiquetas que has aprendido hasta ahora. De todos modos, no es suficiente y hay más cosas que aprender, como veremos en las siguientes secciones de nuestro tutorial. A continuación veremos como crear tablas en nuestras páginas Web, lo que nos dará una visión más amplia a la hora de diseñar nuestras creaciones. Para ir a la siguiente parte del tutorial, pulsa aquí.

Leer mas artículos relacionados