Mobile version of a website: what to check

A website gets approved on the computer it was made on. But a client may open it from a phone, via a link from social media, from an ad or from a chat. Below - a checklist you can use to check the mobile version yourself, without technical knowledge.

Why should you check the mobile version separately?

On a phone, the page shrinks into a narrow column. Blocks that sit side by side on a computer stack on top of each other, text wraps, images get smaller. What looked neat on a big screen can break on a small screen.

Check the website on a real phone, not only in a shrunken computer window. Even better - on several phones with different screens.

How do you check the text and layout?

Open the home page and the key pages and scroll them to the end:

Text - reads without zooming in, lines do not run off the edge of the screen.

No horizontal scrolling - the page does not shift sideways as you scroll.

Images - not cropped, important details are visible, captions are readable.

Tables and price lists - do not turn into an unreadable mess.

Are buttons and links easy to tap?

On a phone, you tap with a finger, not with a mouse. Check:

Large buttons - the button is easy to hit without aiming.

Space between links - neighboring links are not packed tightly together, and a tap does not land on the link next to it.

Request button - visible on the first screen and repeated further down the page.

Does the menu work on a phone?

On a mobile screen, the menu hides behind a button. Check that it opens and closes, the items are readable, and after you follow a link the menu does not stay hanging over the page.

If the menu is long, keep the essentials on the phone. It matters more to a person to find services, prices and contacts than a full list of pages.

How do you check the request form on a phone?

The form is the main reason a person came. Fill it out yourself:

The right keyboard - a number keypad opens for the phone field, and a keyboard with the @ symbol for email.

Fields stay visible - the keyboard does not cover the field you are typing in.

Sending works - the request goes through, and a confirmation appears on the screen.

The fewer fields, the easier it is to fill out the form from a phone. Which fields to keep, I described in the article Website enquiry form: which fields you need and which get in the way.

How do the call and messenger links work?

From a phone, it is easier for a person to call or write than to fill out a form. Check that the phone number is tappable and starts a call, and that the messenger link opens a chat.

It is convenient when the contact button is pinned to the bottom of the screen and stays visible as you scroll. The main thing is that it does not cover the text and other buttons.

What gets in the way on a small screen?

On a phone, space is precious, and things that are barely noticeable on a computer get in the way:

Pop-ups - cover the page, and they are hard to close with a tiny cross.

Widgets over the content - a chat, a cookie banner and a contact button that overlap each other.

Heavy videos and images - the page is heavy to load and uses up mobile data.

If you are checking the website before launching ads, a separate checklist will help - in the article What to check on your website before launching ads.

How much does a website with a convenient mobile version cost?

A landing page - from $190, a multipage website - from $490, a complex project - on request. I check the mobile version on a phone before handover, not only in a shrunken window. The article Landing page or multipage website: what your business needs will help you understand which format to choose.

If your website is inconvenient on a phone, send me a link - I will take a look and tell you what gets in the way.