Week 4: NPR Desktop v Mobile
As far as discrepancies between mobile and desktop sites, NPR has few. Both the desktop and mobile site and well-designed and intuitive. They use the same systems and very similar formats, just tweaked slightly for each screen. I reviewed the desktop site and the mobile site side by side. The mobile version is (obviously) narrower than the desktop version, but because the desktop only makes use of about a third of the screen, it translates easily to the mobile version. A few things have been moved around to use the space more effectively on the mobile version. First, rather than a navigation bar like on the desktop, the mobile site has a hamburger menu that nests everything on the navigation bar as well as the shop, sign-in, and donation buttons. Also, while on the desktop site the “CapRadio” streaming button is on the side of the main content, on the mobile version it’s pinned to the bottom of the screen. The mobile version has just a single column where all of the content is stacked into an infinite list. The desktop site is also an infinite list. Items are organized chronologically on both versions.
Rather than a generic “load more” button, at the end of quite a bit of scrolling, both the desktop and mobile site ask the reader to narrow down their content by selecting one of three categories. This is an effective strategy to preventing lag from loading too much at once.
Selecting one of these three categories will take the user to their respective choice. On the new page, the user will see more content relevant to their category, still formatted consistently and organized chronologically. This applies to both desktop and mobile.
Because these pages are categories of themselves, the bottom of the scroll is a simple “load more” option.
The last thing I want to touch on is the consistency in flow between desktop and mobile. For both versions, any item on the navigation bar will take the user to a new page within the same tab. The donate and shop links open new tabs so the user doesn’t lose their place in the feed.
The bottom line:
I find this to be an excellent example of desktop and mobile site harmony. The designer has done their best to maintain consistency between both versions, and any minor changes to the mobile version only make the experience more intuitive. There are a lot of websites I won’t surf on my phone, but with NPR I don’t sacrifice any usability by going mobile.
