Mobile First: Putting Your Customers First Mobile Web Design Is Not Really About Web Design...
It's About Serving Your Customers Properly In All Of The Devices They Are Already Using To Access Your Content & Systems!
Responsive Mobile website design does not need to be expensive, mysterious, and slow. With Enlightenment Media FL you'll quickly catch up to web design best practices, and in so doing serve all of your customers much better.
Contact Enlightenment Media today to get an immediate review of your website's mobile performance and priority suggestions about what you can do to improve it fast.
So, Will Mobile Web Usage Ever Overtake Desktop? That already happened in 2014
The mobile tipping point was reached in early 2014, when the number of mobile internet users grew to be higher than ‘normal’ desktop users (they crossed over at about 1.7 billion each). The mobile user base continues to be in steep growth, estimated to be at least 2 billion more users than desktop by the end of 2015.
Given the visible growth trends since the first iPhones, then ubiquitous cheap Android smartphones, brought the internet into everyone’s pocket, you could be accused of burying your head in the sand if you have not been actively working to adapt your website and digital marketing to take account of mobile users.
But if you’ve neglected this segment (now over half…) so far, you’re not alone. The added complexity of creating websites that work OK for mobile users has been – from a business point of view – a reasonable reason to delay and keep thinking. However, the “best practice” solutions are now generally agreed (see Responsive Web Design below). With the costs falling to implement mobile-friendly websites, and the mobile user base still growing, you really can’t afford to put it off any longer.
“Build a mobile website”… or “Make our website mobile-friendly”?
There are various approaches you can take to ensure mobile users have just as good an experience on your site as desktop users.
The most common approach, practically the “best practice” is responsive web design (RWD) which means that the presentation, and to a certain extent content, responds/adapts to the device being used to to view the site, mainly based on the width of the screen.
RWD means there is not a different or separate “mobile web”… just the same site and pages and functions, presented in a way that is still good (or at least “OK”) for smartphone and tablet users.
Many responsive designs essentially operate on the principle of removing complexity as a screen gets smaller. Some designers prefer to look at things from a mobile first point of view, which is to start with a simple design and then progressively add elements as the screen can accommodate them.
Before responsive design it was common for websites to feature a completely different set of code for the mobile-only site (mobile-specific site), commonly hosted on a subdomain like m.mysite.com – There can still be good reasons to take this approach, for example if there are special interactions or DIFFERENT content that you only want to offer to mobile users, or if your main website content is really too hard to adapt into a small-screen environment at the time being. In some ways this could be viewed as halfway towards a dedicated app: prioritizing or adding certain content or functions for mobile, but perhaps trying to avoid the friction of asking users to install yet another app.
A further reason some businesses continue to create mobile-only sites might simply be that it the most efficient way for you to offer a fast version of your site without adding code and design complexity to your main site. This is often the easier approach in large companies with lots of people involved in maintaining (protecting!) the main version of the site.
If you serve a mobile version of your site, it is conventional to offer users a clear link to switch back into the desktop / “full” view of your site.
In our view, whether you are considering options for improving your existing site, or building a new site from scratch, it usually makes more sense (and costs less in the long term) to focus on ONE responsive site rather than start developing and maintaining two versions of your site.
At the minimum, websites can be configured to redirect mobile users to certain mobile-only pages. Sometimes this is done by the server (dynamically served) rather than a redirect from the CMS. Unless there is a special benefit to the users from doing this, it should only be considered a kind of Band-Aid solution.
Behind your competitors in mobile web design? Harvest the good ideas…
There are obvious market research benefits from staying up to date with what’s happening on your competitor’s websites. When you do this research, try browsing only from mobile devices. Take screenshots and notes about the things you like. Presenting examples and specific details of design and functionality will make it much easier for you to direct your web design experts about what you expect to see from the mobile-friendly improved version of your site.
These Benefits? They Are What You Are Missing Every Day Your Site Fails To Satisfy Your Mobile Customers
You will start feeling the benefits as soon as you start giving customers a better experience on mobile devices. This is because you likely already have a lot of traffic from these users, who are getting fed up or at least not accomplishing things as easily as they should be.
Then, once your site works well for mobile users, you will see more of them coming back, but also more new customers coming in thanks to the SEO benefits of being considered “mobile-ready” by search engines.
Here are the things you are looking to improve by having a better experience for mobile users of your website:
- more professional, up-to-date image for your brand (or, risk of the opposite image if you are not providing a good mobile experience!)
- more engaged and converting traffic from all the mobile users who were neglected before
- more repeat visits and brand recognition/trust as people can see your information across all their devices
- better SEO / search ranking in general
- likely better speed and usability for your desktop users, as a side effect of improving things for mobile
- better accessibility for disabled and elderly web users, again as a likely side effect of your work on mobile things
- working with mobile device functions opens up new creative options for how to present rich information and functionality to your users
Finally, once you have a really good website for smartphone and tablet users, you will be able confidently to start investing in mobile-targeted advertising, particularly in PPC. This will bring you plenty of new customers and often at lower cost of acquisition.
When users hop over to your site from Facebook and Twitter, it’s likely they are on mobile devices. You want your site to work perfectly for them. By getting better at engaging, retaining, and converting mobile users, you get better ROI from your work in social media.
Resources For Mobile Web Design
The complexity and specialist skills involved in mobile web design originally made it hard for small businesses to accept the cost. But this has changed: any web designer or agency that you employ should now be able to begin from mobile-ready principles instead of this adding on cost like an optional extra. Be very clear with your web designers: mobile is not optional, it's core.
Here are some of the inputs you'll need for mobile web design planning and projects. If you don't have these viewpoints or expertise areas in your team already, be sure to have them covered in your agency or consultant's input.
Instead of diving straight into design concepts, consider getting some research done. On a general level this could be looking at best practices in your industry or among similar sites. On a specific level you should know your current mobile traffic stats and web analytics figures, as well as ideally being able to run small usability tests to observe how actual humans interact with your site on mobile devices. Remember, mobile first is really about being "customer first".
- Graphic design
Don't believe that responsive and simplified designs mean being ugly. You need someone in the team who can contribute aesthetically pleasing and brand-matching visuals, and you can leave it till later to figure out how to make it work in the HTML/CSS.
- Web design coder
Don't rely on your most expert designers and coders to test their designs. A fresh pair of eyes is highly valuable, and you should designate one or more people at key stages for testing and feedback. Don't make your live customers the first line of guinea pigs!
- Customer support / sales
The people who most directly deal with your customers should represent the voice of those customers in your internal design and marketing discussions. Customer support team members can role play as customers in testing, and if they understand your usability and design decisions for the mobile improvements, they will be able to support users better after the roll-out. In general it is a very good idea to involve your customer support talents in web design discussion because they will start to feed back website improvement ideas sourced directly from your customers.
Ensure your marketing people are involved throughout, so they can contribute their own thoughts related to branding and conversion, and really understand the strengths of the new design when it comes time to launch it.
One often ignored aspect of mobile design is how to keep it healthy or even improved for search engines. While your human users are the center of your design decisions, make sure that the site remains robot friendly too!
- Technical / sysadmin
Last but absolutely not least is your IT-oriented expert who understands the technical options available on your server and infrastructure. Typically you should ensure such experts are on hand to create realistic testing environments, and keep an eye on speed and security right the way through!
The above ideas don't apply only to mobile web design, and you shouldn't try to create a whole separate process just for mobile web design... to re-summarize, involve all the right people in ALL your web design, and ALWAYS make your web design mobile-friendly.
Mobile Website or App?
Sometimes it makes more sense for you and your customers to have a dedicated app, and push mobile web users towards that. On the other hand, it is sometimes unnecessary to develop and maintain an app when a mobile website could serve everyone better.
Here are some of the questions to consider:
- What are the most common devices used by mobile visitors to your current site, and what are they mainly trying to find out or do? In other words, what are the priority service points for which types of devices?
- Do you offer interactive or utility features for customers which could be better delivered in a custom-programmed app rather than web interfaces?
- Are there certain common customer needs/actions which as single or small groups of things could be shifted into a specialized app without necessarily trying to replace the whole mobile version of the website?
- Can you offer functionality which is especially useful to someone out and about, e.g. GPS/location aware content (including maps), or location-aware offers and directions relating to your branches/stores?
- Are you planning to charge users for access to the system or products, and would doing that through an app likely convert better?
- Do you want users to perform actions that are simply going to be easier on their mobile, e.g. make in-app payments, receive notifications, track points/rewards, import information from phone contacts?
- Are there strong security benefits (or disadvantages) to users performing tasks via an app instead of in a normal browser?
- If you are offering complex functionality in your website what is the likely future of that technology - e.g. if it is Flash it will have to be changed sooner or later anyway.
Prioritizing Your Mobile Web Dev
How high a priority should mobile website design be to your business? First of all, you should get some up to date numbers from your analytics and see the numbers of users on different kinds of devices. Most businesses already have over half of their traffic from mobile (which is not to say that traffic is 'created equal' to desktop traffic).
You can see what proportion of your users currently are on smartphones and tablets, and measure indicators such as bounce rate, time on site, and average pages per visit ... as well as conversion rates of course... to determine whether there are issues with how easily and pleasantly the mobile users can accomplish things.
If there are obvious pain points or commercial opportunities for making improvements targeted at mobile users, this is of course where you should start.
Thinking longer-term, it is important for you and your team to understand the special challenges of designing for mobile consumption and interaction, so you generate ideas that take account of this as well as just 'normal' desktop thinking.
Using your systems regularly through a variety of mobile devices is a very important habit. It's not scientific but will help you face the same usability issues as your customers.
Regardless of the exact device, here are the top reasons why mobile users of your website experience it in a different way:
- The screen is smaller, and the smaller the screen, the harder it is to see and use small elements
- The user views web pages through a mobile browser which is likely different in presentation and functionality to a normal desktop version of Chrome, Firefox etc
- The speed of the hardware and possibly the internet connection are likely to make the user much more susceptible to slow page loading speed from a variety of design and server factors
- There is no cursor, so no hover-over for elements, and no pinpoint accuracy
- Using a finger it is a touch or tap, not a click, and it is harder to perform actions like selecting, dragging, or whatever the equivalent of right-clicking is for contextual actions
- Text input tends to be more difficult since most users do not have a physical keyboard
- So far most mobile devices have a non-windowed approach, i.e. you interact with one app or browser tab at a time, so don't expect users to do things that involve flicking quickly back and forth between windows or applications
- For videos and images the user will likely expect to be able to open the media in full screen (or in the case of video, a different app) to view it properly
- Mobile devices have many strengths over desktop devices in areas such as multitouch, location awareness (and similar things like compass and gyroscope), voice input, integration with social media and mail, integration with camera and photos, and notifications
- Despite having smaller screens, many mobile devices and particularly tablets may have higher resolutions that people's ordinary desktop monitors
Apart from the above issues related to the hardware and software, you should also consider the different contexts people use your site and systems on. Mobile could mean the user is out and about, but not necessarily. We all use our phone and tablet just as much at home. However, it is probably fair to say a user's attention and overall goals are not usually the same when using a mobile device instead of a desktop or laptop computer.
Mobile web design, like all of your web design, should be an ongoing effort to find improvements for your customers that turn into improvements for your bottom line. Start with the obvious pain points and obvious low-hanging-fruit, and build from there.
We've rarely encountered clients who are happy with their website's performance for mobile users. If you are feeling the pain, so are your customers. Identify the priorities, make improvements fast, know what to work on next... contact Enlightenment Media today to get moving on mobil