Making Your Website Mobile Friendly with Responsive Design

3/17/2014 5:03:00 PM
Many tech-savvy integrators have done an excellent job of establishing dynamic and effective websites. They know that providing searchable inventory, current sales promotions, embedded video, clear contact information, directions, maps and other features helps turn their websites into impactful gateways to sales. What AV integrators don’t control, however, is how consumers view their websites.

Consider these quick facts that illustrate the changing reality of consumer connectivity today:
• Smartphones and tablets have doubled the amount of time people spend online daily between 2010-2013 (Gartner)
• Today people use smartphones more often than PCs to get online (Cisco)
• 31 percent of people who own smartphones say it’s the only way they access the Internet (Karen McGrane, BA+S)
• 40 percent of Americans log into Facebook every day; 79 percent of those do so from a smartphone

Multi-Screen Experiences
The fact is, your best customers move between four or more devices every day. “You don’t get to decide which platform or device your customers use to access your content: they do,” says Karen McGrane, author of Content Strategy for Mobile.

It's time to get real and fix your online presence to match your ideal shoppers where they are and how they access information.

Keep in mind, mobile doesn’t just mean smartphones, and it doesn’t necessarily mean on the move. It encompasses a proliferation of devices, platforms, and screen sizes–from the tiniest “dumb” phones to smartphones, iPods, and tablets, and from notebook computers to laptops that provide a near-PC experience. Any device that can easily be moved is mobile.

Try this exercise. Pull up your website on a standard PC. Then grab the window and make it progressively smaller (less wide). What happens as the window gets narrower? Your site may look great in widescreen, but on a tablet it may break. On a mobile phone, it may be impossible to navigate or read with cumbersome pinching and zooming. This is what your prospects are seeing across their range of devices, and you may have already lost them due to sheer frustration.

Check the bounce rate on your website. Google Analytics will show you in an instant if your Web presence is turning off visitors based on their connecting devices.

Your business may have a separate website sitting on an “m.” domain. On the one hand, that will provide better engagement from mobile devices. On the other hand, you have to maintain two separate websites and work to reconcile the two.

Consider Responsive Design
Businesses must retool their websites to deliver the right product information and a clean, professional shopping experience to all visitors regardless of what platforms they choose.

How can you be sure that your content will work everywhere, all the time? Start thinking about having one universal structure designed from the start to cover the full range of cases.

It’s time to embrace “adaptive content” and “responsive web design.” Responsive web design is the approach that suggests that design and development should respond to user behavior as well as screen size, platform, and orientation. This consists of using a mix of flexible grids and layouts, images, and an intelligent use of code. As the user switches from one device to another, the website should automatically switch to accommodate for resolution, image size, and scripting abilities.

Responsive design is the sweetheart of web designers right now, and with good reason. It allows businesses to be cross-platform without sacrificing content or redesigning from the ground up every time a new device comes out.

Transitioning Your Website
If responsive web design makes sense for your business, take a stair-stepped approach to this opportunity.

1. Start with a Plan
Moving to responsive design requires an investment of time to think through your web strategy. Envision what you want the user’s experience to be on each platform. New technology makes it possible to put both text and images on the same site and render them correctly across devices.

If you don’t have a good mobile presence today, I recommend starting with DudaMobile to establish a mobile website, and then work into the responsive site. Setting up a DudaMobile site with very basic functionality takes about an hour and costs $7 per month.

2. Work with a Specialist
You’ll want to work with a web design firm that can look at your current site and see what's salvageable for a new responsive site. In some cases you may need to start with a completely fresh site.

3. Think Through Functionality
Think hard about what you want mobile users to be able to do on your site. Is it all about getting a phone number and a map to contact you or get to you quickly? Ask your customers what they want/expect to be able to do on your website from a smaller device.

4. Be Patient
It will likely take about three months to create the new site and achieve responsive bliss. Costs will vary depending upon the scope of work and goals for the site.

Also, be sure to install Google’s new universal analytics code on your site. This will give you maximum flexibility to apply unique tracking codes and other elements across your site without having to change the tags applied to your Web pages.
 
 
Brendan Morrissey is CEO of Netsertive.

Comments

Photo GalleriesMore Galleries >
Doug Henderson and Joe Atkins

Doug Henderson (left) president of Bowers & Wilkins Group North America, and Joe Atkins, Bowers & Wilkins global CEO, invited consumer and t...

BMWs, McLarens, and Volvos

Upon arrival, guests experienced Bowers & Wilkins Automotive products in BMW, McLaren, and Volvo cars (the Maserati wasn’t available...

Demo'ing the McLaren

Bowers & Wilkins North America president Doug Henderson show demonstrates how to open the door on the McLaren.

B&W Speakers in the McLaren

Bowers & Wilkins speakers in the McLaren.

B&W Vintage Living Room

Bowers & Wilkins North America president Doug Henderson shows off the company’s vintage living room space, which featured vintage ge...

The B&W LP Collection

Part of the Bowers & Wilkins vintage living room space is this collection of LP covers that represent a seminal album from each of the com...

The B&W Museum

Bowers & Wilkins had to purchase much of the gear in its museum because most discontinued products were not kept over the last 50 years.

The Wisdom of John Bowers

Words to live by from Bowers & Wilkins founder John Bowers

The History of B&W

A timeline of Bowers & Wilkins’ product and company history

Andy Kerr and Martial Rousseau

Senior product manager Andy Kerr and head of research Martial Rousseau from the U.K. Bowers & Wilkins office. They were showing off the ne...

Turbine Head

  The turbine head for the 800 D3 houses the mid-range speakers.

Andy Kerr

Senior product manager Andy Kerr holds up the very heavy solid-body turbine head.

Historical Flagship Products

A look at the company’s flagship products through its 50-year history

The Legendary Diamond Tweeter Dome

To show off the company’s legendary diamond tweeter dome, one was encased in plastic to protect the brittle material. The tweeter domes ...

Demo'ing the 800 D3 Speakers

Bowers & Wilkins’ new demo room showcases its new flagship 800 D2 speakers, which are the outcomes of one of the company’s mos...

800 D3 Close Up

The silver 6-inch FST midrange drive unit of the 800 D3 uses Bower & Wilkins’ new proprietary Continuum woven material. Developed af...

In-wall Demo

Bower & Wilkins’ showcases its in-wall speakers in this space.

The B&W Nautilus

Bower & Wilkins’ legendary Nautilus is 17 years old but just as contemporary now as it was then.

Nautilus Pricing

A wall plaque in the “Nautilus demo room” itemizing the price of the system

Theater Demo

A theater demo showcasing the flexibility of 800 D2 speakers