Закрыть
E-mail:
Пароль:
Забыли пароль?
В каталоге проекта: 11 037 веб-студий, 924 CMS, 215 687 сайтов.
РегистрацияCMS MagazineВход
CMS Magazine CMS Magazine

5 причин отказаться от адаптивного дизайна

Предисловие редакции

Дорогие друзья, обращаем ваше внимание на то, что данная статья была опубликована еще в 2013 году. В то время доля мобильного трафика не превышала 28% от общего. При этом уже в 2015 году она приблизилась к отметке в 60%.

Безусловно и сейчас наличие адаптивного дизайна не является универсальным рецептом на все случаи жизни. Однако очевидно, что в данный момент соответствие стандартам Mobile Friendly является жизненно необходимым для подавляющего большинства сайтов.

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

Отдельно отметим, что адаптивный дизайн — весьма широкое понятие. Ознакомиться с его разновидностями и узнать подробности можно в нашем Адаптивном словаре.

Рич Брукс основатель The Marketing Agents, онлайн-издания для предпринимателей, стремящихся привлечь новых клиентов и получать большую прибыль благодаря мобильному маркетингу и продвижению в поисковых системах и социальных сетях.

Адаптивный дизайн — популярное направление веб-дизайна, но подходит ли он вам?

К 2014 году более половины трафика будут генерировать мобильные устройства. Если веб-ресурс не будет под них оптимизирован, пользователи будут бежать с такого сайта, как от чумы.

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

Если вы раздумываете над созданием адаптивного сайта, следующий текст поможет вам принять верное решение.

Необходим сайт, мобильное приложение, услуги по SEO или контекстной рекламе? Тендерная площадка WORKSPACE поможет выбрать оптимального исполнителя. База проекта насчитывает более 10 500 агентств. Сервис работает БЕСПЛАТНО как для заказчиков, так и для исполнителей.

Что такое адаптивный веб-дизайн?

Адаптивный веб-дизайн (responsive web design, RWD) — это подход к разработке сайтов, согласно которому ресурс должен быть удобным для просмотра с любого устройства, независимо от размера экрана, будь то настольный компьютер, мобильный телефон или планшет, существующее устройство или то, что появится только в будущем.

Помните, как нам говорили, что CD-диски не царапаются?

Адаптивный дизайн может дать многочисленные преимущества, но абсурдно предположение, что он подходит для всех веб-проектов.

Нет единственного тарифного плана, диеты или религии, которые подходили бы для всех, так почему мы должны верить, будто существует универсальный подход к редизайну сайта?

Ниже — пять причин отказаться от адаптивного дизайна при разработке вашего следующего проекта.

1"Сначала займитесь мобильной версией" — глупый совет

  • Надпись на доске: «Сначала мобильные пользователи»

«Сначала — мобильные» («Mobile first») — боевой клич дизайнеров, применяющих RWD. Он призывает начинать разработку с версии для мобильных устройств и только потом создавать сайт для других платформ.

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

Годами я убеждаю предпринимателей, что, хотя им и нужен контент, оптимизированный для поисковых систем, Google никогда не станет их клиентом. Писать тексты нужно, ориентируясь на идеального клиента, а только потом проверять, «понимают» ли их поисковые системы.

То же правило верно и для мобильного веб-дизайна: сначала проектируйте для пользователей, затем — для платформы. Просто не забывайте, что пользователь мобильного устройства может решать задачи (поиск адресов, телефонных номеров), отличные от тех, которыми тот же самый человек занимается, сидя за компьютером (более глубокое изучение веб-ресурсов).

2Зачастую адаптивный дизайн приводит к неоправданному увеличению времени загрузки сайта на мобильных устройствах

Концепция RWD подразумевает, что пользователи всех платформ получают одинаковый контент, оптимизированный под конкретные разрешения экранов.

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

Длинная страница с одной (или даже двумя) боковыми колонками, которая прекрасно смотрится на экране настольного компьютера, на узком — в одну колонку — экране телефона превращаются в упражнение, от которого сводит пальцы. В результате у пользователей остаётся неприятное впечатление от использования мобильного ресурса.

Изображения, оптимизированные под настольные компьютеры, — ещё одна проблема. По словам Хуана Пабло Сармиенто (Juan Pable Sarmiento),

