What are the top three things I should know when building a site for mobile devices?
1. Make it easy for customers.
Help your site's visitors to complete their objectives. They may want to be entertained by your blog posts, get your restaurant's address, or check reviews on your products. Walgreens GVP and Chief Technology Officer of eCommerce, Abhi Dhar, explains, "Our goal with everything we do on mobile is to make our customers' lives easier."
Design your site to help make it easier for your customer to visit your site and complete a task.
2. Measure the effectiveness of your website by how easily mobile customers can complete common tasks.
Making a mobile site requires prioritization. Start by working out what the most important and common tasks are for your customers on mobile. Being able to support these tasks is critical and this is why the measure of your mobile site is how well customers can complete their objectives. There are ways to make the design of your site support ease of use too. Focus on consistency in your interface and providing an unified experience across platforms.
"Mobile shoppers put ease of use foremost when it comes to mobile shopping sites, with 48% of respondents citing it as the most important quality of a mobile site they visit," says MediaPost.
3. Select a mobile template, theme, or design that's consistent for all devices (for example, use responsive web design).
Responsive web design means that the page uses the same URL and
the same code whether the user is on a desktop computer, tablet, or mobile
phone – only the display adjusts or responds according to the screen size.
Google recommends using responsive web design over other design patterns. One of the
benefits of responsive web design is that you only need to maintain one version of your site
instead of two. You don't have to maintain the desktop site at
www.example.com and the mobile version at
m.example.com – you'll maintain only
one site, such as
www.example.com, for desktop and mobile visitors.
"Using responsive web design enabled Baines & Ernst to optimise its site experience across different screen sizes without creating multiple websites. They noticed that visitors visited 11% more pages on their site per visit and mobile conversions grew by 51%."
Conversions happen when a customer performs a desired action, such as buying products, calling the business, or signing-up for a newsletter.
For details on how to implement responsive web design, refer to Web Fundamentals. If you'd like to weigh the pros and cons of different implementations for mobile, tablet, and desktop websites, read Building Websites for the Multi-Screen Consumer.
What are the top three mistakes beginners want to avoid?
Mistake 1 - Forgetting their mobile customer.
Remember that good mobile sites are useful – they help visitors complete their tasks, whether that's reading an interesting article or checking your store's location. Don't get caught in the trap of only creating a mobile-formatted site that doesn't provide the full functionality. Instead, remember to build a mobile-friendly site (one that's truly useful for mobile customers and optimized for customers most common tasks).
Mistake 2 - Implementing the mobile site on a different domain, subdomain, or subdirectory from the desktop site.
While Google supports multiple mobile site configurations, creating separate mobile URLs greatly increases the amount of work required to maintain and update your site, and introduces possible sources of technical problems. You can often simplify things significantly by using responsive web design and serving desktop and mobile on the same URL. Responsive web design is Google's recommended configuration.
Mistake 3 - Working in isolation rather than looking around for inspiration.
Check out other sites in your space or your competitors for inspiration and best practices. While you may not be the first in your industry with a mobile site, you have the benefit of being able to learn from those before you. The Mobile Playbook and Google Multi-screen Success Stories are also full of ideas.