Мобильная версия сайта, адаптивный сайт или мобильное приложение? Честно разбираем плюсы и минусы
Если вы как этот витязь, не знаете что выбрать, боитесь коня потерять, трафик угробить и получить негатив от клиентов — скорее читайте нашу статью. Сравниваем три варианта адаптации своего продукта под мобильные устройства: мобильную версию сайта, сайт с адаптивной версткой и мобильное приложение.
Привет! На связи команда Workspace – площадки для быстрого проведения тендеров на диджитал-услуги.
Что выбрать, мобильную версию сайта, адаптивный сайт или приложение? Сегодня по полочкам разбираем преимущества и недостатки.
Сайт с адаптивной версткой
Адаптивная верстка или адаптивный дизайн – это способность сайта корректно отображаться на устройствах с разными разрешениями экранов.
Преимущества сайта с адаптивной версткой
- Простота в разработке.
Сейчас адаптивность по умолчанию поддерживают все популярные CMS и даже конструкторы сайтов, которые не требуют навыков программирования. То есть, любой человек может за пару дней освоить конструктор Tilda и своими силами сделать простенький одностраничник с адаптивным дизайном. Даже Google рекомендует делать адаптивные сайты, потому что это проще, чем создание отдельной мобильной версии.
- Экономия.
Сайт создается сразу и для смартфонов, и для компьютеров. Разработка отдельного мобильного сайта включает в себя больше трудочасов, нежели работа с адаптивной версией. Разработка мобильного приложения стоит дороже всего.
- Универсальность.
Адаптивный сайт создается таким образом, чтобы корректно работать на любом устройстве. Мобильные версии сайта и мобильные приложения рассчитаны только на использование со смартфонов.
Недостатки сайта с адаптивной версткой
- Медленная загрузка страницы.
Мобильная версия сайта будет содержать меньше контента, чем адаптивный дизайн и загружаться быстрее. Мобильные приложения будут работать еще быстрее: основная часть контента хранится в памяти смартфона.
- Сайты со сложным интерфейсом невозможно адаптировать.
Для таких сайтов, как «ВКонтакте», нужно создавать отдельный интерфейс под мобильные устройства – перетаскиванием блоков и изменением размера шрифтов тут не отделаться. Любой многофункциональный сайт со сложным интерфейсом требует наличия отдельной мобильной версии или приложения.
- Хорошая адаптивность тоже требует проработки.
Адаптивность бывает разной по качеству исполнения. Например, кто-то просто задает отступы у полей, отчего блоки вроде как и помещаются в любые экраны, но смотрятся некрасиво в определенных разрешениях. Такую верстку называют «резиновой».
Вы можете сами изучить, как реализована адаптивная верстка на разных сайтах. Для этого откройте с компьютера любой сайт и попробуйте поиграться с шириной окна браузера.
У сайтов с качественной адаптивной версткой контент будет менять внешний вид и местоположение в зависимости от изменения ширины экрана. Такая функция достигается с помощью внедрения «брейкпоинтов» – диапазонов ширины экрана, под которые подстраивается контент. Чем лучше проработана адаптивная верстка, тем больше будет вариаций адаптивного дизайна под различные диапазоны. Здесь речь идет не только о смартфонах с разными диагоналями, но и больших экранах с разрешением 4K (3840 на 2160 пикселей).
Мобильная версия сайта
Мобильная версия сайта – это отдельный сайт, предназначенный специально для смартфонов и планшетов. Его размещают на поддомене основного домена. Как правило, это выглядит так: если адрес основного сайта – site.com, то у его мобильной будет адрес m.site.com. Обычно мобильная версия сайта лишена большого количества функций в угоду скорости и хорошему юзабилити для устройств с маленькими экранами.
Пользователи смартфонов отправляются на мобильный сайт автоматически. При переходе на сайт браузер пользователя отправляет HTTP-запрос, в котором есть строка с данными user-agent – идентификатором браузера и операционной системы его устройства.
А так выглядит десктопная версия – в ней гораздо больше функций и у нее более сложный интерфейс:
Преимущества мобильной версии сайта
- Скорость.
Мобильные версии сайтов в разы легче, чем сайты с адаптивной версткой.
- Возможность тонкой настройки юзабилити.
Мобильные сайты разрабатываются полностью с нуля, благодаря чему его функционал и дизайн будет лучше проработан, чем у сайта с адаптивным дизайном.
- Возможность включить полную версию сайта с мобильного устройства.
Эта функция зависит от разработчиков, но в большинстве случаев на мобильном сайте есть кнопка для перехода на десктопную версию. Ее добавляют для ситуаций, когда на сайте нужно осуществить какое-то действие со смартфона «через костыль».
- Экономия трафика. Мобильные сайты легковесны и будут «съедать» немного килобайт у людей с мобильным тарифом, в котором нет безлимитного интернета.
Недостатки мобильной версии сайта
- Дороже в разработке, чем адаптивная версия сайта.
На разработку адаптивной верстки уходит гораздо меньше времени, чем на создание отдельной мобильной версии сайта. Создание мобильной версии сайта включает в себя отдельные работы по прототипированию, программированию, тестированию и SEO. Еще для мобильной версии сайта понадобятся дополнительные серверные мощности. Такие вложения должны быть оправданы.
- Сложности, связанные с SEO.
Для поисковых систем мобильная версия сайта – отдельный сайт. При разработке сайта нужно будет провести ряд дополнительных манипуляций, чтобы мобильная и десктопная версия сайта подкрепляли друг друга в поисковой выдаче. И то, эти работы не дадут такой же положительный эффект, как разработка единого сайта с адаптивным дизайном, который принимает и десктопный и мобильный трафик.
Какие SEO-работы нужно будет проделать при разработке мобильной версии сайта:
- Определить канонические страницы с помощью HTML-атрибутов rel=canonical и rel=alternate. Эти атрибуты нужны, чтобы указать поисковым роботам, какие страницы дублируются. Если этого не сделать, роботы могут воспринимать одну страницу как ненужную копию другой и пессимизировать ее в выдаче, что негативно повлияет на позиции сайта в целом. Такими атрибутами нужно будет «обвесить» весь сайт.
- Создать файлы robots.txt и sitemap.xml для мобильной версии сайта. Robots.txt содержит разрешения для обхода сайта поисковыми роботами, а sitemap.xml содержит XML-карту сайта, которая позволит поисковым роботам сориентироваться в его структуре и проиндексировать все страницы.
Мобильное приложение
Создание приложений на Android и iOS обладают своими преимуществами и недостатками.
Преимущества мобильных приложений
- Возможность внедрить практически любой функционал.
Изобретательность разработчиков ограничивают только характеристики производительности смартфонов владельцев и возможности их операционных систем. Можно хоть вставить онлайн-игру внутрь приложения магазина: главное, чтобы она решала бизнес-задачи.
- Скорость работы.
Основная часть файлов мобильного приложения будет загружена на смартфон пользователя, за счет чего можно достичь более быстрой работы приложения. Быстродействие сервера будет зависеть от его мощности и архитектуры – тут как у сайтов.
- Отправка push-уведомлений.
Приложения могут отправлять push-уведомления, за счет чего у бизнеса появляется еще один канал для связи с клиентом. Например, с помощью push-уведомления можно реактивировать старого клиента, отправив ему скидку или промокод. Но есть проблема: большое количество пользователей отключает push-уведомления.
- Удержание клиента.
Грамотно спроектированное приложение будет лучше удерживать пользователя, чем сайт. Если человек удосужился скачать на свое устройство ваше приложение, он уже к вам достаточно лоялен. Клиента нужно удерживать и дальше, внедряя программы лояльности, предлагая участие в закрытых скидках, высылая ему полезный контент и так далее.
Недостатки мобильных приложений
- Бесполезность для десктопных устройств и смарт-устройств.
Мобильные приложения не нужны ни компьютерам, ни умным телевизорам.
- Дорогая стоимость разработки.
Нативная разработка на Android и iOS обойдется дороже, чем создание мобильной версии сайта. Разработка мобильного приложения должна быть оправдана достижением конкретных бизнес-задач.
- Пользователям нужно установить приложение.
Людям будет лень искать и скачивать какое-то приложение в аппсторе. Чтобы это произошло, их нужно будет дополнительно мотивировать: например, дарить промокод за установку. Если у вашего бизнеса большая аудитория, а приложение будет качественным продуктом, расширяющим возможности сайта на смартфонах, тогда его будут качать сами по себе. Но активировать аудиторию маркетинговой акцией все же стоит.
- Своя специфика в продвижении продукта.
Есть свои инструменты для продвижения мобильных приложений: например, ASO. Чтобы успешно зарелизить мобильное приложение и выполнить план по аудитории, нужно будет привлекать специалистов, которые специализируются на мобильном продвижении. На рынке больше специалистов, которые занимаются продвижением сайтов: приложения появились позже и их меньше. Поэтому найти специалистов на продвижение мобильного приложения труднее.
Подытожим
- Сайт с адаптивной версткой создать проще всего, но качественный адаптив тоже потребует хорошей проработки.
- Мобильная версия сайта потребуется, если у десктопной версии сайта сложный интерфейс, который не получится «переложить» на экраны мобильных устройств без отсечения лишних функций.
- Мобильные приложения работают быстрее всего и лучше удерживают пользователей, но их разработка обходится дороже всего, а еще нужно мотивировать клиентов скачать приложение.
Я считаю, что если функционал который подразумевает сайт состоит в чем-то большем чем просто представительская функция (ИИ калькуляции, сбор данных, т.д. да что угодно кроме сайта-визитки), то в таком случае имеет смысл делать мобильное приложение в дополнение, сайту. Другими словами я хочу сказать что у всего есть свое предназначение. Выбирать между мобильной версткой или мобильным приложением опираясь лишь на показатели стоимости глупо. Так же категорически не согласен с утверждением что мобильная разработка "дорогая", все всегда зависит от самого проекта, но в отличии от разработки функциональных сайтов, дата центров ну или любых других крупных а то есть затратных проектов, мобильной версткой занимаются максимум 3 человека на команду + 1 ui/ux дизайнер опционально. В сравнении с теми же софтверными разработчиками где 4 человека это минимум, и стоимость человекачасов разработчиков приложений намного ниже., в результате я бы сказал что достаточно затратно и одно и другое, но мобильная разработка явно дешевле, по любым расценкам.
Тимур, большое спасибо за ваш опыт и дополнение!
Нужно и приложение (для постоянных клиентов) и адаптивный сайт для тех, кто просто зашел с телефона
да все нужно, со всех возможных источников собирать трафик. вопрос лишь в соотношении затрат к эффективности выполнения поставленной цели данной компании.
Пока не начнешь воплощать, эффективность и затраты будут не понятны
Так обычно дома строят, которые потом недостроенными годами стоят. Огромная коробка без отделки и всего остального, только один сплошной пеноблок.
Если эффективность и затраты не понятны, то либо это стартап либо плохо посчитали.
Порой бизнес вообще не считает или не готов платить, чтобы подсчеты произвели. Методом проб и ошибок, по наитию
Denis вы говорите о супер редких случаях, когда компания - первопроходец. Если же ты не придумываешь что-то супер уникальное, и при этом тебе не понятные расходы - то ты долбаеб. конченный. Не конкретно вы, а все те кому "непонятны" расходы. А с долбоебизмом работают очень просто - уволен и все.
Хотя если вам не понятны ваши расходы а вы не создали уникальное предложение при этом, тогда да ты тоже долбаеб
Timur, судя из вашего "смелого" ответа, вы - "мыслитель", который не имеет представления, как работает большинство бизнеса: малый, крупный. Вы бы офигели, когда увидели как компании с миллионными оборотами ведут учет в тетрадках или экселе. Ну да ладно. Вам же лучше знать, вы же, наверное, самый умный)))
Для малого бизнеса приложения хороши для внутреннего пользования сотрудниками – чтобы оптимизировать, например, процессы по продажам, логистике или т.д. Принуждать заказчиков устанавливать свое приложение по силам только очень мощным брендам или компаниям с уникальным предложением.
Ну принуждением наверное мало чего можно добиться :) А вот грамотно продать, убедить в преимуществах - это да.
Кстати, если вам нужен крутой подрядчик или идеи для собственного проекта, рекомендуем изучить списки финалистов конкурса Workspace Digital Awards - https://workspace.ru/awards/cases/?stage=shortlist. Все кейсы как на подбор, главное - выбрать максимально похожий на вашу задачу. Если агентство уже запускало успешные проекты, аналогичные вашему, значит, и с вашим справится.
Просто выбирайте нужную категорию и номинацию. Наверняка найдете что-то полезное.
В большинстве случаев достаточно адаптивного сайта.
У многих и этого нет. До сих пор есть сайты, где даже прайса нет или он в xml файле
Внятный подрядчик всегда сам подскажет, какой вариант для конкретного заказчика наиболее подходящий. Другое дело, что надо хотя бы примерно сориентироваться в начале к кому именно идти - мобильным или веб-разработчикам.
Как по мне прежде всего должен быть удобным сайт и мобильная версия сайта,а вот приложение не всегда обязательно ,просто задолбало уже наличие 150 приложений на телефоне,которыми ты пользуешься раз в пару месяцев и то не факт
Сложно спорить. Приложение действительно должно быть нужным пользователю, а не просто "чтобы было" еще одна иконка на экране.
Статья рассказывает о выборе между мобильной версией сайта, адаптивным сайтом и мобильным приложением
Саммари:
- Адаптивность: легко создать, экономно, универсально
- Медленная загрузка и сложный интерфейс - минус адаптивности
- Моб. версия: быстрая, настраиваемая, с выбором полной версии
- Разработка моб. версии дороже, SEO сложности
- Приложения: функциональны, быстры, с push-уведомлениями
- Разработка приложений - дорогая, нужно скачивание
- Акцент на продвижении приложений через ASO
Стараюсь выделять самое важное для вас.
Не могу понять, кто-то тестирует или рекламирует бота?)
нейросеточка, наверное)
Раз, два, три, четыре, пять,
Вышел ботик погулять.
Шесть, семь, восемь, девять, десять,
Поиграем мы с ним вместе.
Имя на бота у тебя больше похоже 😜
ds2p8q5zeeeaqsyazdzqzb7mx1hnxqnmk
Ага, щас
НейроСветочка 😄
Почему сразу бот?
А кто?) И что у вас за стратегия, расскажите, любопытно. Вы так презентуете свои услуги - комментируя новые статьи на VC?
Ну да. Людям полезно - мне приятно.
Вам приятно, без сомнений. Но давайте спросим у читателей, им это было полезно?
Спросите
Ваш самари бездумно подитоживающий некоторые очень спорные пункты самой статьи, при этом вырванные из контекста, в купе с публикацией от имени вашего бизнес акаунта - выглядят не адекватно.
Это ваше мнение
Из вашего самари можно сделать выводы, что разработка приложений дорогая по тому что нужно скачивание. shame
Есть решение. Надо с безлимитным интернетом скачивать разработку приложений, а не через мобильный.
А ты хорош! xD
Из вашего комментария можно сделать выводы, что вам лишь бы докопаться. И что?
Какое счастье, что года три назад нам, наконец, удалось уговорить бигбосса нашей маленькой уютной компании заказать мобильную версию.
О, расскажите же скорее - почему он не хотел и что поменялось, когда заказали?
Спасибо за развернутый обзор! Решение о мобильной версии сайта, адаптивном дизайне или разработке мобильного приложения требует внимательного анализа и понимания потребностей аудитории