How do I make my website mobile-friendly?

Find the problems

1. 1Open your main pages on an Android phone and an iPhone if you can, and try to complete a real task such as making an enquiry.
2. 2Run pagespeed.web.dev on the mobile setting, or Lighthouse in Chrome DevTools, to see mobile performance and accessibility issues.
3. 3In Chrome, use DevTools device mode to preview different screen sizes.
4. 4Note anything that needs zooming, sideways scrolling, or tiny taps to use.

Common fixes

• Text: body text that is comfortable to read without zooming, with enough contrast against the background.
• Buttons and links: large enough to tap easily and not crowded together.
• Images and tables: set to fit the screen width; long tables may need to stack or scroll inside their own box.
• Menus: a clear mobile menu with your most important pages first.
• Forms: fewer fields, the right keyboard for phone and email fields, and labels that stay visible.
• Pop-ups: avoid ones that cover the whole screen on mobile.

By platform

• WordPress: most current themes are responsive; page builders such as Elementor let you adjust spacing and font size for mobile separately.
• Shopify: themes are responsive, and the theme editor lets you preview the mobile layout.
• Wix: has a separate mobile editor where you can rearrange or hide elements for phones.
• Squarespace: templates are responsive; use the mobile preview to check each page.

When the layout is the problem

If your site was built years ago with a fixed-width layout, small tweaks will not make it work on phones. In that case a responsive rebuild, keeping your content and URLs, is usually the cleaner fix.