Aprobado con observaciones

Cómo está repartido

Cada área se mide de 0 a 100 y pesa distinto en la nota final. Abajo de 85 hay algo para arreglar; arriba de 90 está bien.

Qué arreglar primero

Estos son los puntos que más cambian el resultado. En orden: el primero es el que más conviene tocar hoy.

1. Letra demasiado chicaSubir el tamaño base a 18-20 px y usar rem para que respete el zoom.
2. Hay más de un título principalDejar uno solo; los demás pasan a <h2>.
3. Botones que no hacen nadaPoner la dirección real (WhatsApp, mail, sección) o convertirlo en texto si no es un enlace.
4. Enlaces a secciones que no existenCrear la sección con ese id o corregir el enlace.
5. Formulario sin destinoPoner el servicio que recibe el formulario (Formspree, una función de Cloudflare, WhatsApp) o dejarlo claro.

Todos los puntos, uno por uno

Cada ficha dice qué se midió, cómo se arregla y cómo comprobar que quedó bien.

Medio (13)

Bajo (6)

Mejora (8)

El pedido listo para pegar

Este texto tiene todos los arreglos juntos. Se copia y se pega en Claude Code para que los haga de una pasada.

Revisá y corregí estos puntos del sitio https://modelo-home-center.pages.dev.
No cambies el diseño ni los textos visibles: solo lo que dice cada punto.
Cuando termines, avisame qué archivo tocaste en cada uno.

1. [Medio] Letra demasiado chica
   Qué pasa: Letra de 15 px en .topbar .tag (y 5 caso(s) más)
   Qué hacer: Subir el tamaño base a 18-20 px y usar rem para que respete el zoom.
   Cómo se comprueba: Mirar la página en el celular a un brazo de distancia: se lee sin esfuerzo.

2. [Medio] Hay más de un título principal
   Qué pasa: 3 etiquetas <h1>
   Qué hacer: Dejar uno solo; los demás pasan a <h2>.
   Cómo se comprueba: Contar los h1 del código: uno.

3. [Medio] Botones que no hacen nada
   Qué pasa: 17 enlace(s) apuntan a '#', vacío o 'javascript:void(0)'
   Qué hacer: Poner la dirección real (WhatsApp, mail, sección) o convertirlo en texto si no es un enlace.
   Cómo se comprueba: Tocar cada botón y ver que pasa algo: abre WhatsApp, baja a una sección, envía.

4. [Medio] Enlaces a secciones que no existen
   Qué pasa: Apuntan a: #cuotas, #cuotas, #cuotas
   Qué hacer: Crear la sección con ese id o corregir el enlace.
   Cómo se comprueba: Tocar el enlace del menú: la página tiene que bajar a esa sección.

5. [Medio] Formulario sin destino
   Qué pasa: El formulario no declara a dónde manda los datos (sin action)
   Qué hacer: Poner el servicio que recibe el formulario (Formspree, una función de Cloudflare, WhatsApp) o dejarlo claro.
   Cómo se comprueba: Llenar el formulario de prueba y confirmar que llega el mensaje.

6. [Medio] La página pesa bastante
   Qué pasa: 1.5 MB en 22 archivos
   Qué hacer: Bajar las fotos grandes a WebP de 1600 px de ancho.
   Cómo se comprueba: Volver a medir el total.

7. [Medio] Falta el candado permanente (HSTS)
   Qué pasa: No hay cabecera Strict-Transport-Security
   Qué hacer: Agregar Strict-Transport-Security: max-age=31536000; includeSubDomains.
   Cómo se comprueba: curl -I y buscar strict-transport-security.

8. [Medio] Falta la lista de permitidos (CSP)
   Qué pasa: No hay cabecera Content-Security-Policy
   Qué hacer: Empezar con default-src 'self'; img-src 'self' data:; style-src 'self' 'unsafe-inline'.
   Cómo se comprueba: curl -I y buscar content-security-policy.

9. [Medio] La página se puede meter dentro de otra
   Qué pasa: Sin X-Frame-Options ni frame-ancestors
   Qué hacer: Agregar X-Frame-Options: SAMEORIGIN o frame-ancestors 'self' en la CSP.
   Cómo se comprueba: curl -I y buscar la cabecera.

10. [Medio] El título se corta en Google
   Qué pasa: 74 caracteres: Casa Firme · Home Center — Materiales, baño, cocina, herramientas y ja…
   Qué hacer: Dejar el título en 50-60 caracteres con lo importante adelante.
   Cómo se comprueba: Contar los caracteres del title.

11. [Medio] Falta la dirección oficial de la página
   Qué pasa: No hay <link rel="canonical">
   Qué hacer: Agregar <link rel="canonical" href="https://tudominio.com/">.
   Cómo se comprueba: Ver el código: una sola dirección canónica, la definitiva.

12. [Medio] Falta la vista previa al compartir
   Qué pasa: Faltan og:title, og:description, og:image
   Qué hacer: Agregar og:title, og:description y og:image (1200x630) en el head.
   Cómo se comprueba: Pegar el link en un chat de WhatsApp: tiene que salir foto y título.

