En medio de la tormenta Helene, solo quería un sitio web de texto simple

• En medio de los apagones y la inestabilidad en las comunicaciones causados por el huracán Helene, quedó en evidencia la necesidad de una accesibilidad web ligera
• Los sitios web complejos centrados en imágenes y scripts casi no funcionan en entornos móviles
• Las páginas simples basadas en texto son las más eficientes para transmitir información y garantizar accesibilidad
• La degradación del rendimiento web puede convertirse en una brecha informativa en situaciones de desastre
• Se enfatiza la importancia de un diseño web liviano y accesible incluso en crisis

---

La tormenta Helene y la accesibilidad web móvil

• Durante la tormenta Helene, con la electricidad y la red inestables, surgió el problema de que cargar sitios web era casi imposible
  • Los sitios con muchos elementos complejos, como imágenes, anuncios y JavaScript, fallaban al cargar
  • En comparación, las páginas que solo ofrecían texto HTML simple sí eran relativamente accesibles
• Esta experiencia volvió a confirmar que el propósito básico de la web es transmitir información
  • La accesibilidad al contenido debe tener prioridad sobre el diseño visual

El valor de una web simple

• Los sitios web centrados en texto funcionan rápido incluso en redes lentas
  • Si se eliminan recursos innecesarios, se puede reducir de forma importante el uso de datos y el tiempo de carga
• No solo es útil en situaciones de crisis, sino también para mejorar la experiencia móvil de los usuarios
  • Una estructura simple también contribuye al mantenimiento y a una mejor accesibilidad

Rendimiento web y responsabilidad social

• Una estructura web compleja puede profundizar la desigualdad informativa
  • En regiones con infraestructura de red débil, el acceso a la información se ve limitado
• Los desarrolladores deben considerar una web que funcione incluso con recursos mínimos
  • Es una tarea esencial desde la perspectiva de respuesta ante crisis, accesibilidad y sostenibilidad

Conclusión

• La experiencia de la tormenta Helene muestra la necesidad de un diseño web liviano
• Una web de texto simple es una solución que asegura al mismo tiempo capacidad de respuesta en crisis y accesibilidad universal

[GN⁺]

Opiniones de Hacker News

• Varios sitios de noticias ofrecen una versión solo texto
  Por ejemplo, lite.cnn.com, text.npr.org, wttr.in, entre otros
  Se pueden ver más en la lista de Greycoder
  Estaría bien que existiera una forma estandarizada para encontrar fácilmente estos sitios y que los medios locales también pudieran ofrecerlos

  • La versión ligera de CNN está bien, pero todavía tiene un enorme banner de cookies
    En realidad, la única cookie que parece configurarse es si hiciste clic o no en el banner, así que da la impresión de que la mayor parte del peso de la página viene de eso
  • Al abrir un artículo de CNN Lite, el cuerpo real del artículo pesaba 11 KB, pero había 560 KB solo de reglas CSS
  • Si se quiere estandarizar este tipo de sitios solo texto, una buena opción sería que el modo lector (reader mode) del navegador pidiera al sitio únicamente el formato mínimo necesario
  • En los Países Bajos, la televisión pública todavía ofrece noticias a través de Teletekst
    Artículo relacionado: Hoe werkt het vernieuwde Teletekst
  • Usando el subdominio ‘lite’ también se pueden leer artículos solo para suscriptores
    Me acordé otra vez de este sitio cuando CNN hizo unas pruebas A/B agresivas hace unos meses

• La imagen de cabecera del artículo era un PNG de 2400x1600 y pesaba 500 KB; al parecer, por un dithering muy fino no se podía comprimir bien
  Al convertir esa misma imagen a .avif (calidad 90, 12 bits), bajó a 15 KB

  • Pero esa imagen era una hero image sin relación con el contenido
    Ese tipo de imágenes solo retrasa la carga de la página, obliga a hacer scroll y se olvida enseguida
  • En la práctica, el sitio envió 1.18 MB (comprimidos) para entregar 6.7 KB de texto. Es irónico
  • Tal vez en SVG podría quedar aún más pequeño, pero habría que simplificar los efectos de degradado

• Durante el huracán Helene, el equipo de Newspack al que pertenezco colaboró con Blue Ridge Public Radio y otros
  para crear un sitio de noticias en versión texto para personas con bajo ancho de banda
  A través de text.bpr.org logramos llevar información a decenas de miles de personas,
  y gracias a ese resultado ahora estamos desarrollando, con apoyo de OpenNews,
  un proyecto para distribuir a medios de todo el país una solución web de texto plano para noticias de emergencia

  • Yo también consulto las noticias con frecuencia, pero no sabía que CNN tenía una versión ligera

