It’s widely understood that “mobile web” refers to people accessing information on browsers through their smartphone and/or tablets. It’s also a safe assumption that you yourself are a consumer of information on the mobile web when you consider that of the more than 7 billion people in the world, 77 percent own a mobile device. This leads to the conclusion that your customers are looking for information about your products and operation by using their mobile devices.
With that in mind, have you spent any time thinking about what your website looks like on a mobile device? Do you know how customers and potential customers find information about you on their various mobile devices? Many companies have not taken this time to make sure that their mobile presence is up to the task.
If you are thinking, “Yes, I have a mobile website. When I go to my URL on my phone, there it is. I see my site, just like I would from my computer,” you might want to take a moment to read on and see why an exact replica of your desktop site may not be the best way to go.
Understanding Your Mobile Visitors
James Williamson, senior author for the online tutorial site Lynda.com, makes the point that when designing for the mobile web, we are making too many assumptions on exactly what a mobile user is. Bad assumptions about mobile:
• Mobile connections are slow
• People don’t want to see your full site on a mobile device
• People accessing mobile sites are always on the go
These assumptions serve only to limit our thinking about what people want to get out of our sites on mobile devices and lead us to miss important opportunities.
For instance, as I write this article, I am using my tablet for research, sitting at my desk (not mobile at all), with a strong internet connection, and I fully expect to have access to all content on the sites I visit that I would if I was on my computer. Williamson further contends that the only assumption we can make about mobile users is that they are always connected. It’s as simple as that. Your customers can always access information about you — from anywhere, at any time, and from any device.
One simple understanding, however, opens up an entire can of worms when it comes to achieving a superior mobile presence for your customers. Creating a successful mobile website for your company needs to be an integral part of your overall user experience strategy. It can’t just be an afterthought, or worse, a scaled down version of your site squeezed onto a mobile device.
Your Mobile Website Strategy
To create a mobile web that is intentional and reflects your commitment to user experience, there are two concepts you need to embrace and understand; responsive web design and content strategy. When deployed in concert, these two fields work together to give you a web presence that is adaptive, accessible and device-appropriate. In other words, your site will be a good experience for all visitors; regardless of where they are when they view it, and what device they are employing to interact with it.
Responsive web design, a term coined by professional web-designer Ethan Marcotte, refers to three specific techniques for making sites that adapt well across many browser environments.
1. Fluid layouts
2. Flexible images and other media objects
3. Media queries
Even if you have hired a professional web designer and developer (highly recommended), you will benefit greatly from an understanding of what’s at work behind the scenes. You are not simply creating three static visual designs (smartphone, tablet, desktop) but creating a fluid design that is coded in a way that it understands which device is calling up the content and responds accordingly.
Content strategy refers to the planning, development and management of content. This content can be written, or it can be a host of other media including video, webinars or images. Content strategy has become increasingly critical for businesses (both consumer-facing and business-to-business), as customers have changed the way they buy. Customers don’t want to be sold to, they want to do their own research, get the information they find valuable, and then they will let us know when they are ready to buy. In other words, the traditional marketing and sales funnel no longer applies. Which means that we need to make sure the technological advances are working in our favor and not against us, making your mobile web content decisions so much more important.
For instance, take this example above, of a very straightforward web layout, and look at how the content and columns have been shifted to fit various screen sizes. The content is all there. We have not made assumptions about what a phone user will want to see vs. someone on a tablet or desktop, but we have prioritized the content and allowed for ways for people to dig deeper if they want more information.
The move from desktop to tablet has a few subtle differences, like the placement of the navigation and some of the explanatory text, but that attention to detail makes a difference in how you take in the site on the smaller screen. Then when you move to the smartphone, the columns are all condensed to one, but they still have all of the same information available. They have also collapsed the menu to make it friendlier on the eyes, as well as more conducive to the smaller touchscreen navigation.
If you’re looking for additional design inspiration, Mobify.com has published some of their favorite responsive sites to help get your creative juices flowing.
Steps You Need To Take Toward Mobile
If you don’t have a website at all — or are ready and willing to do a complete redesign — your-job of creating a mobile website is actually easier. Sounds a bit counter-intuitive, I know, but many web experts agree that designing for the smallest screen first and growing from there is the smartest way to approach responsive web sites. The reasoning is that this allows you (forces you) to make your toughest decisions up front. (Is our company description most important, or do people really need our phone number and address first?) Those decisions will then pave the way for a superior content map for your larger screen layouts, as well.
- Inventory all of the content that needs to go on your site
- Categorize it
- Prioritize it
Admittedly, most of us have to work backwards, as we already have our desktop versions out there and now it’s time to make it responsive. This means we already have our initial designs, we already have a lot of content and we have already coded the site. This gets a little harder, but not impossible. You just need to go in to the project with an open mind and be willing to re-think some previously made decisions.
This is hard. I know it is not a project that is easy to tackle because even as I sit here and write this article as a marketing and user experience practitioner, I have to admit that sometimes other tricky business decisions get in the way. Like timing and resources.
Here’s my confession: ePlantSource does not have a good mobile presence. Our website on a smartphone or tablet leaves a lot to be desired.
Awhile back, we made the decision to focus on desktop users first and then work backwards. I remember the day we made this decision clearly and we had our reasons, some of them good ones some of them slightly more questionable. But that does not erase the fact that now we have some work to do to get our mobile viewing experience to match the very high standards that we set for our desktop site experience.
There are a lot of technical considerations to keep in mind and the field of responsive web design is constantly evolving, as it is a very young one. I did not go into all of the technical nitty gritty here, but I highly recommend the tutorials on Lynda.com if you are interested in diving deeper into the techie side of mobile website design and implementation. For other design considerations, I turn regularly to SmashingMagazine.com and Alistapart.com to keep an eye on what’s coming down the road.
Make the commitment to step outside of what your site is today and really look at it objectively to decide how your mobile strategy needs to be implemented. Then take the time to sit down with the right team (I’d recommend starting with a web designer, web developer, your content experts, your marketing team and executive leadership) and make it a priority for your company to have a smart mobile web presence.