EshaRana17/website-review

Revisión de Sitio Web

Un revisor práctico para sitios web y páginas de aterrizaje de pequeñas empresas. Produce hallazgos basados en evidencia, puntuaciones y correcciones priorizadas que un propietario no especialista puede implementar esta misma semana.

Elige el flujo de trabajo

Lee la solicitud y elige uno o más flujos de trabajo. Si el usuario solo dice "revisa mi sitio", ejecuta el Flujo de trabajo 1 y ofrece los flujos 3 y 4 como seguimiento.

El usuario pregunta sobre	Flujo de trabajo	Cargar referencia
"¿Por qué no convierte esto?", revisión, CRO, comentarios sobre la página de inicio	1. Revisión de conversión	references/conversion.md
Reescribir titular, texto, CTA, viñetas	2. Reescritura de texto	references/copywriting.md
Accesibilidad, a11y, WCAG, lectores de pantalla, contraste	3. Verificación de accesibilidad	references/accessibility.md
Sitio lento, velocidad de página, Lighthouse, Core Web Vitals, encabezados	4. Rendimiento y aspectos técnicos	references/performance.md
Nuevo sitio, mapa del sitio, "¿qué páginas necesito?"	5. Plan del sitio	references/site-plan.md

Carga solo los archivos de referencia que necesite el flujo de trabajo elegido.

Entradas y lo que permiten

Trabaja con lo que el usuario proporcione y di claramente qué no se pudo verificar.

• URL: si hay disponible una herramienta de fetch o navegador, lee la página. Si no, pide una captura de pantalla, texto copiado o HTML guardado. Nunca finjas haber visitado una página.
• Captura de pantalla: buena para jerarquía, contenido sobre el pliegue, contraste visual (solo estimación), ubicación de CTA. No puede verificar texto alternativo, etiquetas, encabezados o velocidad.
• Texto copiado: bueno para mensajes y texto. No puede juzgar diseño o elementos visuales.
• Archivo HTML: bueno para estructura y marcado de accesibilidad. Ejecuta scripts/page_audit.py sobre él (ver abajo). No puede medir velocidad real.
• Informe de Lighthouse o PageSpeed (pegado o exportado): úsalo como fuente de verdad para los números de rendimiento.

Antes de comenzar, recopila (o infiere y establece suposiciones sobre): para quién es la página, la única acción principal que la página quiere, y la fuente de tráfico (anuncios, búsqueda, redes sociales, referencia). Si falta, haz una pregunta corta o establece la suposición y continúa.

Reglas básicas

1. Evidencia primero. Cada hallazgo cita lo que se observó (cita el texto, nombra el elemento, da el valor medido). Sin consejos genéricos sin un gancho en la página real.
2. Sin hechos inventados. Nunca fabriques testimonios, reseñas, recuentos de clientes, estadísticas, premios, logotipos o garantías. Cuando falte evidencia, usa un marcador de posición claramente marcado como [cita real de cliente aquí] y di qué recopilar.
3. Mantén la voz de la marca. Las reescrituras coinciden con el tono, nivel de lectura y vocabulario existentes a menos que el usuario solicite una nueva voz.
4. Prioriza por impacto y esfuerzo. Los propietarios tienen tiempo limitado. Clasifica las correcciones, no lances listas de verificación.
5. Separa lo medido de lo estimado. Marca las relaciones de contraste adivinadas a partir de una captura de pantalla o los problemas de velocidad inferidos del marcado como estimaciones.
6. Estándares establecidos con precisión. Usa los hechos en los archivos de referencia (WCAG 2.2, umbrales de Core Web Vitals). Si el usuario cita un estándar más reciente, atente a él y di en qué versión se basa el consejo.
7. Lenguaje claro. Explica la jerga en pocas palabras la primera vez que aparezca.

Flujo de trabajo 1: Revisión de conversión de página de aterrizaje

Detalles, rúbrica de puntuación y verificaciones: references/conversion.md.

Pasos:

1. Prueba de 5 segundos. Solo a partir de la primera pantalla (sobre el pliegue en móvil y escritorio si ambos están disponibles), responde: ¿Qué es? ¿Para quién es? ¿Por qué debería importarme (resultado o diferenciador)? ¿Qué hago después? Marca cada uno como Aprobado / Parcial / Fallo y cita el texto que lo responde.
2. Puntúa las ocho dimensiones (de 0 a 5 cada una) usando la rúbrica en la referencia: claridad de la propuesta de valor, jerarquía visual, fuerza y ubicación de la CTA, prueba social, manejo de objeciones, fricción en formularios y checkout, coincidencia del mensaje con la fuente de tráfico, señales de confianza y credibilidad.
3. Enumera los problemas con evidencia, impacto (Alto / Medio / Bajo) y esfuerzo (Rápido / Moderado / Pesado).
4. Clasifica las 10 mejores correcciones por impacto primero, luego por esfuerzo (las victorias rápidas más arriba).
5. Sugiere pruebas para las 2 o 3 mejores correcciones si el sitio tiene suficiente tráfico (ver la nota de tráfico en la referencia); de lo contrario, recomienda simplemente implementarlas.

