Tres auditores de IA revisaron mi web: lo que encontraron y lo que solo yo pude ver

Puse a tres auditores de inteligencia artificial a revisar mi propio sitio al mismo tiempo y en menos de 45 minutos me entregaron 45 problemas priorizados, cada uno con el archivo, la línea de código y el arreglo exacto. El más caro estaba a la vista de todos: el botón principal, verde con letra blanca, tenía un contraste de 2,28:1. La norma de accesibilidad pide al menos 4,5:1.

Mi sitio, carlosbetancur.co, «se veía bien». Lo abría todos los días en mi portátil y no le encontraba nada grave. Ese es el problema de casi todos los sitios que no convierten: el dueño los mira en una sola pantalla, con un solo navegador y siempre entrando por la portada.

Este artículo es para el dueño de empresa o el director de marketing que está en esa situación. Cuento cómo armé la auditoría, qué encontró, cómo decidí qué arreglar primero y qué no pudo ver la IA. Al final hay una lista de 15 problemas que casi todo sitio tiene y que puedes revisar esta semana.

¿Cómo se organizó la auditoría?

No le pedí a una IA que «revisara la web». Ese pedido devuelve consejos genéricos que sirven para cualquier sitio. Lancé tres auditores en paralelo, cada uno con un rol distinto y el mismo formato de entrega.

Auditor	Foco	Tiempo	Entregable
1	Uso, navegación, conversión y móvil	23 min	Top 15 con causa en archivo:línea y arreglo exacto
2	Diseño visual y sensación premium	32 min	El mismo formato
3	Lectura, blog, contenido y versión en inglés	44 min	El mismo formato

El formato común es lo que vuelve útil el ejercicio. Cada problema debía traer severidad, página, ancho de pantalla, la causa en el código y el arreglo exacto. Así se pueden cruzar los tres informes y ver qué repite más de uno.

Después, cuatro implementadores, también agentes de IA, aplicaron los arreglos en español y en inglés. El primer cambio tocó 91 archivos.

¿Qué encontraron?

Estos son los hallazgos que traen cifra. Algunos me dieron vergüenza, y por eso los publico.

Hallazgo	Cifra medida	Lo reportó
Botón principal verde con texto blanco	Contraste 2,28:1 (quedó en 5,02:1)	Auditor 1
Gris de los textos secundarios	4,29:1 (quedó en 7,39:1)	Auditores 1 y 3
Página de Conferencista de IA en celular	509 px de ancho en una pantalla de 390	Auditor 1
Botón de menú en celular	Cortado 21 px en todas las páginas	Los tres
Menú de escritorio	Roto entre 1.025 y 1.170 px de ancho	Auditor 1
Botones del héroe en celular	Debajo del pliegue	Auditores 1 y 2
Prompts de la guía de 50	49 de 50 cortados en escritorio, 50 de 50 en celular	Auditor 3
Primer prompt de esa guía	A 11.086 px del inicio de la página	Auditor 3
Página de servicio de consultoría en IA	18.000 px sin un botón de contacto	Auditores 1 y 3
Listas del blog	Sin viñetas en 68 de 78 artículos	Auditores 2 y 3
Compartir un artículo por WhatsApp	Contaba como contacto en GA4 y en Meta	Auditor 1
Emojis haciendo de íconos	172 reemplazados por íconos propios	Auditor 2
Enlaces dentro de artículos en inglés	Entre 46 y 51 llevaban a páginas en español	Auditor 3

Dos de estos merecen explicación.

El menú roto entre 1.025 y 1.170 px parece un caso raro, y no lo es. Un portátil de 1.440 px con el zoom del sistema al 125 % muestra la web a 1.152 px. En ese ancho, el botón de WhatsApp del menú desaparecía por la derecha. Yo nunca lo vi porque no uso zoom.

El error de medición era el más grave. Cada vez que alguien compartía un artículo por WhatsApp, mi analítica contaba un contacto, y Meta también. Meta usa ese dato para decidir a quién mostrarle la pauta. Un botón de compartir estaba enseñándole a la plataforma a buscar gente que comparte, no gente que contrata.

¿Cómo decidí qué arreglar primero?

Con 45 entradas sobre la mesa, varias repetidas entre auditores, el orden importa más que la velocidad. Usé tres reglas.

