Su desafío es crear esta página de destino y hacer que se parezca lo más posible al diseño.
Sus usuarios deberían poder:
- Ver el diseño óptimo para el sitio según el tamaño de la pantalla de su dispositivo
- Los aspectos que tendremos en cuenta para la corrección serán los siguientes: -Estructura correcta de HTML -Uso y correcta implementación de etiquetas semánticas -Adaptabilidad a dos tipos de dispositivos (Mobile: 375px y Desktop, no responsive) -Correcta implementación del fomulario -Imagens, iconos, fuentes, background -Implementación de Flexbox -Buenas Practicas en el CSS -Pseudoelementos y Pseudoclases -(opcional) ---> Pequeñas animaciones
Su tarea es construir el proyecto con los diseños dentro de la carpeta / diseño
. Encontrará una versión móvil y de escritorio del diseño.
El diseño para mobile esta en formato estático JPG. Si desea hacerle cambios esteticos lo puede hacer a su gusto
Se agrega link a Figma [https://www.figma.com/file/3PSyK3KYcmvbwK2OVFjFWm/Nico-Digital?node-id=4%3A2], con la oración anterior se hace referencia de que no siempre se le debe hacer caso a todo lo que nos dice esta herramienta.
Encontrará todos los recursos necesarios en la carpeta / imagenes
. Los activos ya están optimizados.
También hay un archivo style-guide.md
que contiene la información necesaria, como la paleta de colores y las fuentes.
No dude en utilizar cualquier flujo de trabajo con el que se sienta cómodo. A continuación se muestra un proceso sugerido:
- Revise los diseños para comenzar a planificar cómo abordará el proyecto. Este paso es crucial para ayudarlo a pensar en el futuro para que las clases de CSS creen estilos reutilizables.
- Antes de agregar cualquier estilo, estructure su contenido con HTML. Escribir su HTML primero puede ayudarlo a enfocar su atención en la creación de contenido bien estructurado.
- Escriba los estilos base para su proyecto, incluidos los estilos de contenido general, como
font-family
yfont-size
. - Comience a agregar estilos en la parte superior de la página y continúe hacia abajo.
- Deje comentarios en el codigo en caso que lo crea necesario
Envíe su solución en el google forms adjunto en PG, por favor adjuntar un archivo ZIP.