You know you need to optimize your website for mobile. What exactly does that mean? I’ve talked about mobile design considerations and statistics to prove why mobile design investment matters, this post will review considerations and best practices for optimizing for mobile.
What does optimizing a site for mobile mean?
Optimizing a site for mobile means the design is optimized for mobile platforms. This includes the small screen sizes of feature and smartphones and larger size tablet displays. Mobile is not just phones; it’s the “portable web” versus the desktop experience.
A mobile website is not an app (which is what most people get excited about). Apps are device specific. Mobile sites can be a cost-effective way to reach a broader range of audiences across multiple devices. (Do you need a mobile app or website?) You can develop a separate mobile site (and use browser detection to redirect) or you can develop a responsive web design that adapts to the screen size it is being viewed on. Responsive design allows you to develop one site that is reactive, and you don’t need a separate mobile site at a separate sub-domain.
HOW TO APPROACH OPTIMIZING YOUR WEBSITE FOR MOBILE
To start your project right, be wary of these common mistakes and know the best practices.
“We don’t need a new strategy; it’s the same as the desktop site.”
Optimizing a site for mobile is a new project and should be approached that way.
Define the strategy, goals, and objectives like you would for any new project. These should be specific to the mobile strategy—not the same as the desktop website. You aren’t just converting something that exists; you are creating something new that will be used in a different way.
“We MUST have a solution for [insert shiny new device name].”
You are building a solution for users not devices.
Start with people and how you can help them. Who are you targeting? What do they want? How will they use your mobile site? It is important to identify what devices your audiences are using but knowing how they use them and how your solution can support their needs is key to success.
“Everything should be exactly the same as the desktop website.”
It’s about a seamless experience not a duplicated one.
The consistency should be in the user’s experience with the brand, company, and information—not the UI, content, or design. Users may go from desktop sites to mobile sites to apps and the same core information may be available but it should be displayed in a manner that is appropriate (designed and optimized for) to the delivery mechanism.
“We have to have all of our content on X device.”
Streamline and simplify. Optimize for the content strategy first—not the device.
What do customers need access to? Provide the necessary content to help users accomplish goals and remove anything that doesn’t help. (Superfluous images, unsupported file formats, unnecessary text). Often mobile users want specific information or content to act now. Provide quick answers to bite-sized content.
“We just have to match the UI for the device.”
Know what mobile is good at and design for it.
Leverage the potential of the device and its capabilities (i.e. GPS, image capturing, multi-touch, orientation). But also remember constraints (tough targets, size, speed, contrast) Consider responsive design, where the design responds to the user’s screen size, platform and orientation.
“Whether at a desk or using a mobile device, people use our site the same way.”
Mobile users have different mindsets and needs. Context is key.
Be sensitive to where information will be accessed. Usage behavior may be filled with interruptions, distractions, and movement. Plan for low bandwidth, short interactions and attention spans. Information needs may be urgent (find location), repetitive (call, email, micro-tasking), or a result of boredom (updating that Facebook status yet again).
“Everyone has a smartphone.”
It’s a mobile world but not a standardized one.
It may seem like everyone has a smartphone, but how users access the mobile web varies around world (as does bandwidth, resolutions, and file formats). Look at your web analytics and design around highly-used platforms. Mobile optimization for your audience may encompass smart or feature phones, readers, and tablets.
“A mobile-optimized site will be a great way to sell more stuff.”
Remember you are “helping” not “selling.”
Look at how you can streamline processes and make things easier. Figure out the “have to have” functions and focus on those as primary tasks.
“We should automatically present the mobile-optimized version.”
ALWAYS give users a choice.
Give the user a choice to use the mobile-friendly version. If you use device detection, ask the user’s preference or include a link to the full site. Provide necessary content and access to additional information.
“We know our users. We don’t have to test.”
Test. Test. Test.
There’s a reason I end many of my blog posts this way. You aren’t the user. You can’t design an effective solution without involving the people you intend to use it. Test your solution with simulators and real people with their devices.