«это наиболее проблемный аспект адаптивного веб-дизайна, так как масштабирование „десктопного“ изображения для отображения на экране мобильного устройства предполагает загрузку изображения, оптимизированного для экрана настольного компьютера. Для просмотра полноразмерных изображений на мобильном устройстве приходится загружать неоправданно большие файлы и изменять их размеры под свой экран».

3Пользователи не смогут посмотреть полную версию

  • «Мобильная версия | Переключиться на полную версию»

На большинстве неадаптивных мобильных сайтов внизу страницы присутствует опция «Переключиться на полную версию» или другая аналогичная кнопка. Она позволяет посетителям просматривать сайт для настольных компьютеров, минуя таблицы стилей для мобильной версии.

Мы, специалисты в области RWD, самонадеянно полагаем, будто лучше знаем, что нужно пользователям. И если дизайнер выполнил свою работу, необходимость в полной версии сайта отпадает.

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

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

4У вас отличный сайт

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

Помните: «Сначала — мобильные».

Для сайтов, которые уже достаточно эффективны, есть альтернативы получше. Можно создать мобильный сайт (который, разумеется, имеет свои недостатки), чтобы сохранить существующий ресурс в его нынешнем виде, и просто перенаправлять пользователей смартфонов на мобильную версию сайта.

Для сайта, построенного на платформе WordPress (на этой популярной CMS работает каждый шестой сайт в мире) можно установить плагин WP-Touch. Сайт flyte new media использует этот плагин, чтобы сделать просмотр сайта более удобным для мобильных пользователей.

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

А с выходом WP-Touch Pro появилась возможность разрабатывать сервисы, ориентированные на пользователей планшетов.

Нам удалось создать отличный сервис для наших мобильных пользователей, затратив лишь часть бюджета, который бы потребовался на создание адаптивного сайта.

5Мобильный трафик вашего сайта невелик

Нет никакой гарантии, что к 2014 году более половины пользователей вашего сайта будут просматривать его с мобильных устройств.

Определённые отрасли могут ожидать серьёзного притока мобильного трафика в ближайшее время (например, туристические порталы, онлайн-магазины и новостные сайты). Однако в других отраслях у предпринимателей будет больше времени для манёвра.

Единственный способ узнать точные цифры — зайти в Google Analytics и посмотреть, какая доля трафика вашего сайта приходится на мобильных посетителей, и с какой скоростью растёт их число.

Я не предлагаю вам прятать голову в песок! Я говорю о том, что бизнес-решения надо принимать, исходя из того, какую пользу они принесут вашему делу, а не фирме, занимающейся веб-разработкой.

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

Думаете, я один придерживаюсь такого мнения? Вот несколько авторов, согласных с тем, что адаптивный дизайн не так уж безупречен.

Выводы и пояснения

Как некоторые из вас могли заметить, сайт The Marketing Agents имеет адаптивный дизайн.

О ужас!

Я не пытаюсь внушить вам, будто RWD не может быть хорошим решением, но говорить, что это правильный выбор для всех — все равно, что утверждать, что все должны ездить на Prius из-за экономичного расхода топлива. Попробуйте продать эту машину главному подрядчику, работающему на стройплощадке, или маме, которая по очереди с соседями должна возить шестерых детей на тренировку по футболу.

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

Но сейчас нельзя забывать и о других способах создания мобильных сайтов.

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

Если вы думаете, что автор этого поста сошёл с ума, дайте знать об этом в комментариях.

