«B2B — это десктоп» — это заблуждение 2010-х. В KZ B2B 2026 60-70% трафика идёт с мобильных устройств (наши данные по 11 проектам, 2024-2026). При этом 70% KZ B2B-сайтов имеют плохую мобильную версию: неудобные формы, нечитаемые шрифты, медленную загрузку, и вертикальный скролл на 50 экранов. Конверсия с мобильного ×2-3 ниже, чем с десктопа, — и это прямая потеря денег.
Эта статья — opinion-driven гайд по правильной мобильной версии B2B-сайта в KZ. Расширение гайд по структуре B2B-сайта и материал о лендингу.
TL;DR.
- 65% B2B-трафика в KZ — мобильный (наши данные). Не «десктопный B2B», как думают маркетологи.
- Mobile-First обязателен — проектируем сначала под мобильный, потом расширяем до десктопа. Не наоборот.
- 5 критериев правильной mobile-версии: viewport-meta, размер шрифта ≥16px, кнопки 44×44px, форма в 1 столбик, время загрузки <3 сек.
- 7 типичных ошибок KZ B2B-сайтов описаны в разделе 3.
- Прогноз: фикс mobile-версии → +30-80% конверсии на мобильном трафике.
- Контринтуитивно: упрощение для мобильного улучшает десктоп-версию тоже. Mobile-first сайты обычно чище, быстрее, проще.
1. Почему мобильный трафик в B2B доминирует в KZ
Утверждение «B2B — это десктоп» основано на наблюдениях 2010-х, когда ЛПР сидели в офисах за десктопом. В 2026 всё изменилось:
1. WhatsApp как рабочий инструмент. WhatsApp установлен на 85-95% смартфонов в KZ, и ЛПР пользуются им чаще, чем почтой. Переходят по ссылкам из чата — это мобильный трафик.
2. Telegram вместо email. Руководители среднего звена и IT-директора живут в Telegram. 70% ссылок они открывают с мобильного.
3. Рабочее время в пути. Алматы и Астана — города с пробками 1-2 часа в день. ЛПР изучают сайты в пробке, в метро, на обеденном перерыве — это мобильный трафик.
4. Рост доли мобильного интернета. По нашим наблюдениям, в 2026 году 70%+ интернет-трафика в KZ идёт через мобильные устройства (включая 4G/5G от Kcell, Beeline, Tele2, Altel).
Наша статистика по 11 KZ B2B-проектам (2024-2026):
| Источник трафика | % мобильного трафика |
|---|---|
| Telegram-реклама | 95-100% |
| 2ГИС-клики | 75-85% |
| WhatsApp-рассылки | 90-100% |
| SEO в Яндексе | 60-70% |
| Google Search | 65-75% |
| Email-рассылки | 40-50% |
| Прямой трафик | 60-70% |
| Средний вес | 65% мобильный |
Это означает, что если ваш сайт не mobile-friendly, вы теряете ~65% потенциальных клиентов на этапе первого касания.
2. 5 критериев правильной mobile-версии B2B-сайта
Что должно быть на каждом B2B-сайте для mobile в 2026:
Критерий 1. Viewport-meta и адаптивная вёрстка
Что это: в <head> стоит <meta name="viewport" content="width=device-width, initial-scale=1.0">, а вёрстка использует media queries для адаптации под разные экраны.
Почему важно: без viewport-meta страница отображается как на десктопе 1024px — пользователь увеличивает, скроллит горизонтально, и закрывает.
Как проверить:
- Открыть сайт на телефоне — должны быть все элементы в видимой области.
- PageSpeed Insights → «Адаптивность» → должен быть зелёный.
Критерий 2. Размер шрифта ≥16px
Что это: body-шрифт не меньше 16px, для важного текста 18-20px.
Почему важно: на iOS Safari автоматически увеличивает шрифт меньше 16px, что ломает вёрстку. На Android — мелкий шрифт нечитабельный без зума.
Как проверить:
- Открыть в режиме developer tools.
- Проверить
body { font-size: < ...px }— должно быть ≥16px. - Проверить визуально на телефоне.
Критерий 3. Кнопки и CTA ≥44×44px
Что это: все кликабельные элементы (кнопки, ссылки, чекбоксы) ≥44×44px с отступами 8px+ друг от друга.
Почему важно: на экране 375px (iPhone) попасть пальцем в кнопку 30px сложно. Apple HIG, Google Material Design рекомендуют 44-48px как минимум.
Как проверить: PageSpeed Insights / Lighthouse → «Area too small» warning.
Критерий 4. Форма в 1 столбик
Что это: все поля формы — в 1 столбик, не в 2-3 колонки. На мобильном экране 320-414px горизонтальная форма нечитаема.
Почему важно: 30-50% пользователей закрывают форму, если она плохо выглядит на мобильном. Конверсия падает в 1.5-2 раза.
Как проверить: открыть любую форму на телефоне — все поля должны идти вертикально.
Критерий 5. Время загрузки ≤3 секунды (3G)
Что это: страница загружается ≤3 секунды на медленном 3G-соединении (1.6 Mbps). Это включает:
- LCP (Largest Contentful Paint) ≤2.5 сек.
- FID (First Input Delay) ≤100 мс.
- CLS (Cumulative Layout Shift) ≤0.1.
Почему важно: 53% пользователей закрывают сайт, если он грузится дольше 3 секунд (Google, 2024). Для KZ B2B с мобильным трафиком из пригородов и метро — это критично.
Как проверить:
- PageSpeed Insights (мобильный + десктоп).
- GTmetrix.
- WebPageTest (можно выбрать 3G-режим).
3. 7 типичных ошибок mobile B2B-сайтов в KZ
Ошибка 1. Мелкий шрифт (≤14px)
Симптом: на телефоне текст 12-14px, без зума прочитать нельзя.
Что не так: 70% пользователей не увеличивают — они уходят. Конверсия с мобильного падает в 2-3 раза.
Фикс: body { font-size: 16px } минимум, для длинного текста 18px.
Ошибка 2. Горизонтальная прокрутка
Симптом: страница не помещается по ширине, появляется горизонтальный скролл.
Что не так: элементы фиксированной ширины (таблицы, баннеры с width: 1200px) ломают мобильный вид.
Фикс: адаптивные таблицы (overflow-x: auto), max-width: 100% для изображений и iframe.
Ошибка 3. Кнопки слишком близко
Симптом: две кнопки/ссылки на расстоянии 5-10px друг от друга.
Что не так: пользователь попадает в соседнюю кнопку пальцем, особенно в спешке или на ходу.
Фикс: отступы 8-16px между кликабельными элементами. На длинных списках (faq, footer links) — padding: 12px+.
Ошибка 4. Формы в 2-3 колонки
Симптом: имя и email в одной строке, телефон и должность в другой.
Что не так: на экране 375px нет места для 2-полей в строку — они сжимаются до минимума, ломаются.
Фикс: 1 поле = 1 строка. Все формы в mobile-first варианте вертикальные.
Ошибка 5. Pop-up на весь экран сразу
Симптом: через 5 секунд после загрузки — полноэкранный pop-up «подпишитесь на рассылку» / «получите скидку».
Что не так: на мобильном pop-up закрывает весь контент, и пользователь закрывает страницу. Google это отдельно штрафует (intrusive interstitials).
Фикс: отложенный pop-up через 30+ секунд OR при попытке закрыть страницу (exit-intent). Или вообще без pop-up’а на мобильном.
Ошибка 6. Тяжёлые изображения
Симптом: фотографии команды 5-8 MB, фоновые изображения 3-4 MB.
Что не так: время загрузки 10-15 секунд на 3G. 53% пользователей уходят, если грузится дольше 3 секунд.
Фикс:
- WebP-формат вместо JPEG/PNG (на 30-50% легче).
srcsetдля разных экранов.- Lazy loading для изображений ниже fold’а.
- Сжатие через ShortPixel, TinyPNG, Squoosh.
Ошибка 7. Нет sticky CTA на мобильном
Симптом: форма заявки только в самом низу страницы (после 10 экранов).
Что не так: 70% внимания теряется до того, как пользователь дойдёт до формы. На мобильном скролл медленнее, чем на десктопе.
Фикс: sticky-кнопка внизу экрана (position: sticky; bottom: 0), которая всегда видна. На десктопе — обычная форма или sidebar-CTA.
4. Mobile-first vs desktop-first: почему это важно
В разработке есть два подхода:
Desktop-first (старый подход)
Что: сначала проектируем десктоп, потом адаптируем под мобильный.
Проблемы:
- Десктоп-интерфейсы сложные → на мобильном «обрезаются куски».
- Часто mobile-версия хуже, потому что проектировали без неё в голове.
- Лишние элементы (sidebar, mega-menu, hover-эффекты) не работают на сенсорных экранах.
Mobile-first (правильный подход)
Что: сначала проектируем мобильный (главный сценарий), потом расширяем до планшета и десктопа.
Преимущества:
- Mobile UX приоритезирован — основные сценарии работают хорошо.
- Меньше кода — ненужные элементы просто не добавляются.
- Чище интерфейс — фокус на главном.
- Лучше Lighthouse-метрики — потому что mobile-friendly по умолчанию.
Контринтуитивно: desktop-версия mobile-first сайта обычно тоже лучше, потому что приоритизировано главное и убрано лишнее.
Как проверить, что вы mobile-first:
- Открыть дизайн-макет в Figma — есть отдельные версии для mobile/tablet/desktop.
- CSS написан mobile-first (без
min-widthзапросов для desktop). - HTML структура сначала оптимизирована под mobile.
5. Прогноз после фикса mobile-версии
Методология: основано на выборке 11 KZ B2B-проектов, где мы делали mobile-аудит и фикс в 2024-2026. Диапазон, не точная цифра.
| Тип фикса | Рост конверсии на мобильном |
|---|---|
| Базовый фикс (viewport, шрифт 16px, кнопки 44px) | +20-40% |
| Средний фикс (+ форма в 1 столбик + sticky CTA) | +40-70% |
| Полный mobile-first рефактор (+ размер изображений + lazy loading + speed) | +60-150% |
| Полный mobile-first + PWA | +100-200% (плюс engagement) |
Пример расчёта:
- Сайт KZ B2B-компании — 5 000 визитов/мес, 65% мобильный = 3 250 мобильных визитов.
- Конверсия с мобильного = 0,8% = 26 лидов/мес.
- После фикса mobile-версии конверсия = 1,5% = 49 лидов/мес. +23 лида/мес = +276 лидов/год.
При чеке ₸800k и конверсии 15% в сделку = +41 сделка/год = +₸33 млн дополнительной выручки.
6. 5 практических A/B-тестов для mobile
Тест 1. Sticky CTA
A: форма только в конце страницы. B: sticky-кнопка «Оставить заявку» внизу экрана.
Прогноз: B +25-50% по количеству заявок с мобильного.
Тест 2. Размер шрифта hero
A: заголовок 32px на мобильном. B: заголовок 40px на мобильном.
Прогноз: B +10-30% по конверсии (читаемость = доверие).
Тест 3. Форма vs WhatsApp-кнопка
A: только форма. B: форма + большая WhatsApp-кнопка с прямым контактом.
Прогноз: B +30-70% на мобильном (WhatsApp — рабочий канал KZ B2B).
Тест 4. Длина формы
A: 7-полей на 1 экране. B: 7-полей в 3 шага с прогресс-баром.
Прогноз: B +30-60% по заполнению (многозадачность на мобильном).
Тест 5. Сжатие изображений
A: JPEG 5MB hero. B: WebP 200KB hero с preload.
Прогноз: B +20-40% по рантайму (быстрее загрузка = больше визитов до скролла).
7. Чек-лист mobile-friendly для B2B (12 пунктов)
| # | Пункт | Принимается | Не принимается |
|---|---|---|---|
| 1 | Viewport-meta в <head> | width=device-width, initial-scale=1.0 | Нет или неправильно |
| 2 | Body-шрифт ≥16px | 16-18px на мобильном | 12-14px |
| 3 | Кнопки ≥44×44px | Apple HIG standard | 30-40px |
| 4 | Формы в 1 столбик | Все поля вертикально | 2-3 колонки |
| 5 | LCP ≤2.5 сек (мобильный) | PageSpeed ≥90 | <70 |
| 6 | FID ≤100 мс | PageSpeed ≥90 | >300 |
| 7 | CLS ≤0.1 | Стабильная вёрстка | Скачки |
| 8 | Изображения сжаты (WebP, lazy) | <500KB hero | 5MB hero |
| 9 | Sticky CTA на мобильном | Кнопка внизу экрана | Только в конце |
| 10 | Нет горизонтального скролла | Адаптивные таблицы | overflow-x: scroll |
| 11 | WhatsApp-кнопка (если B2B) | Видимая, быстрый контакт | Только email/форма |
| 12 | Touch-friendly навигация | ≤5 пунктов меню + dropdown | 10+ пунктов с hover |
Если меньше 8 «принимается» — mobile-версия в зоне риска. Если меньше 5 — срочный рефактор.
8. Инструменты для mobile-аудита
| Инструмент | Что проверяет | Цена |
|---|---|---|
| Google PageSpeed Insights | Performance, accessibility, LCP, CLS, FID | Бесплатно |
| Lighthouse (Chrome DevTools) | Полный аудит mobile-friendly | Бесплатно |
| Chrome DevTools (Device Mode) | Эмуляция разных экранов | Бесплатно |
| WebPageTest | Детальный waterfall + Mobile 3G | Бесплатно (basic) |
| GTmetrix | PageSpeed + Lighthouse + waterfall | Бесплатно |
| Mobile-Friendly Test (Google) | Базовая проверка mobile-friendly | Бесплатно |
| MobiReady | Mobile-аудит по W3C | Бесплатно |
Рекомендуемый набор для KZ B2B: PageSpeed Insights + Lighthouse + 5-минутный реальный тест на iPhone/Android — этого достаточно.
9. Mobile-first для разных типов B2B
| Тип B2B | Приоритет mobile | Ключевые фишки |
|---|---|---|
| IT-аутсорсер / интегратор 1С | ⬛⬛⬛⬛⬛ | WhatsApp-кнопка sticky, форма 5-полей в 3 шага, кейсы в карусели |
| Бухгалтерская фирма | ⬛⬛⬛⬛⬜ | «Заказать звонок за 30 сек», отзывы, прайс-лист (мобильный PDF) |
| Юридическая фирма | ⬛⬛⬛⬛⬜ | Категории услуг в виде 4-иконок на главной, форма «Задать вопрос юристу» |
| Таможенный брокер | ⬛⬛⬛⬜⬜ | «Рассчитать стоимость» калькулятор, sticky CTA «Срочный вопрос» |
| Логистическая компания | ⬛⬛⬛⬛⬜ | Отслеживание груза (мобильное), sticky «Получить расчёт» |
| Производственное предприятие | ⬛⬛⬜⬜⬜ | Каталог продукции в PDF, форма для B2B-запроса |
Если чек сделки > ₸1 млн — mobile-first обязателен. Если чек до ₸500k — можно делать облегчённый mobile, но не игнорировать мобильный полностью.
10. Итого: opinion и следующие шаги
Главный тезис: в KZ B2B 2026 мобильный трафик = 65% всех визитов. Если сайт плохо адаптирован, мы теряем большинство потенциальных клиентов ещё до того, как они увидят наш оффер. Mobile-first — это не «опция», а «необходимость».
Что делать на этой неделе:
- Проверить сайт через PageSpeed Insights (мобильный режим) — посмотреть LCP, FID, CLS.
- Открыть на iPhone и Android физически — посмотреть глазами ЛПР.
- Сделать 5 критичных фиксов: viewport, шрифт ≥16px, кнопки ≥44px, форма в 1 столбик, sticky CTA.
- Проверить через Google Mobile-Friendly Test.
- Через 30 дней оценить конверсию на мобильном трафике.
Что в плане по Раздел «Упаковка»):
- Anchor #2.1 (структура B2B-сайта) — опубликован.
- Spoke 2.2 (лендинг для B2B) — опубликован.
- Spoke 2.5 (messaging) — опубликован.
- Spoke 2.3 (формы и квизы) — опубликован.
- Этот материал 2.4 (мобильная версия) — опубликован.
Раздел «Упаковка» = 1 большой гайд + 4 дополнительных материала — теперь полный для этого раздела (включая mobile, формы, лендинг, messaging).
📩 [Email-поле] [Подписаться] или читайте по RSS → /rss.xml
salestack.kz — маркетинг-инженерия для B2B в Казахстане. Методология, цифры, opinion. © 2026.
FAQ
Стоит ли делать отдельное мобильное приложение для B2B?
В большинстве случаев — нет. Mobile-first адаптивный сайт + WhatsApp/Telegram-канал покрывают 95% мобильных сценариев. Отдельное приложение оправдано только для:
- регулярных операций (заказы такси, доставка).
- специфичных функций (интерактивные калькуляторы, встроенный AI).
- аудитории 10 000+ пользователей.
Для KZ B2B с 5-100 контактами в день — не нужно.
Что важнее: mobile-first или desktop-first?
Mobile-first обязателен в 2026. Большинство пользователей — мобильные, поэтому первичный UX должен быть mobile-friendly. Desktop-версия — расширение, а не основа.
Как проверить мобильную версию без телефона?
5 способов:
- Chrome DevTools (F12 → Toggle Device Toolbar → iPhone/Android).
- PageSpeed Insights (мобильный режим).
- Google Mobile-Friendly Test.
- BrowserStack / LambdaTest (онлайн-тест на реальных устройствах).
- Свой телефон — лучший тест, потому что пальцем проверяется UX.
Как сжать изображения для mobile?
3 способа:
- WebP-формат (на 30-50% легче).
- ShortPixel / TinyPNG / Squoosh (онлайн-сервисы).
- Astro Image plugin / Next.js Image (автоматически оптимизирует + lazy).
Методология: обычно конвертируем все hero и кейс-фото в WebP, оставляем JPEG для случаев, когда нужен широкий формат.
Mobile-first ломает SEO?
Нет, наоборот. Google в 2018 перешёл на Mobile-first indexing — индексирует мобильную версию. Если у вас десктоп-only сайт или плохой mobile — вы теряете позиции в Google. Mobile-first — это минимум для SEO в 2026.
Что делать, если сайт уже на десктопе без адаптива?
3 стратегии:
- Полный рефактор на mobile-first дизайн (2-3 месяца работы).
- Постепенный mobile-first patches (адаптивная вёрстка, sticky CTA, шрифты) — 1-2 месяца.
- Параллельный mobile-only лендинг для основной услуги — 2-4 недели.
Для KZ B2B-сайтов с 50+ страниц рекомендую стратегию 2 — постепенный mobile-first патч. Это дешевле и даёт 70% эффекта от полного рефактора.
8 источников
- Salestack.kz — Структура B2B-сайта, которая конвертит, 2026
- Salestack.kz — Лендинг для B2B в KZ, 2026
- Salestack.kz — Формы и квизы для B2B в KZ, 2026
- Google — Mobile-First Indexing Best Practices, 2026
- Web.dev — Core Web Vitals, 2026
- StatCounter — Mobile vs Desktop Traffic Share KZ, 2026
- Datanyze — WhatsApp Business Mobile Adoption KZ, 2026
- Apple HIG — Touch Targets Guidelines, 2026