Inicio / Blog / Front-end

31 de agosto de 2026 · 6 min de lectura

La web funcionaba. En su iPhone, media página no existía.

Once páginas hechas a mano para una médium. En mi pantalla iba perfecta; en la suya faltaba medio sitio. La causa era un número decimal que en su móvil no podía alcanzarse nunca.

Canalizando Almas es la web de Romina, que hace mediumnidad evidencial y lecturas de Registros Akáshicos. Once páginas en HTML, CSS y JavaScript a mano, sin framework, y un panel para que publique en el blog sin depender de mí. Este artículo no va de eso. Va de la semana que pasé persiguiendo fallos que en mi ordenador no existían.

«No veo nada»

El mensaje era ese. Yo abría la página de sesiones en mi pantalla y funcionaba. La abría estrechando la ventana del navegador y funcionaba. La abría en el simulador de móvil de las herramientas de desarrollo y funcionaba.

En su iPhone, media página se quedaba en blanco.

El número que no llegaba nunca

Las secciones de la web aparecen con una animación suave cuando entran en pantalla. Eso lo gestiona un IntersectionObserver con un umbral: revela el bloque cuando se ve al menos el 12 % de su superficie. Un valor que parece de lo más razonable.

El problema es que ese artículo había crecido. Al volcar los textos definitivos y los audios, pasó a medir 6545 píxeles de alto. Y ahí las cuentas dejan de salir: en una pantalla de 360×640, la porción máxima de ese bloque que puede verse a la vez es 0,090. Nunca 0,12. El umbral no se alcanzaba jamás, hiciera lo que hiciera el usuario.

En un móvil un poco más grande el máximo subía a 0,129 y sí se revelaba. Por eso costaba tanto creerlo: el fallo dependía del tamaño del teléfono.

El arreglo fue bajar el umbral a cero —con un comentario en el código advirtiendo de que no se vuelva a subir— y añadir una red de seguridad que revela lo que ya haya llegado a pantalla. La lección es más general: un porcentaje de visibilidad es una trampa en cuanto un bloque puede crecer. El contenido cambia; el umbral se queda.

Los seis que venían detrás

Una vez puesto a mirar en un móvil de verdad, aparecieron seis más. Todos comparten la misma naturaleza: no son errores de programación, son cosas que el escritorio perdona.

El :hover no se suelta en táctil. Al tocar un botón se queda resaltado hasta que tocas otra cosa. Diez reglas movidas dentro de @media (hover: hover).

Dos botones montados uno encima de otro. El indicador de «bajar» flotaba sobre el botón principal. No lo estimé a ojo: lo medí. 36 píxeles de solape en todos los iPhone. Escondido por debajo de cierto tamaño.

La cabecera fija desaparecía al bajar. Esta es de las que hay que saberse: overflow-x: hidden en el body rompe position: fixed en Safari de iOS. Se cambió por overflow-x: clip en el html, que recorta sin crear un contenedor de desplazamiento.

Un parallax que se pedía a sí mismo. Medía la posición del elemento después de aplicarle su propia transformación del fotograma anterior, con lo que se realimentaba y forzaba un recálculo de maquetación en cada fotograma. Ahora mide una sola vez.

El fondo estrellado parpadeaba. Se regeneraba con cada evento resize… y en el móvil la barra de direcciones dispara resize cada vez que aparece y desaparece al hacer scroll. Ahora solo reacciona a cambios de ancho.

Y demasiado peso gráfico. Auroras quietas, menos desenfoque y backdrop-filter fuera en táctil.

La trampa: arreglé un fallo que no existía

Para comprobar todo esto usé un navegador sin cabeza, que es como se automatizan las capturas. Y perdí un buen rato por una razon tonta: ni las transiciones CSS ni el IntersectionObserver avanzan con el tiempo virtual de ese modo.

El menú móvil salía vacío en todas mis capturas. Un test de revelados decía que nada se revelaba. Ambas cosas eran mentira: el menú funcionaba perfectamente en un navegador real. Estuve arreglando algo que no estaba roto.

Para medir en un navegador sin cabeza hay que forzar el estado a mano. Esperar a que la animación ocurra sola es esperar sentado.

Qué me llevo

Que «funciona en mi máquina» incluye el simulador de móvil del navegador. Estrechar la ventana no reproduce el táctil, ni la barra de direcciones que aparece y desaparece, ni cómo Safari trata las capas fijas. Cinco de los siete fallos eran invisibles desde Windows.

Y que cuando un cliente dice «no veo nada» y tú lo ves todo, el que tiene razón es él. La pregunta útil no es si el fallo existe: es qué tiene su pantalla que no tenga la tuya.

Siguiente paso

¿Lo comentamos?

Si trabajas en algo parecido o no estás de acuerdo, me interesa mucho escucharlo.