Primera, lo que repiten varios auditores va adelante. El botón de menú cortado lo reportaron los tres por separado, y el bloque de resumen sin estilos de cinco páginas, también. Cuando tres miradas independientes coinciden, ya no es una opinión.

Segunda, primero lo objetivo. Contraste, desbordes, botones que no se ven y medición mal hecha se pueden medir antes y después con un número. Lo estético viene después.

Tercera, primero las páginas que venden. Conferencias, consultoría y capacitación antes que el blog.

Las decisiones estéticas no las tomó la IA. El auditor de diseño propuso direcciones; con ellas se armaron tres conceptos, A, B y C, y yo elegí el B. La IA propone bien. Decide quien conoce la marca y al cliente.

¿Qué no pudo ver la IA?

Una IA mide un contraste con dos decimales. No sabe si una foto mía se ve como yo quiero que me vean.

El nuevo diseño pedía integrar mi foto en el héroe, y para eso se recortó el fondo. Se hizo dos veces, la segunda con detección de bordes de Apple y limpieza del contorno. La IA dio el trabajo por terminado. Yo veía la foto peor recortada que antes: el borde delataba el recorte. Volvimos a la foto original, con su fondo, enmarcada dentro de la retícula, en todo el sitio.

Con las portadas de mis libros pasó algo parecido. Las versiones en 3D traían recuadros grises y bordes irregulares. Tras cuatro intentos de limpiar esos recortes, cambiamos de enfoque: el libro se dibuja en 3D con CSS, con tapa, lomo y canto de páginas, encima de la portada plana original. Cuando cuatro intentos del mismo enfoque fallan, el problema es el enfoque.

Hay otra cosa que la IA tampoco ve sola: cómo se ve el sitio en un teléfono de verdad. El auditor 3 descubrió que Chrome sin interfaz, cuando se le pide una ventana de 390 px con --window-size, no baja de 500 px. Las capturas «móviles» hechas así salen recortadas y muestran un sitio que parece funcionar. Hay que usar emulación real de dispositivo.

Lo que aprendimos

«Listo» solo vale cuando lo verifico yo. La IA dio por terminados la foto y los libros antes de que lo estuvieran. Desde entonces, «listo» solo vale cuando lo he visto yo en el navegador, en celular y en escritorio.

La caché engaña. Después de cambiar las portadas, el navegador seguía mostrando las viejas. Un cambio entero consistió en renombrar las imágenes para obligar a descargarlas de nuevo. Si no ves un arreglo, no asumas que no está; si lo ves, no asumas que lo ve tu cliente.

Un trabajo programado puede compilar código viejo. El 4 de octubre, entre las 7:02 y las 7:35 de la mañana, carlosbetancur.co estuvo fuera de servicio. No fue el rediseño. Un trabajo programado, el que publica cada mañana los artículos agendados, compilaba desde una copia del código del 24 de septiembre. Esa copia vieja chocó con la configuración nueva del servidor y el sitio quedó redirigiéndose a sí mismo en bucle. Me avisó un monitor externo. La protección que añadí: cada publicación actualiza ahora la copia que usa ese trabajo, y la versión que arma se despliega primero sin tráfico; solo recibe visitas si varias páginas responden bien. Si falla, el sitio se queda en la versión anterior.

El auditor también se equivoca. Repetí el método en btodigital.com: 78 páginas en 6 anchos de pantalla, 468 vistas, hoy todas en cero desbordes y textos cortados. En la misma web, el contraste medido en navegador había pasado de 176 fallos a 0 en 41 páginas. Pero el auditor automático de contraste estaba ciego a los fondos con degradado y los daba por buenos. Al corregirlo aparecieron 31 fallos reales que ese cero escondía.

No todo quedó perfecto. El gris de los textos secundarios mejoró, pero al menos un gris del sitio sigue en 4,29:1, apenas por debajo del mínimo. No voy a decir que todo el sitio cumple la norma.

¿Qué resultados de negocio dio?

Todavía ninguno que pueda mostrar con honestidad. Los arreglos entraron el 3 de octubre, y la primera medición útil necesita al menos tres semanas de datos. Voy a mirar cuatro cosas:

