Introducción

Este será tu primer proyecto donde crearás un clon de Instagram con tecnologías HTML y CSS y diseño web responsive.

Requisitos

• HTML5
• CSS3
• Responsive. Adaptado a móvil, tablet y laptop

Diseño

Diseño en Figma

Iteraciones

HTML5

Construir la estructura con todas las etiquetas semánticas HTML5 posibles.

CSS3

1. Tipografía personalizada

   El proyecto deberá tener al menos una tipografía personalizada que no tengan por defecto los navegadores.

   Sigue las instrucciones en W3Schools para añadirla Puedes utilizar Google Fonts para encontrar una tipografía adecuada.

2. Selectores

   Haz un uso adecuado de selectores CSS

3. Modelo de cajas CSS

   Recuerda trabajar con margin, padding, border en los estilos de según lo veas conveniente.

4. Efectos

   Utiliza pseudoclases: Hover,focus, etc... para dar un poco de dinamismo a la página.

   Puedes utilizar las propiedades display o visibility combinándolas con las pseudoclases.

5. Distribuciones de la página

   Distribuye todos los bloques que haya en tu página con flexbox.

6. Responsive

   Has de hacer que tu página pueda verse correctamente en móvil, tablet y escritorio. Utiliza todo lo visto sobre diseño fluido, flexbox, media queries para lograrlo.

JavaScript

Coming soon...

Sube a GitHub tu proyecto! 🚀

🧩 Guia Git y GitHub

1. Crear un repositorio en Github para la página de tu biografía.

   1.1 Crear un repositorio para el nuevo proyecto

   1.2 Una vez hecho esto, crea la página de tu biografía o presentación. Llámala instagram.html Aplica todo lo aprendido sobre marcado de texto y formato.

   1.3 Sube tu proyecto a Github.

   1.4 Una vez en tu repositorio (en el navegador) ve a Settings -> Github Pages y en Source cambia la opción de none a main

🧩 Aquí encontrarás una lista de links a recursos que podrían servirte

Y lo más importante. Diviértete y tira de imaginación

Cualquier otro extra que se te ocurra será bienvenido 😊 ¡A por ello!