Para aumentar el SEO vale la pena hacer el marcaje de elementos de schema.org

Aquí un análisis del tamaño del container de la página. Arriba es el actual (78% del ancho del total) y abajo es el diseño (75%). Es necesario reducir el ancho del container para incrementar la legibilidad del contenido.

Actualmente la tipografía base está definida como ui-sans-serif, debe ser Albert Sans. El asset de la tipografía se encuentra en el Google drive de assets del proyecto (ver bookmarks del canal de slack)

El navbar se traslapa con el hero. Así se ve actualmente:

Así debería verse:

Actualmente el navbar tiene una posición absoluta por lo que alterar márgenes o padding en ese elemento no tiene efecto. Podría aumentarse el padding del hero. Así se ve el hero con padding: 7rem 0;

También hace falta posicionar el navbar un poco más abajo para que no quede pegado al borde superior de la página

Actualmente los textos de la barra de navegación están en minúsculas, heredando el color y el font-weight; Hacer los siguientes cambios:

• Especificar text-transform: uppercase;
• Especificar el font-weight: 700;
• Especificar el color: #030303; esto debe quedar en el issue #6 para todos los textos

Actual:

Deseado:

Valores del diseño:

Cambiar peso y color default del texto.

• Color en el código es negro sólido #000000 y el del diseño es #030303;
• Font-weight es inherit, cambiarlo a 300;

Cambiar la tipografía es parte del issue #3 por lo que no se incluye aquí

Cambiar los estilos del texto css del hero a lo siguiente:

h1: font-weight: de 700 a 600;
p: font-weight: de inherit a 300;

En el código actual se incluye el componente de fotos del equipo y el de acerca de pero estos no van en el home dentro del mockup. Quitarlo del home.

La sección incluye lo siguiente:

• Elemento <h2> con la palabra Blog
• 3 elementos ArticleCards
• Botón "ir al blog"

Evaluar si componentizar igual que la sección "FeaturedProjects"

Imagen de referencia:

El Navbar ahorita no tiene ningún acomodo para versión móvil, de hecho está hidden. Este issue es para acomodar el navbar a un menú hamburguesa en versión móvil.

Para la sección "En qué estamos trabajando" hacer los siguientes cambios:

• Encapsular en una sección que contenga Título y texto de la sección, y las cards
• Agregar padding vertical para la sección entera de aproximadamente 6rem o según quede estandarizado para las secciones
• Agregar el ícono de external-link al lado del texto "Conoce más"
  
• Agregar botón de "Ver todos los proyectos"

Si estoy en una página, esa opción debe estar marcada en blanco en el Navbar.
Actual:

Diseño:

Las siguientes secciones de Landing necesitan ser responsivas:

• En qué estamos trabajando
• Suscríbete al newsletter
• Blog

En el footer hacer los siguientes cambios:

• Agregar imagen de logo de codeando en blanco, actualmente está rota
• Arreglar logos de redes sociales

Referencia:

Los azules no contrastan bien con los negros. La muestra está en que el font-color-contrast siempre calcula blancos para el azul mientras que el verde funciona para ambos. Muestra abajo. Este issue es para seleccionar un azul que tenga una mejor propiedad de contraste

Azules:

Verdes:

Hacer la página

Arreglar la distribución de la sección OurUsers

• Aumentar padding vertical de la sección entre 6 y 9 rems (el contenido está muy pegado al borde)

• Reducir el tamaño del container
  

• Aumentar margin-bottom para elemento h2

• Aumentar font-weight del botón a 700;

• Aumentar max-width del <p> a aproximadamente 480px

El weight y color del <p> debería cambiar con este issue: #6

Actualmente las secciones no tienen nombre lo que hace difícil comunicar cuando nos referimos a ellas. Así se ven en el código:

Para el home propongo los siguientes nombres:

• Navbar

• Hero

• ValueProposition **
  
  **

• OurUsers
  

• FeaturedProjects
  

• NewsletterSignUpForm
  

• FeaturedBlogPosts
  

• Footer