Making a website mobile friendly requires website owners to consider their budgets, understand their mobile users’ intent and to understand some basic methods to satisfy the requirements. There isn’t a one size fits all approach, but I personally like to see more people adopt a wordpress (or other mature content management system) puchase a low cost theme ($50) that has a responsive design built in. Doing so allows them to manage their own content that is published in a format that displays beautifully across many devices – without having to ask an IT person to do anything!
Responsive Web Design
Responsive web design is HTML code that allows the layout of your website to adjust the layout according to the screen size of the device requesting your page. This is accomplished using what’s called media queries (e.g. what is the width of the screen for your device?) in your CSS (Cascading Style Sheets). These media queries allow you to change the style sheets that are applied to the website, reformatting the blocks of the website. Often times, this means taking a left and right column and rearranging the website layout to show them over and below. Another common practice is to present the navigation menu as a button and dropdown in the smaller screens. The results are many page layouts for the same website. The practice is recommended by Google for presenting content on mobile devices. Compared to having separate websites for Desktop and Mobile devices it is also easier to maintain.
Separate Mobile Site
A mobile friendly website offers users a second version of content that is meant for users on smartphones and / or tablets. This requires the business creates a second version of the website that may work completely independently from your primary site. If you’ve ever noticed an “m” in URL like www.thewebsite.com/m/page.html or m.thewebsite.com/page.html then chances are you’ve been redirected to their mobile site.
Mobile App
A device specific application that is downloaded by the user. Although it can be a great tool for your web presence, this approach is not recommended as a stand-alone strategy. New visitors to your site will normally have their first interaction with your website, then secondly would have to go offsite to download your application from the store. Then they must choose to install, and then finally after its installed they can then open. Each of these steps creates barriers and you’re going to have most people drop off your site at the beginning.
Scenario: You do not have the design resources and already have a website
Your first decision is to determine if your site visitors should see the same content and follow the same navigation as the main website. A mobile user will normally be researching who you are, what you do and how to contact you. They’re not going to be impressed with flashy web designs or presentations. You have an opportunity to optimize for these visitors if your regular site design is too flashy.
If your site straight forward content, navigation and layout that can be shared across your sites you should go for the responsive web design. If you want to offer different navigation to your mobile visitors create a separate mobile site with different pages.
If you’re willing to start from scratch or build a new overall site, you should go with a content management system that automatically creates a mobile version of your site. The WordPress platform has thousands of themes available that offer responsive designs often for less than $50 for a professional design. These work great “out of the box” and if you’re looking for a more individualized appearance tweaking the site design (e.g. photos, fonts, colors) should only take a couple hours.