Телефон: 8-800-350-22-65
WhatsApp: 8-800-350-22-65
Telegram: sibac
Прием заявок круглосуточно
График работы офиса: с 9.00 до 18.00 Нск (5.00 - 14.00 Мск)

Статья опубликована в рамках: Научного журнала «Студенческий» № 6(134)

Рубрика журнала: Информационные технологии

Скачать книгу(-и): скачать журнал часть 1, скачать журнал часть 2, скачать журнал часть 3

Библиографическое описание:
Абдуллин Т.Р. СРАВНЕНИЕ РЕШЕНИЙ ДЛЯ МОБИЛЬНЫХ УСТРОЙСТВ В ВЕБ // Студенческий: электрон. научн. журн. 2021. № 6(134). URL: https://sibac.info/journal/student/134/203692 (дата обращения: 23.12.2024).

СРАВНЕНИЕ РЕШЕНИЙ ДЛЯ МОБИЛЬНЫХ УСТРОЙСТВ В ВЕБ

Абдуллин Тимур Рамилевич

магистрант, отделение информационных технологий и энергетических систем, Набережночелнинский институт Казанского Федерального Университета,

РФ, г. Набережные Челны

АННОТАЦИЯ

Сравнение решений для реализации сайта в версии для смартфона.

 

Ключевые слова: веб, мобильная версия, адаптивный дизайн.

 

Создание удобного и понятного интерфейса серьезный вопрос для владельца интернет-ресурса. Отсутствие мобильной версии может отпугнуть потенциальных пользователей, которые используют смартфоны. Также от наличия удобной версии для мобильных устройств зависит и положение сайта в поисковиках. Мобильная версия сайта представляет собой, по сути, отдельный сайт со своей собственной версткой, заточенной под разрешение экрана смартфона. Он имеет отдельную от десктопной версии сайта ссылку обычно это преписка «m» или «mobile». Большинство гигантов рынка такие как: Вконтакте, Яндекс, Ламода, Туту.ру и другие предпочитают в своих разработках мобильную версию адаптивному дизайну.

 

Рисунок 1. Мобильная версия ВКонтакте

 

Сравнивая версии сайтов, можно заметить, что на мобильной версии 70% всего экрана выделено под авторизацию пользователя. Сделано это с целью облегчить авторизацию пользователя социальной сети. Также эта страница намного легче десктопной версии, связано это с несколькими факторами.

- Пользователи смартфонов используют для подключения мобильный интернет, трафик которого не всегда является безлимитным.

- Количество устройств огромное множество, все они имеют разную мощность. Чтобы привлечь максимальное количество пользователей следует принести красоту в ущерб производительности. Очевидно, что наличие удобной версии сайта для мобильных устройств аккумулирует большее количество клиентов, но и повлечёт увеличение бюджета на разработку интернет-магазина. По сути, создавая мобильную версию сайта создается новый сайт. Это подразумевает под собой перенос контента, создание новой верстки, больше количества работы SEO оптимизаторам.

Адаптивный дизайн. Если же владелец не желает тратиться на разработку мобильной версии ему может подойти адаптивная верстка. Ее суть проста, в обычную верстку сайта прописываются условия для верстки на смартфонах. Это гораздо дешевле мобильной версии. Веб-ресурс адаптируется под размеры экрана без переноса на отдельный адрес. Этот тот же самый контент без сокращений, что и на основном ресурсе, просто сверстанный в другом порядке.

 

 

Рисунок 2. Пример адаптивного варианта для смартфонов

 

Алгоритмы Google очень любят адаптивный дизайн по ряду причин:

- Продвигается только один сайт в поисковой системе;

- Googlebot быстрее и исправнее сканирует страницы с адаптивной версткой; - пользователям проще расшаривать контент, если он находится на одном URL.

Но есть и значительные минусы у этого решения: - Страница становится очень тяжелой после прогрузки всего html кода и контента с ним. Страница имеет тот же вес, что и десктопная версия сайта.

- Проблемы с самой адаптивностью элементов, у каждого пользователя могут быть разные задачи;

- Нет возможности перейти на десктопную версию в мобильном браузере.

Подводя итоги, очевидно, что на дистанции лучшим решением будет создание мобильной версии. Это дороже, тяжелее в поддержке, но это сильно может облегчить и улучшить опыт работы пользователя с ресурсом, чтобы он мог пользоваться снова и снова.

 

Список литературы:

  1. Стив Макконнелл Совершенный код. - СПб: БХВ, 2020.
  2. Адаптивный дизайн [Электронный ресурс] // Википедия. – Режим доступа: https://ru.wikipedia.org/wiki/Адаптивный_веб-дизайн

Оставить комментарий