• HTML puro e interacción basada en formularios ya pueden ser suficientemente eficaces
  Los viejos foros web casi siempre funcionaban por completo sin JS
  GitHub también permitía antes ver issues y escribir comentarios sin JS,
  pero ahora casi no muestra nada. Supongo que en parte es para empujar scripts de rastreo

• Comparto algunas lecciones de mi experiencia durante el huracán Helene

  • AT&T se cayó por completo, pero Verizon y los MVNO sí funcionaron
  • La eSIM secundaria incluida en mi plan de internet de casa fue de gran ayuda
  • Pero en cuanto llegó el camión de respuesta a desastres de Verizon, mi internet del MVNO dejó de funcionar
  • Lección: antes de una tormenta es clave llenar el tanque y cargar las baterías
    Por los apagones era difícil encontrar gasolineras abiertas y tuvimos que compartir combustible con los vecinos
  • Hace unos años, durante la tormenta Pineapple Express, viví algo parecido
    No conviene depender solo de la energía solar; hay que preparar fuentes de respaldo (vehículo, generador de propano, etc.)
    Además, los sitios web de servicios de emergencia deberían funcionar con formularios simples e imágenes al estilo Web 1.0
    Un sitio que tarda 5 minutos en cargar JS no sirve para nada en una emergencia
  • La situación variaba según la zona. En mi área se cayeron todas las redes de comunicación,
    y las actualizaciones por radio de NPR eran la única fuente de información
    Al final, colaboramos con los vecinos para despejar caminos y, después de conseguir combustible, pudimos salir
  • Durante un apagón es indispensable llevar efectivo
    Si la red de pagos con tarjeta se cae, las terminales POS dejan de funcionar
  • Vivo en una zona muy boscosa y tengo problemas frecuentes con el ISP,
    pero la app de Xfinity es demasiado pesada y falla cada vez que la conexión está inestable
    Justo en esos casos es cuando más se necesita un portal de soporte liviano, pero la realidad es lo contrario
  • Uso dual SIM (AT&T + T-Mobile),
    y si existiera un teléfono con triple SIM, también le pondría Verizon
    Se pueden registrar varias eSIM, pero solo una puede estar activa al mismo tiempo

• En una experiencia parecida, una vez quedé aislado durante varios días por un deslizamiento de tierra en Nepal
  No había información de ningún tipo y las noticias solo circulaban por teléfono
  En cuanto se abrió la carretera, entraron muchos vehículos de golpe y se generó congestión y peligro
  Durante la pandemia mantuve una página de texto que resumía de forma simple las restricciones locales,
  y resultó mucho más útil que las ruedas de prensa complejas
  Durante la invasión de Ucrania, los refugiados construyeron en solo 24 horas una red espontánea de información usando Telegram, Notion y Google Docs
  Al final, simplificar la transmisión de información es clave para responder a una crisis

  • Un colega ucraniano me contó que, mientras huía, confirmaba su ruta preguntando en tiempo real a sus amigos cosas como: “¿El puente X sigue transitable?”
    Por suerte, casi siempre recibía respuestas correctas y pudo llegar a una zona segura
  • Pero me pregunto por qué en Ucrania confían tanto en Telegram
    Parece que incluso comparten ahí información sensible

• Quienes llevan mucho tiempo en la industria web probablemente recuerden la caída masiva de sitios web durante el 11-S
  Casi todos los medios estaban caídos y solo Slashdot seguía medio funcionando para difundir información
  Hoy la infraestructura es muy distinta, pero aun así queda la duda: “¿y si volviera a pasar algo así?”

  • En ese momento Yahoo News no respondía, así que lancé un traceroute,
    y el último salto apuntaba a un servidor dentro de la torre en Nueva York
    Después tardaron bastante en redirigirlo hacia el oeste

• En un artículo que leí hace poco se decía que ahora ya es difícil ejecutar un navegador con 1 GB de RAM
  JS se volvió más rápido, pero a la vez el tamaño del código de los sitios web creció innecesariamente
  Las redes rápidas terminaron fomentando esa ineficiencia
  Ver este artículo relacionado

• Quizá lo mejor sea empezar con HTML puro casi al nivel de 1994
  Con <html> y <body> ya basta, y si hace falta se puede agregar un poco de CSS
  Si se usa un CSS externo como Pico.css, es preferible alojarlo uno mismo en vez de depender de un CDN

  • Este tipo de HTML debería ser la primera página de todo desarrollador web
    Herramientas complejas como npx create-react-app pueden dejarse para después
  • Como referencia, se puede ver la plantilla base de HTML5 Boilerplate
  • Yo también opero un sitio centrado en texto y siempre reviso que funcione incluso sin CSS
    Mantengo el CSS en unos 20 KB con gzip
  • Sigue siendo buena idea incluir <meta charset="utf-8">

• El estándar web GDS del gobierno británico está hecho con HTML simple
  e incluso hay una anécdota de que funcionaba hasta en una PSP
  Ver la entrada del blog de Terence Eden