BLOG

Smartphones and tablets have been popular for less than 10 years but mobile internet access is par with desktop access. In 10 countries including the US and Japan, higher Google searches are conducted on mobile devices than on computers.

This trend is being constantly highlighted by Google now. It has recently made alterations to the search algorithm for improving the rankings of mobile friendly websites in search results and reprimand sites that are not mobile friendly. Normally called “Mobilegeddon”, numerous sites experienced a drop in rankings extensively on mobiles after these modifications, and many others are trying hard to make their websites mobile friendly. Even after all this, there are websites that do not work well on mobiles. This includes new websites too.

Search engine optimization is not the only domain of Internet marketers. The design of a website and its implementation does cause an impact on search engine results.

Being designers and developers, it is important for us to take a step back and check our work. It is not enough for the websites we create just to look attractive. They should be able to provide what the user wants and produce revenues for our clients. You should not leave the “mobile-friendly” test as the last step of your design. Ensure to include it into the design and development.

Are you trying to make deliberate efforts to keep everything simple for mobile users?

To make it easier, you can check the top questions you should ask to understand the extent to which your site is mobile-friendly.

1. Is the display of the site good on various devices?

Mobile devices are available in numerous sizes and forms. Smart devices are available in the range from smart phones with 3″ screens to tablets with 7″ screens and further. First, you should check if the display of your website is accurate across all devices. For this, you can make use of a few, which are:

• DesignModo’s Responsive Test
• Responsive Test by ZooExtension
• Responsive Design Test by StudioPress
• Earlier, sites made use of separate URLs for the mobile version of the site or provided dissimilar content on mobile vs. desktop access. Considering the different screen sizes of devices used today, it makes sense to use a responsive layout for your site.
• Website displayed on various devices

2. How simple is it for mobile users to finish common tasks?

The space available on the screen is less than a desktop. The main mode of input is touch. It is tough to enter data into forms when you have to try to tap it out on a virtual keyboard with small keys. This aspect makes the user interaction unlike that of a desktop.

You need to make it simpler for users to be able to interact with your site on a smartphone. You should take account of simple things such as using a font size that is readable on small screens, or giving users the option to call you with a single click. All these will sum up to providing an enhanced user experience.

3. Is the Call to Action icon in the middle and easily identifiable?
Improving user engagement and revenue is the most important aim of any website. For this, you need to have easily visible and actionable CTAs placed deliberately on your website. The CTA which is designed to be tactically positioned at the top-right of your home page could probably reposition to screen 3 on a mobile device. There is a possibility that it does not resize properly which could cause the vital input fields to vanish. Ensure to re-check your CTA’s position, layout and appearance on mobile devices.

4. Does your site consist of deep multi-level menus?
All this while, it was quite common for websites to have menus that were three and even four levels deep as this would indicate how much you offer. Many websites even now have this. Many people do not quite like the idea of having a simple, clean website with uncluttered navigation. You need to understand that on a mobile device this is a necessity. Mobile sites usually have a menu in the form of an icon at the top of the screen which expands when tapped. Most users do not have the time or patience for many taps or scroll through the various options. It is best to have short menus for mobile devices.

5. How simple is it to go back to your home page?
For a user who has gone levels deep into the page hierarchy or blog posts or products, how easy is it for them get back to the home page? In this Google study, visitors thought that they would be led to the home page by clicking on the site logo but were irritated when it did not work. They could tap open the menu, and then tap on “Home”, but why should they take extra efforts? Why make the visitor use two taps when one is possible? Simply linking your logo to the home page can prevent frustration among users and save taps. This also frees up space in your menu.

6. Is it effortless to search on your site?
You need to make it simple for mobile users to get what they want promptly. Apply ‘smart-search’ features such as auto-correction and auto-complete. When you add specific filters, particularly for e-commerce sites, it makes it easier for users to locate relevant products quickly.

7. Are your forms appropriate for virtual keyboards?
Only some people like filling out forms on small, virtual keyboards. Try to keep forms for mobile devices as easy as possible. Fill in default fields to make it easier for users and keep auto-complete available. For all kinds of field, make use of the simplest and most apt input method. For instance, with dates, use a pop up calendar where the user is allowed to tap on a date instead of making them type it in DD/MM/YYYY format.

8. No pinch-zoom, apart from product images.
When touch screens were first launched the option to pinch and zoom was very popular but this is not the case now. Mobile users today want immediate access. They do not want the hassle to pinch and zoom your page for basic information. You should ensure to keep the font large enough to be readable on a small screen.
This is exactly opposite for product images. Users need the ability to zoom in and see the product at a more granular level. You should strike a balance between image quality and image size.

9. Is your complete site crawlable?
Google can identify three diverse configurations for mobile devices:

• Responsive Designs where the layout becomes accustomed to the screen size.
• Dynamic Serving where web servers send out different HTML based on the device’s UserAgentString.
• Separate URLs that serve different code to every device, on varied URLs

Immaterial of the method you use, if Googlebot is not able to crawl your site properly, it will affect your search results. Make it a point to assure that Googlebot can view your site like an average user. Ensure to make your CSS, JavaScript and images crawlable. You can check your robots.txt with this tool.

10. Can your entire content play on mobile devices?
A few types of content, like videos, may not be playable on all mobile devices. For instance, Flash does not work on various mobile devices. This is the same for unsupported video formats. If your content does not play, it could be really irritating for mobile users and does not serve the purpose. Instead of this, it could be a better alternative to stick to HTML5 tags for all audio and video content.

11. Have you re-checked your redirects and cross links?
If you maintain different URLS for mobile versus desktop, then whenever users access your desktop page from a mobile device, you will have to set up a redirect to the suitable mobile page. Do not redirect all desktop access to the mobile home page as this is what the user wants. This is the same for mobile to desktop. You should ensure to link to the correct page. Do not link them all back to the desktop homepage.

12. What do you do to handle complex tasks and sensitive information?
There are numerous mobile users who are not comfortable conducting complex tasks. For some, this includes the ones that need sensitive information to be inputted on mobile devices. Desktops are still supposed to have better security than mobile devices. One good thing to do is to provide a ‘click-to-call’ button which makes it easier for users to finish the transaction. One more way to do this is to allow the user to put back the interaction to another device. For instance, users who are browse through a job search site may like it if there is an option to email a list of relevant jobs to themselves. This makes it possible for them to apply later, probably from a desktop.

How does your website work against these criteria?