QR Code Component HTML/CSS

¡Hola! 👋. ¡Buen trabajo al completar el desafío! Tengo algunas sugerencias sobre su código que podrían interesarle.

• Dado que todo el componente involucra escanear el código QR, la imagen no es una decoración, por lo que debe tener un atributo alt con texto. El atributo alt debe explicar su propósito. Por ejemplo: QR code to frontendmentor.io.

• Siempre evite saltar niveles de encabezado. Comenzar con <h1> y trabajar hacia abajo a través de los niveles de encabezado (<h2>, <h3>, etc.) ayuda a garantizar que su documento tenga una jerarquía clara y consistente de encabezados.

• En lugar de usar píxeles en el tamaño de fuente, use unidades relativas como em o rem. El tamaño de fuente en unidades absolutas como píxeles no se escala con la configuración del navegador del usuario. Esto puede causar problemas de accesibilidad para los usuarios que han configurado su navegador para usar un tamaño de fuente más grande. Puedes leer más sobre esto aquí 📘.

• La propiedad width: 100vw en el selector .container no es necesaria. Esto creará una barra de desplazamiento horizontal en algunos dispositivos.

• Puede usar min-height: 100vh en lugar de height: 100vh. La propiedad height puede hacer que tu componente se corte en pantallas pequeñas, como un teléfono móvil en modo horizontal.

Espero que te sea útil! 😄 Por encima de todo, ¡la solución que has presentado es genial!

Saludos