Este proyecto se enfoca en el desarrollo de layouts responsivos y adaptables a diferentes tamaños de pantalla. A través del curso "Layouts Responsivos" en Alura Latam, doy especial agradecimiento a la instructora del curso Tatiani Meneghini
Aprendí a utilizar EMMET, una herramienta que te permitirá generar bloques de código de manera eficiente, ahorrando tiempo durante el desarrollo web. Con EMMET podrás crear rápidamente estructuras HTML y CSS utilizando una sintaxis sencilla y abreviada.
Comprendí la importancia y el uso de las unidades de medida relativas, como "rem", para crear diseños flexibles y adaptables a diferentes tamaños de pantalla. Estas unidades permiten establecer tamaños y espacios proporcionales, facilitando la adaptación del diseño a distintos dispositivos.
Exploré los diferentes tipos de imágenes y aprendí a utilizar SVG y técnicas para que las imágenes se adapten correctamente a los dispositivos móviles y pantallas de diferentes tamaños. Esto garantizará que las imágenes se vean nítidas y bien proporcionadas en cualquier dispositivo.
Conocí la importancia de la configuración del viewport y la propiedad initial-scale
, la cual afecta el nivel de zoom aplicado en un sitio web. Aprenderás cómo configurar correctamente el viewport para garantizar una experiencia de usuario consistente en dispositivos móviles y de escritorio.
Aprendí cómo lograr que las imágenes ocupen todo el tamaño de la pantalla en dispositivos móviles, así como establecer límites para evitar la pixelación en pantallas más grandes. Esto te permitirá aprovechar al máximo el espacio disponible en diferentes dispositivos.
Utilicé variables de CSS para definir propiedades importantes, como colores y fuentes, de manera más concisa y reutilizable en tu proyecto. Las variables CSS te ayudarán a mantener un código limpio, organizado y fácilmente modificable.
Aprendí el concepto de Mobile First para diseñar y desarrollar sitios web que se adapten de manera óptima a diferentes tamaños de dispositivos, desde móviles hasta tablets y escritorios. El enfoque Mobile First prioriza la experiencia en dispositivos móviles y luego se adapta a pantallas más grandes, asegurando un diseño responsivo y amigable para el usuario.