Este es un portafolio básico hecho con HTML y CSS llamado Lorem Portfolio. Este es el cuarto proyecto del reto personal #100sitioswebchallenge.
Puedes encontrar el proyecto en línea en: Lorem Portfolio
DESAFÍOS
Según mis matemáticas tengo que estar haciendo 3 sitios web a la semana para cumplir el reto de los 100 sitios web.
Por supuesto lleva tiempo y aún hay que pulir los sitios, por cuestiones de tiempo decidí hacer el sitio lo más sencillo posible para seguir de acuerdo al calendario planeado.
La mayoría de mi tiempo es en el bosquejo del sitio, sobre todo a la hora de asignar el tamaño de la tipografía. Tengo mejorar la manera en saber qué proporción es la mejor, hasta ahorita he estado trabajando con 3 diferentes tamaños para la cabecera
- h1
- h2
- h4
Estoy usando h1 sólo para el sitio de home en algunas ocasiones, y dejo h2 como mi sub-cabecera. Y uso h4 como parte de los títulos dentro de algunas partes del cuerpo de algunas secciones. En este proyecto se puede ver reflejado en la parte de los proyectos individuales en portafolio.
PROCESO
Paleta de colores y estilos
Estos fueron los estilos y la paleta de colores que usé:
- Paleta de colores: colours.café
- Tipografía: Raleway tipo Sans-Serif
- Íconos: Font Awesome
Mockup (Bosquejo)
Este fue el primer borrador de la idea para este proyecto.
Aunque al final me tomo la libertad de hacer ciertos ajustes.
HTML y CSS
Usar VS Code me hace la vida más sencillo a la hora de maquetar el sitio con HTML y CSS.
Este portafolio básico, constaba sólo con una sección de inicio, otra de contacto, y una sección por cada proyecto presentado en este demo.
Sitio web responsivo
Puede observarse el sitio responsivo, el cual empieza su aplicación cuando el ancho del dispositivo es menor a 768px.
Publicación del sitio
- Consulta el código
- Visita el sitio web en vivo con Netlify: Lorem Porfolio
Información técnica
- Figma – Diseño de bosquejo
- VS Code
- HTML5 (semántico)
- CSS
- Responsive Website Design
- Github
- Netlify
Recursos
- Pexels, Tobi
- Licencia Font Awesome
Este fue el portafolio básico hecho con HTML y CSS. Déjame tus comentarios y sugerencias.
