How to test if my website is mobile friendly?

Many websites now have more visits from mobile phones and tablets than from desktops and laptops.

Google takes a mobile first approach to rankings meaning it views your website as if from a mobile and uses this as the basis for your search ranking.

So it is now vital for all websites to be mobile friendly (works reasonably on a mobile) or better still mobile optimised (designed for the mobile user first).

Here are some key characteristics of a mobile friendly website to check for:

1. Responsive Design: The website automatically adjusts its layout and content to fit different screen sizes and orientations. Whether a user is on a desktop, tablet, or smartphone, the website should look right and function well.
2. Speed: Pages load quickly, even on slower mobile networks. 
3. Increase Font Sizes: Make sure your text is large enough to read without zooming on small screens. A minimum of 16px is often recommended. Text size should be adjustable and the font should be clear and legible on smaller screens.
4. Plenty of White Space: White space makes blocks of text easier to read by separating them from surrounding elements.
5. Clear and Simple Navigation: Mobile screens have limited space, so navigation menus should be easy to access and understand. Often large screen menus are replaced by a hamburger menu or other compact design.
6. Mobile-First Content: Prioritize content that is most relevant to mobile users. Break down long blocks of text into smaller, digestible chunks.
7. Touchscreen Optimization: Mobile devices rely on touchscreens, so buttons, links, and other interactive elements should be large enough to tap easily. Avoid placing clickable elements too close together.
8. Easy Contact Information: Make it simple for users to contact you by prominently displaying your phone number, email address and physical address. Features like click-to-call buttons and integrated maps make it easy for users to contact or find you.
9. Optimized Images and Videos: Images and videos are scaled and compressed appropriately to ensure they load quickly and look good on smaller screens.
10. Avoid Slideshows: Slideshows, they distract from the real content and generally do not work well on small screens.
11. Avoid Pop-ups: Avoid intrusive pop-ups, they just annoy and can be difficult to close on small screens.
12. Avoid PDFs: PDFs are fixed format documents that do not resize or adapt to screen sizes so you end up zooming all over the place to read them.

Testing Tools

Google has now retired its mobile friendly testing tool at the end of 2023. Here are some ways of checking your website’s mobile compatibility:

• Lighthouse: Built into Chrome DevTools, Lighthouse provides a comprehensive audit of your website’s performance, accessibility, best practices, and SEO.  
• Browser Developer Tools: Most modern browsers offer developer tools that allow you to simulate different screen sizes and inspect your website’s layout.

Manual testing: Testing your website on actual mobile devices will give you a better idea of the user experience on your website. Be aware that screen sizes vary a lot so any one device is not necessarily representative of all. The current trend is for larger screens.

Test Regularly

Unfortunately testing for mobile friendly is not simply a once off task as technology changes can move the goalposts and content and design updates to your website can change circumstances.