Responsive Web Design 101 for Small Business


In April of 2015, Google began implementation of its “mobile-friendly” search algorithm update, and soon thereafter revealed its mobile phone search volume now exceeds desktop/tablet search volume in the U.S., Japan, and eight other countries. These incredibly important data points demonstrate how mobile Internet usage is changing the rules of the game for company websites.

Responsive Web design is a set of techniques used to make a website adjust for optimum display on any size screen. For small businesses, responsive design is a must. Without it, small businesses will lose ground in SEO and paid search campaigns, and perhaps even worse, alienate the growing rlanks of mobile users who visit – and quickly exit – the company website.

[RELATED: 4 Brands Winning With Mobile Marketing Strategies]

Here is how a small business can shift to a responsive design efficiently and without enormous expense:

1) Simplify navigation.The key to shifting from a desktop-only website to a responsive website is simplification. If your current top line navigation has 10 or 12 links (this is typical; the number of links tends to grow over the years), get it down to four or five. Simple and straightforward links appeal to mobile users; something like: Products, About, Testimonials, Contact. In a responsive design, this top line navigation will be sticky; i.e., it will be fixed at the top of the page, always in view no matter how much vertical scrolling the user does.

2) Simplify content. Most company websites say too much. Eliminate unnecessary content. Remember, if you have a lead-generation website, your content isn’t supposed to sell the product, only get users interested enough to call or submit a form. Use frequent, descriptive subheads to facilitate scanning, and keep paragraphs exceedingly short.

3) Simplify design.Complex design impedes responsive design effectiveness in two crucial ways; first, it confuses and distracts users, and second, it causes slow page-loading time, a big negative for Google organic rankings and users. Stick with simple designs and imagery and leave ample white space for a pleasurable mobile experience. Get rid of PDFs (convert them to HTML pages), JavaScript, and rotating banners as much as possible.

4) Prioritize page content. In responsive design, page content is organized into discrete chunks and then “stacked” for mobile scrolling. You must decide the order in which content elements – introductory text, images, calls to action, informational text, credibility elements, etc. – appear. This can be laborious, but it’s a terrific exercise, since it forces you to really think about how to present your company, products, and services for maximum user impact.

5) Test and get user feedback. A convenient aspect of responsive design is that your new website can be built “live” online, so your staff and customers can try it out before it goes live. This is an opportunity you should embrace. Users testing your site on their mobile phones can tell you very quickly whether your site is easy to use, confusing, or somewhere in between. Since responsive design is new, content and design assumptions may not be correct; testing allows you to launch a credible responsive website rather than one that is seriously flawed, despite your good intentions.

A solid responsive website will help keep your organic search engine visibility strong, and possibly give you an advantage over competitors that have yet to adapt, in terms of SEO and lead/sales conversion.

A final tip: When you look for an agency or freelancer to do the build, be sure to select one with experience and a demonstrable track record of success with responsive design. The techniques and processes used for responsive design have several fundamental differences from desktop-only design. Responsive design is an emerging field, but fortunately one with plenty of skilled participants.

This article was written by Brad Shorr and originally appeared on SmallBusinessPR.com in July 2015.

Brad Shorr is the Director of Content Strategy for Straight North, an Internet marketing firm that also creates custom responsive designed websites. You can learn more about responsive design by reading Straight North’s blog.


×