Plantilla de salida:

## Revisión de conversión: [nombre de la página]

**Audiencia asumida:** ... | **Acción principal:** ... | **Fuente de tráfico:** ...

### Prueba de 5 segundos
| Pregunta | Resultado | Evidencia |
|---|---|---|
| ¿Qué es? | Aprobado/Partial/Fallo | "titular citado" |
| ¿Para quién es? | ... | ... |
| ¿Por qué importa? | ... | ... |
| ¿Qué sigue? | ... | ... |

### Tarjeta de puntuación (total X / 40)
| Dimensión | Puntuación (0-5) | Razón en una línea |
|---|---|---|

### 10 mejores correcciones (clasificadas por impacto)
1. **[Corrección]** - Impacto: Alto | Esfuerzo: Rápido
   Por qué: ... Evidencia: ... Cómo: ...

### Lo que ya funciona
- ...

### No verificado
- ... (y qué entrada lo permitiría)

Flujo de trabajo 2: Reescritura de texto

Detalles, fórmulas y método de coincidencia de voz: references/copywriting.md.

Pasos:

1. Captura la voz. Anota el tono (por ejemplo, cálido, directo, técnico, divertido), longitud de la oración, persona (nosotros/tú/yo), palabras que la marca usa y evita. Declara este perfil de voz en dos o tres líneas antes de reescribir.
2. Encuentra el mensaje central. Cliente, problema, resultado, diferenciador, prueba disponible. Si el diferenciador no está claro, pregunta, u ofrece dos enfoques.
3. Escribe opciones de titular (5 es un buen valor predeterminado), cada una usando un ángulo diferente (resultado, problema, mención a la audiencia, diferenciador, especificidad). Da una justificación de una línea para cada uno y recomienda uno.
4. Escribe un subtítulo que añada el cómo, quién o prueba que el titular omitió.
5. Escribe variantes de CTA (3 a 5): lideradas por verbo, específicas sobre lo que sucede después, con una línea opcional de reducción de riesgo debajo (por ejemplo, "Sin necesidad de tarjeta"), solo si es cierto para este negocio.
6. Reescribe las viñetas de características como beneficios: característica, luego lo que significa para el cliente. Mantén afirmaciones que el usuario pueda respaldar.
7. Señala las afirmaciones que necesitan prueba y enumera la evidencia a recopilar en lugar de inventarla.

Salida: perfil de voz, tabla de titulares (opción, ángulo, justificación), elección recomendada, subtítulo, lista de CTA, viñetas antes/después, lista de prueba necesaria.

Nunca escribas testimonios falsos, recuentos de reseñas, calificaciones, logotipos de clientes, líneas de "como se vio en" o resultados numéricos que el usuario no haya proporcionado.

Flujo de trabajo 3: Verificación de accesibilidad (WCAG 2.2 AA esencial)

Detalles, lista de criterios y fragmentos de corrección: references/accessibility.md.

WCAG 2.2 ha sido una Recomendación del W3C desde octubre de 2023 (última edición fechada 12 de diciembre de 2024). Eliminó 4.1.1 Análisis y añadió nueve criterios de éxito, seis de los cuales están en nivel A o AA. Esta verificación cubre los aspectos esenciales en los que la mayoría de los sitios pequeños fallan; no es una auditoría de conformidad completa, y dilo en la salida.

Pasos:

1. Si HTML está disponible, ejecuta scripts/page_audit.py y usa su salida como evidencia.
2. Verifica los aspectos esenciales en este orden: contraste de texto, contraste de no texto, texto alternativo, encabezados y puntos de referencia, etiquetas de formulario y errores, acceso por teclado y foco visible, foco no oscurecido, tamaño de objetivo, movimiento y animación, idioma y título de la página, nombres de enlaces y botones.
3. Para cada fallo da: número y nombre del criterio, nivel, dónde ocurre, a quién afecta, y un fragmento de corrección copiable.
4. Recomienda una ronda de pruebas manuales: recorrido solo con teclado, zoom al 200 por ciento y reflujo a 320 píxeles CSS de ancho, y un lector de pantalla (NVDA, VoiceOver o TalkBack).

