Адаптивный дизайн сайта

Всем привет. Меня зовут Рома Романов. Я директор компании Honey Hunters Management. И сегодня мы решили снять небольшое короткое видео. Это видео для маркетологов, для специалистов отдела рекламы или для собственников бизнеса. Это видео не для профессионалов программирования. Видео на тему: “Зачем нужен адаптивный сайт или зачем нужен мобильный сайт”. Я хочу немножко рассказать предысторию и рассказать, что это такое вообще адаптивный сайт и с чем его едят, как говорится. 

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

Но, самом деле, на сегодняшний день если посмотреть, то огромное количество сайтов абсолютно не адаптированы, не специализированы каким-то образом под мобильные устройства. И это, конечно, не очень хорошо. На само деле, если судить по нашим клиентам, мы же видим в Метрике наших клиентов. И мы наблюдаем, в течение последних трех лет, например, откуда приходят люди, с каких устройств они смотрят сайты наших клиентов. Мы видим, что сначала, что там было 10% с мобильных устройств, 90% - с компьютеров. Потом мы видели, как этот процент рос. 10, 15, 20 % сейчас в последнее время. Если судить по сайтам наших клиентов, то (самая маленькая цифра) от 25%. Вообще, в основном это 40-50% с сайтов наших клиентов приходят с мобильных устройств и с планшетов. То есть люди смотрят в основном все больше и больше с мобильных устройств сайты. И последние статьи, исследования, которые, например, я где-то встречаю, читаю, изучаю, я вижу, что тренд сохраняется и, конечно, вот уже в 2017 году ожидается, что люди будут, наверное, уже чаще смотреть сайты с телефонов, чем с компьютеров. 

Конечно, этим требованиям над отвечать. Давайте примеры посмотри здесь вот. У меня открыто несколько сайтов. Давайте посмотрим, как не адаптивный сайт выглядит на компьютере и как он выгляди на телефоне. Вот сайт. Один из сайтов. Он не адаптивный. Не адаптирован под мобильные устройства. то есть когда с мобильного устройства мы заходим, то на компьютере, в принципе, всё хорошо видно нормально. Когда мы заходим с телефона, то это примерно выглядит вот так. Или это выглядит вот так. И нам приходится, вы знаете, сталкивались да? Лазить по сайту примерно вот таким вот образом. Или слишком мелко все выглядит, нечитабельно. Это очень неудобно. Соответственно, пользователь, который к вам приходит на сайт (ведь они туда зачем-то приходят), вы заинтересованы в том, чтобы они совершили какое-то действие: звонок, продажу, покупку или вот что-то в этом роде (конверсионное действие какое-то). И вот эти пользователи видят в таком виде сайт. Конечно, им не очень удобно, мягко говоря, с ним работать. 

Давайте посмотрим, как выглядит адаптивность сайта и что это такое. Вот, например, у меня есть два примера. Один сайт - компании Техимпорт. Когда мы заходим компьютера, это обычный сайт. Вот у него меню. Здесь вот контентная область. Но если это мобильное устройство, то видите каким образом сайт перестраивается: вот под планшет, под телефон. То есть меню становится полностью адаптивным под мобильные. Меняется структура сайта, вплоть до размера шрифта для того, чтобы всё это было очень удобно читать, смотреть; чтобы это не тормозило, долго не грузилось. И этот сайт - он будет отображаться одинаково хорошо на любом типе смартфона или планшета. И вот хочу для сравнения вам рассказать про то, как раньше делали (до того, как эта технология Adaptive Design стала популярна или набирать популярность). Это около 3 лет назад, наверное. 2-3  лет назад. Раньше были мобильные версии сайта. Это как второй сайт со своим отдельным адресом. Было обычно m.techimport.ru. И вот эти сайты на одном устройстве могли выглядеть хорошо, а на другом не очень хорошо, потому что у всех устройств разные экраны. И вот там была такая проблема. Сейчас эта проблема решена вот такой технологией. 

Вот, например, можно посмотреть есть тоже ещё один сайт: стоматологическая клиника. Мы видим, как вот это все выглядит вот здесь. И если мы с мобильного устройства заходим, то мы видим другую картинку. Тут же сразу кнопка "Позвонить". Ее можно нажать, и мобильник позвонит. Весь контент выстраивается , сетка меняется, картинки где-то убираются для того, чтобы меньшим объем информации загружен был сайт. Легче грузилось. Где-то они уменьшаются. Это выглядит отлично и очень удобно для работы с мобильного телефона. 

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

Ну вот, наверное, по этой теме все. Сейчас это краткий такой ответ на вопрос. В Honey Hunters Management мы наработали достаточно сильные компетенции на адапте в дизайне. И в разработке мобильных адаптивных версий. 

Если у вас будут какие-то вопросы, вы можете позвонить нам. У нас есть телефон на сайте. Или написать Email. Также подписывайтесь на наши паблики и на Facebook. Мы будем туда время от времени заливать какие-то новости, и вы сможете эту информацию изучать. 

Спасибо большое. До свидания.