FrontEnd 101 - Proyecto final
Objetivo
- Crear tu propio sitio web personal al estilo blog personal donde puedes elegir un tema que te guste para desarrollar o hablar de ti mismo. Es un sitio web que puedes utilizar para mostrar tus proyectos, tus habilidades, tus conocimientos, tus gustos, etc.
- El sitio debe incluir todos los labs que hemos visto en el curso.
Algunas ayudas para fomentar la creatividad
- Lo podemos pensar con blog personal
- Como estuvieron en el curso
- Como pasaron las vacaciones
- Como fue el viaje
- Tu juego favorito
- Tu película favorita
- O lo que gustes
Estructura
- directorio (carpeta)
proyecto_final
- página principal
index.html
- estructura de carpetas
css
, js
, img
- Vínculos y navegar por el sitio en todas direcciones
- estructura semántica el html
- comentarios en
html
, css
y js
- directorio para imágenes en formato
png
, jpg
o svg
Requerimientos
El sitio debe ser…
- Responsive (media queries)
- Accesible, leerse bien, tener buen contraste de colores, etc.
- Compatible con los navegadores más populares
- Compatible con dispositivos móviles
- Utilizar
html
semántico
- Utilizar
css
para estilos archivos separados
- Utilizar
js
para interactividad en archivos separados
- Todos los hipervínculos deben estar probados y funcionar correctamente
Contenido
- Utilizar etiquetas html para la estructura del sitio
- header con logo y navegación
- main con contenido
- footer con información de contacto y redes sociales
- aside con información adicional y vínculos
- Utilizar elementos de formularios
- Botones y enlaces
- favicon
- fuente de google
- selección de colores coherente con el tema
- iconos
- imágenes responsivas y del tamaño adecuado
- flex
- grid
- modelo de caja
Secciones del sitio
Labs a incluir
- Pagina principal o inicio
- menu para navegar a los labs y al proyecto final
- incluir todos los labs