Ábrelo y búscale lo malo

La primera versión que te dé la IA se va a ver decente en tu computadora. Ese es exactamente el problema: tus clientes no la van a abrir en una computadora.

En la corrida que hicimos, la primera versión pasó por esta misma revisión y salieron cinco defectos, en una página que a simple vista se veía bien. Estos, tal cual:

• Se hacía de lado en el celular. La página medía 474 puntos de ancho en una pantalla de 390, así que se podía jalar hacia la derecha y las tarjetas de servicios salían cortadas. La causa: la IA puso los servicios en tres columnas fijas y no escribió ni una sola regla para pantallas chicas, aunque el prompt decía con todas sus letras "que se vea bien en celular".
• Se inventó cuatro cosas sobre el negocio. De eso trata toda la lección 4.
• Los botones estaban chiquitos para el dedo. Las preguntas frecuentes medían 27 puntos de alto y las ligas del pie de página 17. Un dedo necesita alrededor de 44 para no fallar.
• No tenía ícono para la pestaña del navegador.
• El botón verde flotante tapaba las últimas líneas del pie de página.

Ninguno de los cinco lo habría encontrado leyendo el código. Los cinco aparecieron al abrir la página y usarla.

La revisión de seis puntos

Hazla en tu computadora y otra vez en tu celular. Para verla en tu celular sin publicar nada, el truco más simple es mandarte el archivo a ti mismo por WhatsApp o por correo y abrirlo desde el teléfono.

1. ¿Se hace de lado? Jala la página hacia la izquierda y busca espacio en blanco o contenido cortado.
2. ¿Se lee sin acercar? Comprueba que el texto sea legible sin hacer pellizco.
3. ¿Le atinas a los botones? Prueba botones, preguntas frecuentes y ligas del pie con el pulgar.
4. ¿WhatsApp abre con tu número y el mensaje escrito? Pruébalo de verdad.
5. ¿Dice la verdad? Revisa cada frase con la hoja «Revisión de tu página».
6. ¿Se ve bien al compartirla? Verifica el título y la descripción cuando la página esté publicada.

Cómo pedir las correcciones

Escribe los defectos como síntomas, no como soluciones. Tú viste el problema; la IA sabe la causa. Y pide el archivo completo, siempre.

Así se pidió en la corrida, y funcionó a la primera:

Abrí la página en mi celular y encontré esto. Corrígelo y devuélveme otra vez el archivo completo, no un pedacito. La página se hace de lado en el celular: se puede jalar hacia la derecha y se ven las tarjetas cortadas. Los servicios están en tres columnas fijas. Que sea una sola columna en celular y tres en computadora. Quita todo lo que yo no te dije. Los botones y las preguntas están muy chiquitos para el dedo. Ponle un ícono para la pestaña del navegador. El botón verde flotante tapa lo último del pie de página.

Copiar

Dos reglas para no empeorar las cosas. La primera: guarda la versión que ya tienes antes de pegar la nueva. Copia index.html y llámalo index-v1.html. Cuesta diez segundos y te salva de perder algo que ya servía. La segunda: un mensaje, todos los defectos juntos. Si los mandas de uno en uno, cada respuesta reescribe la página y se te van deshaciendo los arreglos anteriores.

Después de esa segunda ronda, la página de la corrida quedó en 390 de ancho en una pantalla de 390, sin nada cortado, sin botones chicos, con ícono y con una sola columna en celular. Segunda ronda, no quinta.

Ya que hiciste esto: corriste los seis puntos, escribiste tu lista de defectos, pediste la corrección en un solo mensaje y volviste a revisar. Guarda las dos versiones.