Becoming ‘Responsive’

responsive-graphic-640-trans

If you’re reading this post, there’s a good chance that you’re at least as connected with technology as the average American living in 2013.  And probably more so.  Those of us now in our 30s or later can remember a time when we always read the Internet while seated in front of a traditional desktop computer.  Today we’ve got an ever-increasing array of options and devices for browsing the Internet, finding and even creating content.  On an average workday, we may transition from our smartphone to our office PC or laptop to an iPad, and back again, repeatedly.  Instead of trying to use one tool for everything, we’re constantly picking the right tool for the job.

Where Are We Now?
Webmasters are particularly attuned to the degree to which content consumption has shifted from traditional computing to various mobile devices and platforms.  In the month leading up to this post, for instance, 28.31% of visits to snnyc.com have taken place via mobile devices.  While the numbers vary from site to site, readers are often selecting their iPhone or iPad for their casual web reading.  It’s just so easy to grab an iPad off the coffee table and curl up on a couch, stuffed chair or recliner.  And consumers are voting for mobile devices with their wallets.  PC sales are down.  Tablet sales are up. Given the overall diversification of Internet client devices, what do we do about it?

Responsive Web Design
Wikipedia defines responsive web design as, “a web design approach aimed at crafting sites to provide an optimal viewing experience – easy reading and navigation with a minimum of resizing, panning, and scrolling – across a wide range of devices from desktop computer monitors to mobile phones.”  Ethan Marcotte coined the term and later wrote the book about it.  Essentially we’re talking about a web site that dynamically adjusts itself for ideal presentation on whatever device a person is using.

The Time is Now?
Back in December, Pete Cashmore, CEO of Mashable, with 20 million unique visitors monthly, wrote a piece on Why 2013 Is the Year of Responsive Web Design.  “A million screens have bloomed, and we need to build for all of them.”  And just days ago, Forbes ran the headline, Why You Need to Prioritize Responsive Design Right Now.  Apparently having a separate mobile site is now passé, to say nothing of expecting your readers to zoom in and out on your content to adjust to the physical parameters of their current device.

WordPress Responsive Themes
If you’re not aware, WordPress is a free and open source content management system that underpins snnyc.com and many millions of other blogs and web sites the world over.  A site like snnyc.com consists of a base WordPress installation, coupled with a ‘theme,’ potentially a ‘child theme’ containing further customization, and typically a variety of ‘plugins’ and ‘widgets’ that gives the site its look and feel.  When I first came to WordPress as a neophyte in early 2011, I began with the default Twenty Ten theme, coupled with child theme customizations created by a friend and web developer.  That path isn’t the same one that I’d recommend today.

If 2013 is truly the ‘Year of Responsive Web Design’ that we should all prioritize “right now,” there are much easier ways to go about it.  Especially if you’re already running WordPress.  Many WordPress theme designers have been hard at work creating a variety of responsive themes suited to industries of all types.  The typical theme has a relatively modest cost and allows a decent level of customization.  With some patience, a little research and perhaps some online help, anyone can purchase, install and customize a responsive WordPress theme to suit their particular needs.  And once you’re done selecting colors, layout choices and widgets, your site can still look unique among the millions of others out there.

Becoming Responsive
If you’re a repeat visitor here, you’ve likely already noticed that the snnyc blog looks a little different today.  But just how different depends on what you happen to be using to read it.  If you’re on an iPad right now, you’re in for a particular treat as you rotate the iPad from landscape to portrait orientation, and back again.  Try it.  Narrow screens, including an iPhone or an iPad in portrait orientation, now show all the content in a single column for easiest reading.  Wider screens, such as an iPad in landscape orientation, or a traditional desktop or laptop computer, show a two-section layout similar to what had been here before.  The site detects your device and accommodates it.

Over the course of Friday and Saturday, I looked into, purchased, installed and customized the responsive theme that will be the framework of snnyc.com for the foreseeable future.  You’re looking at the Magazine theme from StudioPress, at a cost $79.95.  Installing a StudioPress theme is easy, particularly for anyone with prior WordPress experience.  If starting a blog from scratch using Magazine, it may well be a completely menu-driven affair using only the WordPress Dashboard.  Because I needed to accommodate certain choices that I’d made long ago, I found myself having to make a few manual code changes to a cascading style sheet.  The StudioPress support team has been quick to answer most of my technical how-to questions, even on the weekend.

In order to set realistic expectations, I should mention that patience and a willingness to experiment are still required.  Over the course of two days, I found myself adding and removing several plugins to accommodate various features that I was looking for.  And I may yet replace the JavaScript-based slideshow plugin that I recently started using.  It seems slower in Magazine and currently gets improperly cropped on an iPhone.  So, as it turns out, switching to responsive design is a new beginning, and not really a destination.  No doubt I’ll continue to tweak it here and there going forward.

Bottom Line
If you have or are contemplating your own personal web presence, you may want to look into responsive web design.  This is the year, so they say.  And if you happen to use WordPress, responsive solutions are already available at a reasonable price.  If you’re responsible for the web presence of a large organization, perhaps you’ll consider responsive design in your next major overhaul.

Tweet about this on TwitterShare on Google+Share on LinkedInShare on FacebookShare on RedditEmail this to someone

Speak Your Mind

*

CAPTCHA Image
Play CAPTCHA Audio
Reload Image