Diego Molinari

← Todos los casos

El espacio que falta no se ve

El problema

Un sitio de noticias declara espacios de publicidad en cada tipo de página: portada, nota, sección. Con el tiempo esa declaración y lo que la página realmente muestra dejan de coincidir. Un cambio de plantilla, un componente que se movió, una condición que dejó de cumplirse.

Y acá está lo que hace difícil el problema: un espacio publicitario que no se llena colapsa a cero de alto. No queda un hueco, no queda un borde, no queda nada. La página se ve perfecta. Simplemente hay un lugar que dejó de existir y nadie se entera, porque la falta de un aviso no rompe nada — sólo deja de rendir.

Revisarlo a ojo no funciona: hay que mirar cada tipo de página, en escritorio y en mobile, sabiendo de memoria qué tendría que estar.

Qué construí

Un auditor que carga la URL en un navegador de verdad —no en un analizador de HTML—, espera a que la página termine de armarse, y desde adentro pregunta qué espacios declaró. Después reconstruye el wireframe: dónde quedó cada bloque y qué medidas ocupa.

Eso se compara contra el spec: la lista de qué espacios tendría que tener cada tipo de página. De ahí sale un diagnóstico por espacio y por dispositivo.

Por qué un navegador de verdad y no un lector de HTML

Leer el HTML

Lo que el servidor mandó

  • Rápido y barato de correr.
  • Ve la marca, no el resultado.
  • Los espacios los arma un script después de cargar: en el HTML no están.

Abrir la página

Lo que el lector ve

  • Se espera a que la página termine de armarse.
  • Se le pregunta a la página misma qué declaró.
  • Se miden las posiciones reales, en escritorio y en mobile.
La publicidad se declara y se resuelve en el navegador. Cualquier herramienta que sólo lea el HTML del servidor va a decir que está todo bien.

Las decisiones que costaron

Reservar el espacio colapsado. Fue el punto de partida del proyecto. Si el visor dibuja la página tal cual está, el espacio que no se llenó no aparece —porque mide cero— y el problema queda invisible justo en la herramienta que existe para verlo. El visor reserva ese espacio igual: el hueco se ve.

Cuatro diagnósticos, no dos. «Está» o «no está» no alcanza. Un espacio puede estar siempre, aparecer sólo a veces, faltar cuando es crítico, o aparecer sin estar declarado. Son cuatro situaciones distintas y sólo una es un problema urgente. Meterlas todas en un booleano obliga a la persona a volver a investigar cada caso.

Los interstitials nunca se fuerzan en el flujo. Para medir bien, el auditor fuerza alturas de los espacios que colapsaron. Pero un interstitial es una cortina que tapa la pantalla: forzarlo en el flujo deforma toda la página y arruina la medición. Se detectan por nombre y, además, por estructura — una medida declarada grande que no está en el flujo normal. Dos criterios, porque el nombre solo se puede equivocar.

Está escrito para red interna, y lo digo en el README. El modelo de seguridad asume una red de confianza detrás de un proxy interno. No está endurecido para exponerlo a internet. Preferí dejarlo escrito antes que dejar que alguien lo supusiera.

Vista ilustrativa · datos de ejemplo

auditor · nota — escritorio
arriba · 970×90
entre párrafos · 300×250
medio de nota · 300×250 — colapsado
lateral
300×600
no declarado
300×250

Diagnóstico

  • arribaPresente
  • entre párrafosAparece a veces
  • medio de notaFalta — crítico
  • lateralPresente
  • sin declararSobra — revisar

Variante detectada

apilado · 2 instancias

Reconstrucción ilustrativa, no una captura. El sitio y las medidas son inventados. Lo importante es el recuadro punteado del medio: ese espacio mide cero en la página real y por eso es invisible ahí. El auditor le reserva el alto para que el hueco se vea. Los mismos cinco espacios se auditan por separado en escritorio y en mobile, porque no siempre coinciden.

Resultado

Un tipo de página se audita en una corrida y devuelve, por dispositivo, qué espacios están, cuáles aparecen a veces, cuáles faltan y cuáles sobran. El que faltaba —el que medía cero y no se veía— ahora se ve.