You don’t have to be an expert in digital marketing to know that mobile has been gaining significant territory over the last few years. If you want to stay ahead of the game, you need to understand the importance of a sound digital strategy to the overall success of your business. At the heart of this sits your website.
Ensuring that your website is optimised for mobile is a given but what about designing for mobile first? In other words, you design your website first and foremost for mobile devices, with desktop designs comprising the second stage of the process. Mobile first has been somewhat disruptive in the industry with strong advocates and those that are a little more hesitant to adopt the practice. Let’s explore the facts behind it:
Last year, in what you could say was a predictable outcome, mobile finally surpassed desktop on worldwide internet usage. Even though in the US and in the UK desktop still accounts for the majority of traffic (with 55.6% and 58% respectively), it is impossible to ignore the importance of mobile on a user’s journeys.
We are no longer asking ourselves whether mobile design and marketing are important or not – we know for a fact that they are. It is now a matter of analysing statistics and getting hands-on with your mobile strategy, by seeking to understand the needs of a contemporary user.
There are, of course, a lot of factors to consider. One of the key statistics to consider is that browser websites actually account for just under 25% of mobile usage time (i.e people using Chrome or Safari on their phone). Users spend the vast majority of their time using apps which can has a large effect on the stats. However, the amount of time spent on mobile phone browsers is still significant in the big scheme of things. Furthermore, bear in mind that apps may not be relevant to all businesses and a such it is important to consider whether an app would be a solid investment in the long-run as well as how that impacts the amount of users coming to your website via mobile.
You should also know that Google is now favouring mobile-friendly websites in its mobile search results. Considering that nearly half of Google search traffic comes from mobile devices, you really need to be placing mobile optimisation at the top of your priorities list.
The idea that mobile should kickstart the design workflow appears as though it is here to stay. Even though designers still debate over which approach is better, the idea of progressive enhancement is gaining increasing popularity amongst web designers. Progressive enhancement is about designing for smaller devices first. By addressing mobile’s limitations right at the beginning, you will have designed the essential skeleton of your UX and can then work your way up, adding details for more robust, larger formats.
This method has been gaining more and more traction as the mobile usage stats continue to rise and has been included within a lot of recent best-practice manuals. It significantly shrinks your initial canvas, which can seem a bit limiting at first but may avoid a lot of headaches later on in the process.
Or desktop first?
On the other hand, the more traditional approach of graceful degradation starts with desktop, and addresses mobile problems later. A lot of designers still prefer this approach, leaving mobile as a secondary consideration, potentially because it what they have always done! Using a larger canvas from the beginning will give you more freedom and allows you to focus on a more visually immersive experience.
Either way, there will have to be some sort of compromise if you’re not willing to design two different versions of your website. The main obstacle with this method is that it may be hard to consider the fluidity of the website’s content. With the desktop first approach, you may have to cut major aspects that give your desktop website its individual identity, therefore risking a more generic mobile version.
Know the trends
When it comes to research, do not just trust what you learned from the project you completed six months ago. Design and technology are constantly changing, meaning that trends and best practices evolve at the blink of an eye. Make sure you are up to date with what’s happening in the UI/UX world before you make any outdated decisions.
Design for touch
The primary challenges of designing for a pocket-size device lie in drawing a closer relationship to the user’s touch. Replacing the cursor with touch interactions shifts the focus to scrolling, swiping and tapping events.
Make interactions clear
As hover effects are almost obsolete on touchscreen devices, it needs to be made crystal clear that any call-to-actions are clickable elements. Not only will they need to stand out, they also need to be big enough to be easily clickable. Following certain design conventions will make it easier for users to instinctively understand how to interact with the site.
Don’t forget navigation
Keep it simple. Mobile users want straightforward and quick information, so be sure to minimise any complexity with navigation. Explore all your options, from burger menus to icon navigation or slider menus, and see what best suits the type of users likely to be visiting your site. Clear call to actions on your homepage and main landing pages will further aid with your user’s journey.
Consider cutting down some content
As opposed to desktop design, mobile users have a much smaller canvas to focus their attention on. Content will always be of the utmost importance, especially in terms of providing value for the user and improving your SEO as a result. Nevertheless, bear in mind that mobile means more scrolling, so try to ensure that your content is not unnecessarily lengthy.
In the design process, there is no fixed formula. Different projects frequently require a different approach and it is important to consider this as part of your planning process. Ultimately, you should base your decisions on what makes more sense for your business. Above all you should keep in mind that mobile and its usage is only likely to rise in the coming years.
SPREAD THE WORD:
READ MORE RAMBLINGS
Fixing Font Rendering Inconsistencies Across Browsers
Have you ever designed an interface or website and spent hours selecting the perfect font for your UI to find that as soon as your XD or Sketch designs are developed into aSeptember 5th, 2019
What are Microinteractions and Why Does My Site Need Them?
Microinteractions are often overlooked features when you’re busy designing and building a website. When searching for “Key factors to consider when building a website”,June 28th, 2019