Este proyecto es una landing page para sitio de hiking. Un sitio muy sencillo trabajado con HTML y CSS (SASS). Sitio número 28 del reto personal #100sitioswebchallenge
Puedes visualizar el sitio en: Hiking Site
DESAFÍOS
Este sitio fue interesante trabajar con una cabecera estilo display, seguí un poco los estilos CSS que usa bootstrap y cree mi propio pequeño repositorio para estar dando algunos estilos al sitio.
.display-1 { font-size: 6rem; }
.display-2 { font-size: 5.5rem; }
.display-3 { font-size: 4.5rem; }
.display-4 { font-size: 3.5rem; }
PROCESO
Paleta de colores y estilos
Paleta de colores: 000000 FFFFFF
Tipografía:
- Oswald de Google Fonts para el título
- Montserrat de Google Fonts para el cuerpo
Font Awesome para los íconos
Mockup (Bosquejo)
Con ayuda de Figma realicé el bosquejo del sitio. A continuación pueden ver el proceso de tener un borrador como primera parte y posteriormente agregarle las imágenes y colores finales.
HTML y CSS
Una vez listo el bosquejo empiezo a maquetar el sitio con HTML y CSS.
Sitio web responsivo
Y por último el sitio queda listo para responder aparatos móviles.
Publicación del sitio
Consulta el código del sitio en Github
Puedes visualizar el sitio en: Hiking Site
Información técnica
- Figma
- Visual Studio Code
- HTML5 (Semántico)
- CSS (SASS, Grid)
- Sitio responsivo
- Github
- Netlify
Recursos
Unsplash
Compárteme tus comentarios y dudas. Este proyecto es una landing page para sitio de hiking.