We’ve adopted a responsive design template to optimize reader experience. What do you think?
You may have noticed that we have gone through a series of design updates to the site over the last few months. The speed of change impacting interface on the web means that a publisher like PSFK can’t (or shouldn’t) release a design update and just leave it to hang around. For us, by watching how our readers are consuming, sharing and using our content we now realize that we’re in a regular tweak mode – and this will probably continue until we realize that can’t tweak no-more and we have to return to the drawing board.
The optimization of PSFK.com for mobile devices is our latest major tweak. One of the biggest changes that has impacted us is the speed that people switched to tablets and phones for media consumption. Which sounds so obvious, I know. But it wasn’t obvious how things were going to pan out especially with all the debate about apps versus mobile sites. I sat on the sidelines to watch what would happen and crossed my fingers that our readers would suffer our non-mobile site and newsletter until we could see which way to go.
Evolving reader behavior forced our hand: I would sit in meetings and a common occurrence was someone pulling out their phone and as they waved it before me saying, “I read your daily newsletter.” I cringed at the thought of the experience they must have been getting when they were clicking through. It was time for our latest tweak.
Mobile is becoming the first choice for media consumption (and its subsequent sharing). Our stats showed that mobile readership had grown to 25% and it doesn’t take a genius to realize that it would probably be greater if the site worked well on phones.
Our tardiness had an upside though: it allowed us to leapfrog recent technologies and adopt a style that is called responsive design. Instead of building an app or a separate website for a mobile browser, this recent web principle shows the same site every time but adapts its layout depending on the size and layout of the device you’re reading PSFK.com. It’s therefore optimized (much better) for mobile phones, tablets, laptops and everything in between. One other big advantage – for us – is that we updated the template in just a few days (and most of that was spent reading up on how to implement it).
On a phone in portrait mode, PSFK.com looks like this:
One a table in portrait mode, PSFK.com should look like this:
And on a laptop, PSFK.com should look like this:
If you are on a computer, drag your mouse to shrink the size of the browser window now and you’ll notice the changing effect.
We also decided to help mobile readers return to the original site with a simple twist of the arm. In Landscape mode, most mobile devices will show the full site.
As you know, there are a lot of mobile devices out there – what I’d love some help with is a reader testing of the site on your mobile devices. Can you let me know what you think and where the problems are? Send screengrabs and comments to my personal address email@example.com with the words ‘mobile site’ in the subject line to help me filter – or message us at @PSFK or @piers_fawkes