¿Es mejor poner la etiqueta de <em>background-image</em> en losm íconos que hacer una etiqueta <em>img</em> en el HTML?

Ramdhei López Arcila

Ramdhei López Arcila

Pregunta
studenthace 5 años

¿Es mejor poner la etiqueta de background-image en losm íconos que hacer una etiqueta img en el HTML?

5 respuestas
para escribir tu comentario
    Sergio Brandon De Lucio Chavero

    Sergio Brandon De Lucio Chavero

    studenthace 4 años

    El background-image ayuda cuando quieres superponer imágenes a elementos de tu página, porque simplemente queda más bonito, o no te gustan los fondos genéricos.

    Sary Libreros

    Sary Libreros

    studenthace 5 años

    Hola Ramdhei Respecto a tu pregunta, encontré esto en otro comentario:

    Si la imagen es parte del contenido utiliza el tag <img> (con el atributo alt="" para explicar de que trata) por ejemplo si es el logo, o un diagrama, fotos de usuario, etc. Si la pones como parte del contenido hasta se puede imprimir, es decir las imágenes que quieres que estén por default en el sitio. La etiqueta se encontrará indexada por el motor de búsqueda.

    Si no quieres que sea parte del contenido pero si solo del diseño, entonces usa CSS “background-image:”, por ejemplo si quieres tu imagen de fondo de un texto, si quieres ajustar posiciones, colocarle como cover, jugar con animaciones, también si son imágenes que se repiten en el sitio web como íconos, etc.

    En resumen, si es parte del contenido <img> , si el parte solo del diseño “background-image:”

    Igual te comparto este link super bueno para que profundices un poco más en el tema. Espero te sirva :)

    Eligreg López

    Eligreg López

    studenthace 5 años

    ¡Buena idea!

    Ramdhei López Arcila

    Ramdhei López Arcila

    studenthace 5 años

    En otros comentarios decía que es mejor el background image por cuestiones de adaptabilidad, voy a buscar en internet para solucionar definitivamente

    Eligreg López

    Eligreg López

    studenthace 5 años

    Hola, Ramdhei. En los íconos deberías usar una etiqueta img. Quizás este caso no sea muy claro, pero en cuestión de íconos, es mejor una imagen aparte.

Curso Práctico de HTML y CSS

Curso Práctico de HTML y CSS

Construye un clon de Google usando HTML y CSS. Aprende a estructurar y estilizar un sitio web completo, desde el header hasta el footer, usando técnicas de maquetación como Flexbox y Grid. Ideal para afianzar tus fundamentos.

Curso Práctico de HTML y CSS
Curso Práctico de HTML y CSS

Curso Práctico de HTML y CSS

Construye un clon de Google usando HTML y CSS. Aprende a estructurar y estilizar un sitio web completo, desde el header hasta el footer, usando técnicas de maquetación como Flexbox y Grid. Ideal para afianzar tus fundamentos.