Phones first.

Most visitors to commercial websites come from a phone, while the business owner most often looks at their site from a laptop. Because of this difference, problems with the mobile version go unnoticed for months: analytics only shows that there are few leads and many bounces.

Let's look at where exactly a site loses mobile visitors, what to check in one evening and which mistakes are the quickest to fix.

Why the mobile version matters more than desktop

A website's mobile version matters more because it is the one search engines use to evaluate a page, and most customers make their decision on a smartphone. Desktop remains the second screen.

Share of mobile traffic

In most consumer service niches, mobile traffic is well over half of all visits, and in delivery, beauty salons and taxis it makes up the overwhelming majority. In B2B the share is lower, but the first touchpoint often happens on a phone too.

How search engines account for mobile

Google has fully switched to the mobile first principle: it is the mobile version of a page that gets indexed and ranked. Yandex also takes smartphone usability into account, and Core Web Vitals are calculated at the 75th percentile of real users, most of whom are on phones.

What this means for business

If a block with prices or reviews is hidden on the phone, for the search engine it simply does not exist. Content, links and structured data must match on both versions.

What you lose without a responsive design

Rankings, conversion and trust. A person who had to zoom in on the text with their fingers closes the tab within 5-10 seconds and goes to the competitor in the next line of search results.

Responsive design, a separate version or an app

For the vast majority of businesses, the right answer is responsive design: one URL, one codebase, a layout that adapts to the screen width. A separate version and an app are needed in rare cases.

What to choose

The decision depends on how often the customer comes back. A one-time purchase or inquiry calls for responsive design. Daily use with a personal account and notifications is a reason to consider an app. In website development, responsiveness is built in at the prototype stage, not added after handover.

Pros and cons

What suits whom

A service website, a landing page, a corporate website and a store with up to several thousand products: responsive design. A marketplace, a bank or a delivery service with a regular audience: responsive design plus an app. Building a website from scratch today always implies responsive design: no serious web studio hands over a project without testing it on phones.

What no longer works

Separate mobile subdomains are hardly ever built anymore, and Yandex shut down Turbo pages in 2025. You can no longer count on workarounds that "make a mobile version for you."

What breaks on a phone

The things that most often break on a phone are text, buttons, forms, menus and images. These are the five areas to check first, because each one directly affects the inquiry.

Text

Full-width lines without margins, a small font size and long paragraphs are hard to read. A comfortable line length on a phone is 35-45 characters, and a paragraph is 3-4 lines.

Buttons

Buttons on mobile should be at least 44-48 pixels high and placed so the thumb can reach them. Two links right next to each other guarantee mis-taps.

Forms

A field covered by the keyboard or a submit button that has slid off the edge of the screen wipes out the entire ad budget. A separate section below is devoted to this area.

Menu

A multi-level desktop menu turns into an endless list. Keep 5-7 main items and move the rest into subsections.

Images

Wide banners with text in the image shrink to an unreadable state. A phone needs a separate image or text laid over the image in the markup.

Speed on mobile

Speed on mobile is almost always lower than on a computer, and it is what search engines take into account first. Benchmarks: LCP under 2.5 s, INP under 200 ms, CLS under 0.1.

Why it is slower

A weaker processor, an unstable mobile network and the same heavy page as on desktop. A script that a laptop runs in a fraction of a second takes a budget smartphone many times longer to process.

What to check

The detailed measurement procedure is covered in the article on how to check website speed. For the mobile version, the main thing is two sources of page weight.

Images

Serve the phone images of the right width in WebP or AVIF and enable lazy loading for everything below the first screen.

Scripts

Often a single live chat weighs more than the entire page. Load these after the main content:

• chats and live chat widgets;
• maps and review widgets;
• ad platform pixels;
• embedded videos, replacing them with a preview until clicked.

Forms on mobile

Forms on mobile should take 20-30 seconds to fill in with one hand. Every extra field and every input error lowers conversion.

How many fields

A name and a phone number are enough for an inquiry, sometimes just the phone number. A comment, email and city are better clarified during the call.

Keyboard types

Set a numeric keyboard for the phone field and a keyboard with "@" for email. It is one line of code, and the user does not have to switch layouts.

Autofill

Properly marked-up fields let the browser fill in the name and number with one tap. Without markup, a person types everything by hand and often abandons the form.

Input errors

A phone mask that does not allow pasting a number from the clipboard or requires typing "+7" manually is a common cause of lost inquiries.

Validation

Report an error right next to the field and in plain words, not after the button is pressed as a list at the top of the screen that is not visible on a phone.

How to check the mobile version

Testing the mobile version consists of two parts: automated measurements and manual checks on real phones. One without the other gives an incomplete picture.

PageSpeed Insights

The service shows real-user data for 28 days and a lab run. Make decisions based on field data, and use lab data to find causes.

Real devices

Take an inexpensive Android phone and an iPhone, open the site over mobile internet and go through the customer's path to an inquiry. The full list of technical checks is in the article on a technical website audit.

What to look at

The minimum check route:

• whether the first screen is readable without zooming;
• whether the inquiry button is visible without scrolling;
• whether the menu opens and closes again;
• whether the form submits and the inquiry arrives;
• whether the clickable phone number works.

What not to trust

Developer mode in a laptop browser does not show real network speed or keyboard behavior. A validator's note that "the site's responsiveness is fine" does not guarantee usability either.

Common mistakes

The most common mobile version mistakes are small fonts, horizontal scrolling and pop-ups. All three can be fixed in a day or two of a front-end developer's work.

Small font

Body text smaller than 16 pixels forces people to zoom in on the page. Footnotes and captions can be smaller, but not below 12-13 pixels.

Horizontal scrolling

It is caused by wide tables, fixed block widths and embedded videos. Wrap tables in a container with its own scrolling.

Pop-ups

A pop-up that is convenient on a large screen takes up the whole screen on a phone.

Can't be closed

A 10-pixel close icon in the corner that goes off the edge of the screen is a direct path to closing the tab.

They cover the content

A subscription banner, a chat and a cookie bar together can leave a quarter of the screen for text. Show windows one at a time and no earlier than 20-30 seconds in.

Conclusion

The mobile version is the main version of the site for search and for the customer. Check text, buttons, forms and speed on a real phone, remove horizontal scrolling and intrusive windows, and you will win back some of the traffic that is now going to competitors. More tips are in the article on mobile optimization.

If the site is easier to rebuild than to patch, it makes sense to order turnkey website development with responsive design from the very first mockup. At epic name., website creation and development start with a mobile prototype, and building a website for a business from Moscow or other regions ends with testing on real devices: in the case study of a niche leader, conversion grew 4 times. Website creation and the development of websites with a catalog work the same way.

Web studio prices depend on the number of pages and integrations, so the price of creating and developing a website is calculated after the brief. On a web studio's website, look not only at the price list but also at the portfolio of mobile versions. You can find out the cost of building a website, order a website from a web studio and order turnkey website development after a short call.