Let’s get the introductions out of the way.
While I don’t consider myself a “snob” about many things – or at least not like that one coworker we all have who will only drink $15 cold-pressed kale juice from that organic food truck down the street – I do enjoy a good NPR show. Or, more accurately, I enjoy almost every NPR show and the station just happens to be the only one I’ve ever bothered to program into my vehicle’s radio preset buttons.
As such, I’ve used, and been frustrated with, NPR's multiple apps, websites and platforms over the past few years. Which is why I was intrigued to see an article about the organization adopting responsive website design in a recent Responsive Design Weekly newsletter.
And just in case it needs introduction, too, responsive website design is a fairly recent digital design approach that creates a user friendly experience on one website across a variety of devices. Doing such eliminates the need for multiple versions of a website as it can respond - hence the name - to any resolution and screen size.
The Responsive Web Design podcast interviews NPR’s Patrick Cooper, Director of Web and Engagement, and Scott Stroud, Senior User Experience Architect, about why the organization made the leap to a responsive website. After a quick listen to the podcast and a more thorough read through the transcript, I pulled out several reasons why NPR decided to make the commitment to responsive website design – and why you should, too.
As a nonprofit, NPR has limited resources available. Replacing their phone, tablet and desktop websites with one responsive website embraces the “Create Once, Publish Everywhere” maxim, which is much more manageable when a single writer might need to post multiple stories every single day.
Any time is too much time to spend patching new features into an old legacy codebase, and NPR was spending a lot of it on the multiple websites they were running. Once the organization decided to conduct a fully responsive website redesign, they were able to slowly scrap all of that messy code in favor of bringing together their designers, developers, product managers and even stakeholders to collaboratively update portions of the website over time. And at Integrity, we are major proponents of this approach to website design.
After each small update to their website design, the NPR staff was able to view the analytics to see how users were reacting. And if it didn’t meet their goals, the agile iteration process allowed them to pivot easily.
After digging deeper into their analytic data, NPR discovered that their users didn’t even need multiple versions of the site – they were looking at the same content regardless of the device they had in front of them. With responsive website design, NPR is now able to share the same content users want while simply adjusting the context to allow them to access it on whichever device they happen to be on.
I like to use the phrase “content is king” whenever possible. Partly because it makes what I do sound way cooler and partly because it’s true. While NPR is a recognized provider of quality content, their website wasn't optimized to use this fact to their advantage. The organization's responsive redesign forced them to pinpoint exactly what content was bringing users into their website and then adjust their information architecture put these items in the forefront. While doing so, they were also able to inventory all the shortcuts and makeshift templates that the staff had been creating as they posted content over the years and condense them into a simpler workflow that improved internal productivity and functionality.
But enough of my thoughts, read and/or listen to the full story from Responsive Web Design and let us know what you think. Was it worth it for NPR to make the switch to responsive website design and are you happy with their new website? Are you a web techie yourself who loves (or hates) responsive website design?
Full disclosure: I interned for an NPR affiliate for a short time in 2012. I also may or may not listen to This American Life in the shower.
Atomic design is a helpful design and development methodology which promotes consistency and cohesion across your entire experience and helps save time and money.
This blog post and related image were created by artificial intelligence (AI)! Can you tell?