As Hurricane Florence makes its way across the US southeast coast, many people are stuck in areas with severe flooding. These people rely on outside information, yet have limited bandwidth and power.
We have a text-only version of our website for anyone who needs to stay up-to-date on Hurricane Florence news and keep their battery and data usage to a minimum: https://t.co/n2UDDKmlja— NPR (@NPR) September 14, 2018
That’s a great thing. Here’s how it looks:
Less is More
Text-only sites like these are usually treated as a MVP of sorts. A slimmed-down version of the real site, specifically for emergencies.
I’d argue though that in some aspects, they are actually better than the original. Think about it- that simple NPR site gets a lot of points right:
- It’s pure content, without any distractions
- It’s almost completely fail-safe
- It’s responsive by default and will work on any device
- It’s accessible
- It’s search engine friendly
- It’s machine readable and translatable
- It has close to perfect performance scores:
Most importantly, it’s user friendly. People get what they came for (the news) and are able to accomplish their tasks.
The only thing missing here might be a few sensible lines of CSS to set better typography rules. Those could still be inlined in the head though, easily coming in under the 14KB limit for the first connection roundtrip.
This is the web as it was originally designed. Pure information, with zero overhead. Beautiful in a way.
The “full” NPR site in comparison takes ~114 requests and weighs close to 3MB on average. Time to first paint is around 20 seconds on slow connections. It includes ads, analytics, tracking scripts and social media widgets.
Meanwhile, the actual news content is roughly the same. The articles are identical - apart from some complementary images, they convey exactly the same information.
If the core user experience can be realized with so little, then what is all that other stuff or?
The Cost of Comfort
Of course the main NPR site offers a lot more than just news, it has all sorts of other features. It has live radio, podcasts, video and more. Articles are preloaded via AJAX. It’s a much richer experience - but all that comes at a price.
That NPR site is a very useful thing that serves a purpose, and it does so in the simplest, most efficient way possible. Personally, I’d love to see more distilled experiences like this on the web.
… “Well, this might work for a news site - but not every usecase is that simple.”, I hear you say.
True. The web is a text-based medium, and it works best with that type of content. But the basic approach is still valid in any other scenario:
Figure out what the main thing is people want from your site and deliver it - using the simplest, least powerful technology available.
(W3C, “The Rule of Least Power”)
Make it withstand hurricanes.
👉 BTW: This post is not meant to criticize the main NPR website in any way, which is actually very well made. It’s more of a general thought on how we deliver and prioritize content on the web.