Тендеры и лиды
Информация
С каждым годом мобильные устройства занимают большую долю в интернет-трафике. Наблюдая за рынком и работая над e-commerce проектами, можем уверенно сказать: Mobile First уже не опция, а базовое требование. Компании, которые игнорируют мобильную версию сайта, теряют клиентов и уступают конкурентам.
В этой статье разберем, когда стоит начать разработку с мобильной версии, какие плюсы и минусы у этого подхода, а также рассмотрим реальный кейс cosmetika.ru, где Mobile First дал отличные результаты.
Mobile First – это подход к проектированию цифровых продуктов, при котором разработка начинается с мобильной. То есть сначала создается интерфейс, оптимизированный под смартфоны, и только после этого для десктопов.
В отличие от классической схемы (где сначала разрабатывается десктопный дизайн, а затем «сжимается» под мобильные экраны), Mobile First ориентирован на пользовательские сценарии в условиях ограниченного пространства и внимания.
Отличие между десктопной разработкой и Mobile First
Отзывчивый дизайн (responsive) – динамическое изменение структуры страницы в зависимости от ширины экрана без необходимости в отдельных макетах.
Пример отзывчивого дизайна
Адаптивный дизайн подразумевает создание набора фиксированных макетов для разных диапазонов экранов. Сайт «загружает» нужный макет в зависимости от устройства: смартфона, планшета или ноутбука.
Отличия адаптивного от отзывчивого дизайна
Оба метода направлены на то, чтобы обеспечить корректное отображение сайта на разных устройствах. Mobile First – это стратегия, когда меняются приоритеты: сначала создается мобильная версия, затем остальное. В этом случае нет ощущения неполноценности сайта.
Чтобы понять, почему Mobile First стал «базой», достаточно взглянуть на цифры. За последние пять лет мобильные устройства закрепились как основной способ потребления цифрового контента, и эта тенденция только усиливается.
По данным Statista, в четвертом квартале 2024 года мобильные устройства (исключая планшеты) составляют 62,54% мирового трафика веб-сайтов.
Процент посещаемости сайтов с мобильных устройств с 1-го квартала 2015 года по 4-й квартал 2024 года
Согласно ежегодному отчету Global Digital Report помимо трафика, растет и глубина взаимодействия: взрослые пользователи интернета в среднем проводят в сети 6 часов 38 минут в день, из них почти 4 часа (3:56) — на мобильных устройствах.
Среднее количество времени пользователей в интернете ежедневно с 3 квартала 2022 по 3 квартал 2024 года
Также DataReportal сообщает, что в России мобильные устройства продолжают доминировать. В 2025 году 95,5% интернет-пользователей выходят в сеть через мобильные телефоны.
Доля интернет-пользователей 16+, которые используют устройства для доступа в интернет
Тренд последних лет сохраняется, доля мобильного времени продолжает и будет расти. В сфере e-commerce основной трафик и значительная часть покупок происходят через мобильные браузеры и приложения. Пользователь знакомится с брендом не через поисковик и сайт, а через соцсети, рекламу, маркетплейсы, и все это в мобильной версии.
Вот несколько ситуаций, когда Mobile First — действительно правильное решение.
Это легко проверить в Яндекс.Метрике или Google Analytics. Если большинство пользователей пользуется мобильной версией, логично начинать с нее.
Данные из Яндекс.Метрики: распределение визитов по операционным системам
Например, если 62,6% визитов поступает с Android устройств, еще 16,2% с iOS, в сумме – более 70% трафика с мобильных устройств, начинать разработку с мобильной версии более чем оправдано.
Также пользовательский путь включает несколько устройств: человек начинает знакомство с продуктом на смартфоне, пролистывает карточки товаров, добавляет в избранное или корзину, а финальное оформление заказа выполняет уже с десктопа. Учитывайте это при анализе поведения, подходите к продукту с точки зрения сквозного пользовательского опыта, а не только мобильного или только десктопного.
Когда нужен простой и быстрый пользовательский сценарий: покупка товара, бронирование, заказ доставки, заявка или подписка. Люди делают подобные действия на ходу – мобильный формат подходит.
Например: курьеры, водители, охранники, офисные работники, студенты, которые делают все через телефон. Такой аудитории неудобно использовать десктоп.
Логика изначально должна рождаться в мобильной среде. Даже если сначала будет PWA, а не нативное приложение, Mobile First тут безальтернативен.
Наша система сама подберет вам исполнителей на услуги, связанные с разработкой сайта или приложения, поисковой оптимизацией, контекстной рекламой, маркетингом, SMM и PR.
Заполнить заявку
13203 тендера
проведено за восемь лет работы нашего сайта.
Это не очевидно, но если нужно выпустить MVP быстро и с минимумом затрат, мобильная версия позволит обойтись без адаптивной верстки под десятки экранов. Один продуманный мобильный экран работает лучше, чем универсальный «на все случаи».
Если же у вас сложный B2B-сайт с многоуровневым каталогом, важнее обеспечить удобство работы на десктопе, а мобильную версию сделать вспомогательной.
Рассмотрим плюсы разработки сайтов с мобильной версии.
Проектируя интерфейс сначала под мобильные устройства, сразу учитываете ограничения экрана и возможности пользователя. Крупные шрифты и кнопки, минимум визуального шума помогают сделать интерфейс лаконичным и интуитивным.
Напомним, что с 2019 года Google использует Mobile First Indexing, т.е. оценивает сайт по мобильной версии. Если она удобная и быстрая – сайт выигрывает в поисковике.
Мобильная версия требует легкой графики и компактного кода, что снижает время загрузки страниц и влияет на удержание пользователей на сайте.
Пользователи охотнее взаимодействуют с контентом, если легко читается и удобен с телефона.
Если начать с «меньшего», проще масштабироваться вверх на планшеты и десктопы. Это логичнее, чем «ужимать» сайт под мобильный формат.
Хотя у Mobile First множество преимуществ, но и недостатки тоже присутствуют.
Мобильные интерфейсы визуально схожи: карточки товара, кнопка «в корзину», минимум текста. Это хорошо для юзабилити, но плохо для брендового и визуального разнообразия, дизайн становится однотипным и менее выразительным.
Из-за дефицита пространства на экране приходится отказываться от второстепенных функций, которые на десктопе могли бы сосуществовать.
Если товар или услуга требует сравнения характеристик или чтения технической информации (например, бытовая техника, электроника, медицина), мобильный формат проигрывает:
Процессы вроде расчета доставки и настройки параметров товара на мобильных устройствах требуют больше усилий пользователя. В таких случаях десктопный формат удобнее и эффективнее, особенно если это первая покупка или клиент не знаком с интерфейсом.
Если большинство аудитории — офисные пользователи, работающие за десктопами (CRM, ERP, консоли), то начинать с мобильной версии нецелесообразно.
Мы проанализировали поведение пользователей на сайте Cosmetika.ru — интернет-магазине профессиональной косметики и выяснили, что более 80% пользователей заходят на сайт со смартфонов. Это стало ключевым фактором при выборе стратегии разработки.
На основе аналитики выделили наиболее востребованные экраны: главную страницу, каталог, карточку товара и оформление заказа. В первую очередь оптимизировали их под мобильные версии страниц, чтобы обеспечить пользователям быстрый и удобный доступ к информации.
Пример реализации главной страницы и карточки товара в мобильной версии
Оптимизация сайта под реальные сценарии использования дала ощутимый эффект:
А на мобильных устройствах результат оказался более заметным, количество отказов снизилось с 15% до 10%.
Спрос на мобильные покупки в России будет только расти и вот почему:
Компаниям, работающим в онлайн-торговле, стоит заранее позаботиться об удобстве мобильной версии.
Подход Mobile First работает эффективно там, где соответствует поведению пользователей. Если в B2C-сегменте мобильный трафик составляет более 70%, а пользовательские сценарии простые и быстрые – начинать с мобильной версии логично. Это позволит улучшить вовлечение и увеличить конверсии.
В то же время, если продукт требует вдумчивого оформления заказа, десктопная версия по-прежнему играет ключевую роль. Но и в этом случае игнорировать мобильную аудиторию нельзя. Адаптация под смартфоны должна быть заложена изначально.
Получите максимум практического контента и реальных кейсов по разработке цифровых решений и автоматизации бизнес-процессов на нашем сайте: https://webest.ru/