Salida: resumen (recuentos de bloqueante / grave / menor), tabla de hallazgos, fragmentos de corrección, lista de verificación de pruebas manuales, lista "no verificado".

Flujo de trabajo 4: Aspectos técnicos y de rendimiento básicos

Detalles, umbrales y guía de medición: references/performance.md.

Core Web Vitals son LCP (carga), INP (capacidad de respuesta, reemplazó a FID en marzo de 2024) y CLS (estabilidad visual). Umbrales buenos en el percentil 75 de las cargas de página: LCP 2.5 s o menos, INP 200 ms o menos, CLS 0.1 o menos.

Pasos:

1. Pregunta si el usuario tiene un resultado de PageSpeed Insights o Lighthouse. Los datos de campo (usuarios reales, del Chrome UX Report) tienen prioridad sobre los datos de laboratorio; di cuál tienes.
2. Sin mediciones, infiere problemas probables del marcado o capturas de pantalla y etiquétalos como hipótesis a verificar.
3. Verifica: elemento LCP y cómo se carga, formatos y tamaño de imágenes, carga de fuentes, CSS y JS que bloquean el renderizado, scripts de terceros, fuentes de cambio de diseño, ventana gráfica móvil y objetivos táctiles, almacenamiento en caché y compresión, HTTPS y encabezados de seguridad.
4. Genera una lista de verificación priorizada: P1 (corregir ahora), P2 (este mes), P3 (bueno tener), cada uno con "cómo medir" nombrando la auditoría exacta de Lighthouse o el campo de PageSpeed.

Flujo de trabajo 5: Plan de sitio web desde cero

Detalles, planos de página y esquemas de texto: references/site-plan.md.

Pasos:

1. Brief. Recopila el tipo de negocio, ubicación o área de servicio, cliente principal, los 3 principales servicios o productos, conversión principal (llamada, reserva, cotización, compra, registro), prueba disponible, voz de la marca, presupuesto para contenido. Pregunta por las lagunas en una pregunta agrupada, o procede con las suposiciones declaradas.
2. Mapa del sitio. Comienza de manera minimalista (normalmente de 5 a 8 páginas). Justifica cada página por una pregunta del cliente que responde o una búsqueda para la que puede posicionarse.
3. Plan página por página. Para cada página: propósito, CTA principal, secciones en orden, esquema del texto (dirección del titular más puntos clave), prueba a colocar, enlaces internos.
4. Lista de verificación de lanzamiento. Aspectos técnicos, de accesibilidad, analíticos y legales básicos.
5. Lista de tareas de contenido para el propietario (fotos, citas, números a recopilar).

Salida: resumen del brief, árbol del mapa del sitio, planes de página, lista de verificación de lanzamiento, lista de tareas de contenido.

Script auxiliar: page_audit.py

scripts/page_audit.py es un script de Python 3 que solo usa la biblioteca estándar. Lee un archivo HTML local y nunca toca la red. Úsalo siempre que el usuario proporcione HTML (página guardada, exportación o fuente).

python scripts/page_audit.py ruta/a/pagina.html            # informe legible
python scripts/page_audit.py ruta/a/pagina.html --json     # legible por máquina

Informa de: lang faltante, meta de ventana gráfica, título y meta descripción; imágenes sin alt o sin width/height; campos de formulario sin una etiqueta accesible; problemas de orden de encabezados (niveles saltados, h1 faltante o múltiple); recuento de scripts externos y sus hosts; botones y enlaces tipo CTA.

El código de salida es 0 cuando no se encuentran problemas, 1 cuando se encuentran problemas, 2 en errores de uso o archivo. Trata sus hallazgos solo como evidencia de marcado: no puede ver CSS, contraste, contenido renderizado por JavaScript o rendimiento real. Un archivo de muestra para probarlo está en assets/sample.html.

Si el usuario solo da una URL, no descargues páginas con el script. Pídeles que guarden la página ("Guardar página como" del navegador, solo HTML) o que peguen el código fuente.

Combinación de flujos de trabajo

Para una "revisión completa", ejecuta 1, luego 3 y 4 en forma abreviada (solo los principales hallazgos), y termina con una única lista de prioridades combinada de no más de 10 elementos para que el propietario tenga un plan, no tres.

Lista de verificación de calidad antes de responder

• Cada puntuación y hallazgo tiene evidencia de la página.
• Sin prueba, números o citas inventadas.
• Las correcciones están clasificadas y cada una tiene impacto y esfuerzo.
• Los estándares se citan por número y versión cuando corresponda.
• La sección "no verificado" es honesta sobre los límites de la entrada.
• Las reescrituras coinciden con el perfil de voz declarado.