In America today (as of January 2013), smartphones account for half of all mobile phones and are poised to take over feature phones this year. And don’t forget, many feature phones also have simple web browsers. Not to mention tablets such as ipads, kindles, or one of the other many small devices floating around offices and homes these days. In fact, as of 2011, the number of U.S. wireless devices outnumbers the U.S. population!
So just to be clear, almost all sites can be “viewed” on a mobile/tablet device, it is just how user-friendly of an experience it is or not. By default, static websites will shrink to fit the smaller devices causing the user to zoom in and out (pinch-to-zoom) or scroll left and right — making it more difficult to find what they are looking for. These static sites can inhibit the experience even further by using rollover pulldown navigation which may not work on the smaller devices that only respond to finger-touch (not mouse hovers/rollovers). This means your subpages may not be accessible.
So what are you mobile-friendly options you say? Well, a website that would convert to all different screen sizes and orientations (horizontal and vertical views) of any device and allow for normal vertical scrolling that is native to normal desktop users – the way it was meant to be. See example (right) of what should happen when a website converts content from a 3-column layout to 1-column layout allowing for larger more readable text and imagery.
Mobile Friendly Option 1: Responsive Design
The best option we find at this point in time is using CSS coding techniques to convert a normal static site to a responsive design which will allow a website to automatically “respond” to the new screen sizes and orientations without the need for a completely different site, plugin, or app. Some graphics or extra features can even be removed to streamline the user’s experience and eliminate the need for lots of scrolling.
Check out this interactive demo at Template Monster to get the full user-experience of responsive design (click on the different screen sizes in upper right hand corner to see different layouts of one design/website). The demo also shows you a mobile-friendly navigation bar that is easier to finger-tap and select pulldowns than the problematic static site navigation mentioned in previous section. Also, below is a conversion of a website that we, at Evolv, worked on so you can see the before and after of a static site converted to a responsive site. However, this design does not use the more advanced navigation bar because it does not need pulldowns but instead just simple text links aligned vertically rather than horizontally. Visit the Japanese Literature in English responsive website.
With this in mind, the easiest and cheapest option, if you don’t have to keep with your current design/brand, would be to install a completely new WordPress theme or HTML site template that is responsive rather than pay to convert an existing static site. Also, keep in mind that the default 2011, 2012, and later WordPress themes are already responsive and many more responsive themes are popping up everyday. Just check out our article on for WordPress Themes for Artists & Business and go to the Responsive section at bottom.
Mobile Friendly Option 2: WordPress Plugins
For WordPress users, there are more options of installing plugins. First, there is a WordPress Responsive Plugin that has been “coming soon” for months now that you could signup for notification when it comes out. It claims to convert your WordPress theme to a responsive one without redoing your site’s code but I guess we’ll see how good it accomplishes this very hard task when it comes out.
Other WordPress plugins will create a completely separate mobile site for you — like WPtouch (for mobile phones) and Onswipe (for tablets) — but they will not allow you to customize the site as easily to look like your normal desktop branded site. In other words, it is a completely different site and experience for the user. See preview (left):
So what do I do?
If you are getting a new website built, we highly recommend you get a responsive website to start out on the right foot. If you have an existing website, we can convert your “static” website to a “responsive” one. Just request a quote from us.
We believe a responsive website will prove to be your greatest asset in the coming years. Your readers and customers will appreciate the extra thought and care that goes into making their mobile experience easier to find what they are looking for, because websites really are ALL about usability and effectiveness. Eventually, there will be no more talk of mobile-friendly websites: there will just be websites, and it will be expected to adapt to all screen sizes. Don’t get left behind!
Read more about Responsive, Mobile Friendly Email / eNewsletters »