Рич Брукс (Rich Brooks

Неадаптивный веб-дизайнер

От редакции



 

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

Лидеры рейтинга знают лучше всех, каким именно образом решить вопрос удобства работы с сайтом мобильных посетителей и в каких случаях действительно стоит им пожертвовать, а в каких – нет.

Чтобы у вас была только достоверная и объективная информация, для составления этого рейтинга мы ежегодной изучаем десятки тысяч сайтов, запущенных в Рунете.

Автор: Рич Брукс (Rich Brooks), перевод: Proactivity

Оригинал: http://www.themarketingagents.com/responsive-design-problems

Комментарии экспертов

Андрей Рыжкин

Компания: AGIMA
Должность: Руководитель отдела разработки

Говорить «нужно делать только адаптивные сайты» или «не нужно делать адаптивные сайты» —глупо, так говорят только фанатики. Они исходят не из здравого смысла, а из каких-то своих безосновательных побуждений.

То же самое я часто наблюдаю и при упоминании подхода mobile first: иногда он оправдан (например, если 90% аудитории — мобильная или когда вам просто важно разработать функционал именно под мобильных пользователей), но иногда нужно начинать именно с десктопов. Те, кто применяет только mobile first, просто «потому что он есть», а не потому, что того требует здравый смысл — тоже являются фанатиками, из-за которых появляются противники у responsive web design, готовые часами с пеной у рта ломать копья в бесконечных спорах. Конечно, если пытаться использовать RWD везде, где нужно и где нет — это ни к чему хорошему не приведет. Особенно, если делать это бездумно.

Основной постулат, который мы проповедуем, как компания, продвигающая адаптив на российском рынке веб-разработок — думать! Думать постоянно: нужно ли на этом проекте применять адаптив? Если да, то как это сделать правильно? На каких breakpoint’ах остановиться? С чего начать проектирование (mobile first или desktop first)? Какие технологии следует применить?

Часто адаптивным пытаются назвать сайт, в котором используется одна единственная технология — media queries, тогда как настоящий адаптивный сайт может (и должен) включать в себя уйму параметров:

  • серверная адаптация изображений — это позволит не грузить мобильным пользователям полновесные десктопные изображения, а пользователям экранов с высокой плотностью пикселей — насладиться всей мощью своего дисплея;
  • серверная адаптация layout’a — если какие-то блоки мы все-таки скрываем, логично это делать при помощи сервера, чтобы не отображать лишние элементы разметки пользователям и не заставлять их грузить такие ценные на мобильном интернете килобайты;
  • адаптировать также нужно и интерфейс:
    • o по очевидным причинам нельзя оставлять элементы, работающие по наведению;
    • o различные карусели нужно адаптировать под touch;
    • o нельзя заставлять пользователя бесконечно скроллить разросшуюся за счет перемещенных блоков страницу;
    • o в тоже время нельзя и оставлять его без доступа к нужному контенту, нельзя просто скрывать его: контент должен быть доступен, при необходимости.

Таких нюансов, которые нужно учитывать при разработке адаптивного сайта — очень и очень много. Мы потратили достаточное количество времени на изучение и эксперименты, прежде чем научились делать продуманные адаптивные сайты.

Решение о том, делать или не делать адаптивный сайт должно быть взвешенным. Возможно, вашему бизнесу нужен именно мобильный, а не адаптивный сайт. А может ему вообще нужно мобильное приложение или вам и вовсе еще рано выходить на мобильный рынок, несмотря на повсеместное растущее потребление интернета с мобильных устройств.

Настоящий адаптивный сайт не будет ни в чем уступать мобильному сайту. Наоборот, он будет превосходить его, ведь мы получаем не статичный, а динамичный сайт. К тому же, он будет уже заранее адаптирован к будущему. Future-friendly web, как мы называем это в агентстве AGIMA. Не важно, какое устройство выйдет завтра — ваш сайт, если он сделан правильно, будет отображаться на нем корректно.

Если Вы хотите дать экспертный комментарий к статьям, публикуемым на CMS Magazine, следите за анонсами материалов в нашей группе в Facebook.

Комментарии (Facebook)

Рекомендуем:

Комментарии (8)

Гость      Создано: 1.8.2013, 5:26          

Маладца, Максимка.

Этот иностранец, уже имея свой собственный АДАПТИВНЫЙ сайт.
И говоря об этом открыто. Называет для конкурентов 5 причин.
По которым ИМ адаптивный сайт пока делать НЕ НУЖНО.
Типа. Чуваки, вы подождите делать, не торопитесь.
Настоящий БРИТАНСКИЙ УЧЕНЫЙ.

Кто не знает, есть такая пословица про малый бизнес.
Вопрос: Как стать владельцем МАЛОГО бизнеса?
Ответ: Купите БОЛЬШОЙ бизнес и немного подождите.
Время - деньги. А в интернет-бизнесе промедление смерти подобно.

Я могу назвать еще несколько причин.
Почему в РУНЕТЕ некотрым заказчикам. Тем, кто в танке.
Пока не нужно делать сайты с RWD (адаптивный дизайн)
- это сложно, трудно найти квалифицированную студию.
- студии не хотят RWD осваивать. Таити, Таити, не были мы не в какой Татити. Нас и здесь неплохо кормят.
- заказчик уже понаделал мобильный дизайн, потратил деньги, а тут все переделывать.

Ждите ребята, ждите.
КОГДА СПЯЩИЙ ПРОСНЕТСЯ.

Неизвестный      Создано: 1.8.2013, 10:51          

Поддерживаю предыдущщий коментарий
От себя немного добавлю.

Адаптивный RWD дизайн - вещь новая, и многие заказчики просто могут не знать, что это за зверь.
Ведь CMSmagazine читают не только крутые веб-разработчики.
Но и крутые заказчики. С деньгами, но разбирающиеся больше в собственном бизнесе. А в веб-дизайне надеющиеся на профессионализм веб-студий.

Увидеть, адаптивный сайт или нет, проще простого. Никаких эмуляторов. Здесь и сейчас. Просто сожмите окно браузера своего большого компютера-десктопа. До ширины мобильника, или планшета. Например с 1200 до 800 или 600 pix. Если дизайн изменился, меню залезло под навикон (такая иконка - скрытое меню 3 полоски), картинки увеличились и выстроились вертикально, значит дизайн RWD адаптивный. Если ничего не изменилось, а внизу появилась полоса прокрутки - дизайн простой, не адаптивный.

Английский перевод немного точнее. Адаптивный дизайн называется responsive - отзывчивый дизайн. Пользователю мобильного не нужно загружать специальную мобильную версию сайта. И переключаться Мобильная Тема - Обычная Тема, чтобы посмотреть весь контент. Дизайн Отзывается и подстраивается. И не под конкретное мобильное устройство, которые проектируют и выпускают все новые и новые. А просто под размер экрана. 480, 600, 800, 960 pix. Поэтому на экранах даже с малым разрешением все будет видно. И не нужно вправо-влево скроллить огромный сайт, хорошо смотрящийся на десктопах.

Кроме мобильной версии, есть другой подход, чтобы большой, десктопный сайт работал на мобильнике. Специальные программы, которые переделывают сайт в мобильный.
Производители таких программ предоставляют их производителям CMS для сайтов.
Например
Онлайн конструктор Weebs использует программу DudaMobile
Интернет-магазин OpenCart использует MobiCart
Интернет-магазин CS-Cart использует собственную разработку Twigmo.
Однако, за использование такой программы платит владелец сайта. В случае интернет-магазинов, плата зависит от количества товаров.

Мобильных клиентов становится все больше. Как их заполучить для увеличения продаж. Выбор владельца бизнеса. Разработчики предлагают разные подходы к решению этой задачи.

Андрей      Создано: 6.8.2013, 18:37          

Интересная статья, Раз такое дело то и мне хотелось бы привести пример адаптивного дизайна на русском языке, Вот сайт - http://www.autoscar.ru/ - ни в коем случае не реклама, просто реально удобно заходить с разных устройств, планшет или сматрфон, так же разные форматы экрана, к стати там даже рекламные блоки адаптивные.

Анатолий      Создано: 14.4.2015, 12:22          

я посмотрел он работает не корректно

Елена      Создано: 6.9.2014, 22:24          

А вот как адаптивный дизайн выглядит в работе у нас — журналкрым.рф , можно его посмотреть с любого устройства, планшета, смартфона, или любого другого разрешения экрана, и даже с Motorola 176x220. Рекламные блоки на сайте также адаптивные.

Спасибо за статью и возможность прокомментировать! Удачи!

lakispy      Создано: 13.11.2014, 15:13          

О чем статья то была, я что-то суть не уловил. О том что адаптивный сайт нужен НЕ ВСЕМ, или не всем нужен АДАПТИВНЫЙ САЙТ... не всем нужен смартфон, не всем нужен интернет, не всем нужно читать... адаптивный дизайн это удобство посетителя, он нужен всем сайтам и тчк

Pazys      Создано: 31.3.2015, 11:34          

У автора статьи (Рича Брукса) адаптивный сайт.
"Внешне это безобидный совет, но правда заключается в том, что дизайн должен разрабатываться в первую очередь для пользователей."
Да ладно? А мы обычно для обезьян/котов/микроволновок делаем.
"Если у вас отличный сайт, который привлекает посетителей, генерирует лиды и приносит пользу бизнесу, то при переезде на адаптивный сайт вам, скорее всего, всё придётся начинать с нуля."
Да ладно? Адаптивность сотрет тексты/картинки/urlы?

Чушь

Алексей      Создано: 16.5.2015, 14:01          

Просто время движется вперед. Еще через пол года статью нужно будет удалить. Иначе ее просто будут транслировать по юмор-каналам!!!


CMS Magazine CMS Magazine
RSS-подписка комплексные решения
CMS Magazine CMS Magazine
CMS Magazine