13. [Medio] Falta la ficha del negocio para Google
   Qué pasa: No hay datos estructurados JSON-LD
   Qué hacer: Agregar un JSON-LD de tipo LocalBusiness con nombre, dirección, teléfono y horario.
   Cómo se comprueba: Pegar la URL en el validador de resultados enriquecidos de Google.

14. [Bajo] Los títulos saltan de nivel
   Qué pasa: Ejemplo: de h3 a h5 sin pasar por el del medio
   Qué hacer: Usar la escalera: h1, h2, h3, sin saltar.
   Cómo se comprueba: Recorrer los títulos de arriba a abajo: tienen que bajar de a uno.

15. [Bajo] Falta la zona principal de la página
   Qué pasa: No hay etiqueta <main>
   Qué hacer: Envolver la parte central con <main> ... </main>.
   Cómo se comprueba: Con el lector de pantalla, el atajo de 'región principal' tiene que existir.

16. [Bajo] Descripción fuera de medida
   Qué pasa: 181 caracteres
   Qué hacer: Ajustar el texto a esa medida.
   Cómo se comprueba: Contar los caracteres.

17. [Bajo] Sin ícono en la pestaña
   Qué pasa: No hay <link rel="icon">
   Qué hacer: Agregar favicon.ico o un SVG de 32x32.
   Cómo se comprueba: Mirar la pestaña: tiene que verse el logo.

18. [Bajo] Escala de tamaños sin sistema
   Qué pasa: 20 tamaños de letra distintos
   Qué hacer: Definir la escala en variables y reemplazar los valores sueltos.
   Cómo se comprueba: Mirar los títulos de la página: tienen que ir creciendo de a saltos parejos.

19. [Bajo] Texto que puede cortarse sin aviso
   Qué pasa: Hay white-space:nowrap sin text-overflow
   Qué hacer: Agregar overflow:hidden; text-overflow:ellipsis o permitir que baje de línea.
   Cómo se comprueba: Mirar la página en 360 px: ningún texto se tiene que salir del cuadro.

20. [Mejora] Sin prueba de que otros ya compraron
   Qué pasa: No hay testimonios, reseñas ni cantidad de clientes
   Qué hacer: Poner 2 o 3 frases de clientes con nombre y localidad, o la calificación de Google.
   Cómo se comprueba: Mirar la página: tiene que haber caras o nombres reales.

21. [Mejora] Precios sin aclarar qué incluyen
   Qué pasa: Hay precios y no se aclara IVA, unidad ni forma de pago
   Qué hacer: Aclarar junto al precio: 'por bolsa', 'IVA incluido', 'hasta agotar stock'.
   Cómo se comprueba: Leer los precios: cada uno tiene que decir por qué unidad es.

22. [Mejora] Sin color de marca en el celular
   Qué pasa: No hay meta theme-color
   Qué hacer: Agregar <meta name="theme-color" content="#(color de marca)">.
   Cómo se comprueba: Abrir en el celular: la barra tiene que estar del color del negocio.

23. [Mejora] La fuente del título no va primero
   Qué pasa: No hay <link rel="preload"> de la fuente principal
   Qué hacer: Agregar <link rel="preload" as="font" type="font/woff2" href="/fuentes/x.woff2" crossorigin>.
   Cómo se comprueba: Mirar la pestaña Red: la fuente tiene que salir entre los primeros pedidos.

24. [Mejora] La misma foto para celular y compu
   Qué pasa: No hay srcset ni <picture>
   Qué hacer: Generar dos tamaños (800 y 1600 px) y usar srcset.
   Cómo se comprueba: Con la red del celular, comparar el peso de la imagen antes y después.

25. [Mejora] Sin límites de cámara, micrófono y ubicación
   Qué pasa: No hay Permissions-Policy
   Qué hacer: Agregar Permissions-Policy: geolocation=(), camera=(), microphone=().
   Cómo se comprueba: curl -I y buscar permissions-policy.

26. [Mejora] Sin tarjeta para Twitter/X
   Qué pasa: No hay twitter:card
   Qué hacer: Agregar <meta name="twitter:card" content="summary_large_image">.
   Cómo se comprueba: Compartir el link en X: tiene que salir grande la foto.

27. [Mejora] Pocos enlaces internos
   Qué pasa: 0 enlaces internos
   Qué hacer: Agregar enlaces a secciones y a otras páginas del sitio.
   Cómo se comprueba: Contar los enlaces internos del código.

Candado y cabeceras: se arreglan todas juntas

Los puntos de seguridad se resuelven con un solo archivo de texto llamado _headers que se sube junto a la página. Es como la lista de instrucciones que se pega en la puerta del local: el servidor la lee y la aplica a todo.

# Archivo _headers — va en la raíz del sitio (Cloudflare Pages)
# Ojo: cada bloque empieza con la ruta y las líneas van con dos espacios.

/*
  Strict-Transport-Security: max-age=31536000; includeSubDomains
  X-Content-Type-Options: nosniff
  X-Frame-Options: SAMEORIGIN
  Referrer-Policy: strict-origin-when-cross-origin
  Permissions-Policy: geolocation=(), camera=(), microphone=()
  Content-Security-Policy: default-src 'self'; img-src 'self' data:; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline'; font-src 'self'

/assets/*
  Cache-Control: public, max-age=31536000, immutable

Qué NO mide esta revisión