• Contactos reales por WhatsApp desde el sitio.
• Qué parte de esos contactos llega desde el celular.
• Descargas de los libros.
• Contactos desde la página de Conferencista de IA, que en celular estaba rota.

Hay una trampa que conviene contar. La línea base está contaminada: antes del arreglo, cada artículo compartido sumaba un contacto falso. Si comparo el evento viejo con el nuevo, los contactos van a «caer». La comparación honesta es contra formularios guardados y conversaciones reales.

¿Cómo aplicarlo en tu empresa?

La receta cabe en cinco pasos:

1. Divide la revisión en roles: uso y conversión, diseño, contenido. Un solo auditor general da una lista genérica.
2. Exige un formato común: problema, página, ancho, causa y arreglo exacto.
3. Ordena por coincidencia entre auditores, luego por lo medible, luego por las páginas que venden.
4. Deja lo estético en manos de quien conoce la marca. Pide dos o tres conceptos y elige.
5. Verifica tú, en un teléfono real o con emulación de dispositivo, antes de dar algo por terminado.

Y esta es la lista de 15 problemas de experiencia de usuario que casi todo sitio tiene. Revísala con tu equipo, en celular y en escritorio:

1. El botón principal tiene un contraste menor de 4,5:1 (el verde con letra blanca casi nunca pasa).
2. Los textos grises secundarios no llegan a 4,5:1.
3. El botón de menú no cabe completo en un celular de 360 a 390 px.
4. El menú de escritorio se rompe en anchos intermedios, como un portátil con zoom al 125 %.
5. El botón principal del héroe queda debajo del pliegue en celular.
6. Alguna página es más ancha que la pantalla del celular y obliga a desplazarse de lado.
7. Hay páginas largas sin un botón de contacto en la mitad.
8. El botón flotante de WhatsApp tapa texto o campos de formulario.
9. Las listas perdieron las viñetas por un reinicio de estilos.
10. Las tablas o bloques de código se cortan sin ninguna pista de que hay más contenido.
11. El índice de contenidos ocupa más que el primer párrafo.
12. Un evento de conversión cuenta acciones que no son contactos, como compartir.
13. La versión en otro idioma enlaza a páginas del idioma original.
14. Hay emojis haciendo de íconos en botones y tarjetas.
15. Los formularios no tienen etiquetas, no validan el correo o muestran el error lejos del campo.

Mi sitio tenía los 15. Si en el tuyo se cumplen más de cinco, «se ve bien» solo en tu pantalla.

Preguntas frecuentes

¿Puede una IA auditar la experiencia de usuario de un sitio web? Sí, si se le da un rol, un método y un formato. En mi caso, tres auditores entregaron 45 problemas priorizados, con su causa en el código, y varios coincidían entre ellos. Lo que no puede hacer es decidir por ti lo estético ni confirmar que un arreglo quedó bien sin que alguien lo mire.

¿Por qué tres auditores y no uno? Porque cada rol mira cosas distintas y porque la coincidencia entre ellos es la mejor señal de prioridad. El botón de menú cortado lo reportaron los tres de forma independiente.

¿Qué contraste debe tener un botón? La norma WCAG en su nivel AA pide 4,5:1 para texto normal y 3:1 para texto grande. Mi botón verde con letra blanca estaba en 2,28:1; con un verde más oscuro pasó a 5,02:1.

¿Puedo dejar que la IA aplique los arreglos sola? Lo objetivo, sí, con verificación posterior: contraste, desbordes, medición. Lo estético, no. Y nunca des por bueno un «listo» sin verlo en celular y en escritorio.

¿Cuánto tiempo toma una auditoría así? Los auditores tardaron entre 23 y 44 minutos. Los arreglos principales entraron el mismo día. Lo que más tiempo consume es verificar, y es justo lo que no se puede saltar.

¿Esto aumenta las ventas? Todavía no lo sé y no lo voy a afirmar. Lo que sí sé es que mi medición estaba inflada y que mi página de conferencias estaba rota en celular. Voy a publicar la primera medición de resultados cuando tenga datos suficientes.

Si quieres que revisemos tu sitio con este método, así trabajo como consultor de marketing digital. Para el lado de la conversión, lo desarrollé en cómo subir la conversión sin más tráfico, y la página que más cambió con esta auditoría es la guía de Claude para marketing con 50 prompts.