QA checklist
Todos nuestros proyectos pasan por esta lista de verificación antes de su lanzamiento
ESTILO
Títulos
Cada página web tiene un H1 y los correspondientes H2, H3, H4.
Colores
Todos los colores son globales, según el diseño.
Tipografía
Toda la tipografía se basa en clases adecuadas. Tamaños de propiedad adaptables.
Botones
Botones globales.
Padding y margin globales
Espacios consistentes entre todos los márgenes, rellenos y distancias; de acuerdo con el diseño.
Encabezado y pie de página
Tamaño adecuado de encabezado y pie de página para todos los dispositivos.
Favicon
Favicon: íconos cargados
SEO & ACCESSIBILITY
H1
Cada página debe tener solo un H1.
Estructura de encabezados
Cada página debe seguir una estructura de encabezados lógica (H2 después de H1, H3 después de H2...).
Velocidad
Prueba en GT Metrix Score para A.
Search console
Habilitar search console en el sitio
Alt text de imágenes
Alt text para describir cada imagen.
Código de idioma
Agregar los códigos de idioma de la página web.
Peso de las imágenes
Imágenes optimizadas (menos de 150 KB para las imágenes y 300 KB para los fondos) y/o WebP.
Formato de imágenes
Prefiero usar el elemento 'img' en lugar de configurar una imagen de fondo en un 'div'. Todas las imágenes deben tener ancho y alto.
Meta description & title tag
Cuenta con metadescripciones y etiquetas de título individualizadas para cada página.
Asignar etiquetas
Asignar las etiquetas correspondientes para el encabezado, el pie de página y todas las secciones del sitio web
Elementos de formulario y enlaces con etiquetas asociadas
Todos los elementos de un formulario deben tener una etiqueta asociada y todos los enlaces deben tener una etiqueta. Se puede hacer con el atributo personalizado: aria-label
DISEÑO Y USABILIDAD
Hover
Todos los enlaces y botones tienen estados de hover para indicar al usuario que hay una acción al dar click.
Enlazar páginas
Todos los enlaces están conectados a una sección, página del sitio web o a un enlace externo.
Footer
Se puede acceder a todas las páginas del proyecto desde el footer o desde la barra de navegación.
Interacciones
Todas las interacciones no deben retrasar la forma en que el usuario interactúa con el sitio. El contenido es más importante.
Hover en tablets y dispositivos móviles
Los elementos no deberían tener estados de hover en tablets y dispositivos móviles.
Alto de las imágenes
Todas las imágenes deben tener una altura máxima.
Scroll horizontal
Ninguna página del sitio debe tener desplazamiento horizontal.
Responsivo
Revisar todas las páginas en todos los dispositivos.
Diferentes navegadores
Revisar las páginas en Google Chrome, Safari y Firefox.
OTROS
Analítica
Instalar Google Analytics.
Revisión ortográfica
Con el cliente, revisar la ortografía del sitio.
Página 404
Página de error 404 implementada con la identidad de la marca
Vista previa de imagen en redes sociales
Asegurarse de que la imagen de vista previa de la URL de la página web en las redes sociales sea adecuada. Comprobar en el siguiente link