Contenidos

    alt

    Seguimos en la semana del HTML en el blog de YOSEO Marketing. Ya hemos aprendido cosas, cosas chulas como hacer tablas, meter espacios o incluso ocultar el código fuente de nuestra página (o al menos intentarlo). Vamos con algo básico, códigos HTML para insertar imágenes en una web. Así es porque no hay nada más soso y poco atractivo que una web que es solo texto.

    Códigos HTML para insertar imágenes

    Para definir una imagen en HTML se utiliza la etiqueta <img>. Requiere dos atributos: src y alt. La línea de código quedaría así:

    <img src=»imagen.jpg» alt=»Nombre de la imagen» height=»100″ width=»1000″>

    El atributo src específica la url de la imagen, es decir, donde se encuentra alojada. Para los programadores novatos un error común es guardar la imagen en una carpeta de su equipo, de modo que cualquiera que se meta a la web desde otro ordenador será incapaz de verla. Para que la imagen se pueda visualizar sin problemas por cualquiera, debe estar en internet, así que lo normal es que entre todas las carpetas que conforman la web haya una para guardar todas las imágenes.

    El atributo alt específica un texto alternativo para la imagen. Ese texto le aparecerá a quienes no les cargue la imagen correctamente, así que debe describir el contenido de la misma. Por ejemplo: “logo”.

    Y los atributos height y width especifican respectivamente la altura y la anchura de la imagen. Puede ponerse en pixeles (poniendo px al lado del número o no poniendo nada) o en porcentaje (porcentaje de pantalla que ocupan).

    Formatos de imágenes admitidos en HTML

    Los formatos en los que se pueden publicar imágenes en HTML son los siguientes:

    .gif         Acrónimo de Graphics Interchange Format. Los gif. son el formato predilecto para las animaciones.

    .jpg o .jpeg         Acrónimo de Joint Photographic Experts Group. Las dos variables son indiferentes. Este formato comprime las imágenes para que ocupen menos espacio (espacio en bytes, no en pixeles).

    .png       Acrónimo de Portable Network Grapic. Es un formato de mejor calidad que el .jpg, pero ocupa más espacio.

    .bmp     Se trata de un mapa de bits. No muchos navegadores son capaces de mostrarlo como imagen, así que mejor usar jpg o png.

    Usando estos sencillos códigos para insertar imágenes en HTML y podrás darle un aspecto más profesional y atractivo a tus páginas webs.

    Te deSEO un buen día,

    William Penguin.

    Artículos Relacionados
    SEO Responsive 12/06/2019 SEO Responsive, una condición básica para posicionarse en Google

    El SEO Responsive es una de las condiciones básicas para el posicionamiento en Google. En el post anterior analizábamos...

    desactivar gutenberg 12/12/2018 Cómo desactivar Gutenberg y volver al antiguo editor de WordPress

    Poca gente sabe que fui de las primeras personas en ir al trabajo en patinete eléctrico. También me saqué...

    gutenberg wordpress 11/12/2018 Gutenberg WordPress: Así es el nuevo editor del CMS más popular

    Este fin de semana ha sido movidito, y es que de golpe y porrazo han llegado dos de los...

    poner un hipervinculo en html 24/10/2018 Cómo crear hipervínculos en HTML para poner links a otras páginas

    Llamados links o hipervínculos, los enlaces HTML son los puentes que nos permiten movernos de una página a otra....

    Deja un comentario

    Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *