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

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

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

И если для вас это звучит как фильм «Армагедон» (в христианстве это означает «конец света»), то вы абсолютно правы. «Конец света» лучше всего выражает чувство, которое издатели и промоутеры получили в связи с падением количества сайтов в результатах поиска.

Что изменилось? А почему сайты испортились?

Посмотрим, что думает по этому поводу Семальт и какое решение предлагают вам эти специалисты.

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

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

Требование перейти к созданию адаптивных веб-сайтов, возможно, застало многих неподготовленных, но в этом требовании Google было много логики и здравого смысла.

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

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

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

Это известное обновление от Google вынудило издателей, и это правильно, адаптировать свой сайт ко всем существующим сегодня устройствам: настольным компьютерам, ноутбукам, смартфонам и планшетам. И если в будущем они изобретут больше устройств, нам также придется адаптировать под них наши сайты.

Это важное обновление Google фактически изменило наше представление о создании веб-сайтов сегодня и возвестило эру Mobile First. Он перешел с ПК на мобильные устройства и является главным приоритетом по простой причине - все больше и больше людей используют смартфоны и все меньше и меньше компьютеров.

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

Во-первых, важно проверить, адаптивен ли уже ваш сайт. Вы можете проверить это в тесте на дружелюбие, предлагаемом Google, здесь: https://search.google.com/test/mobile-friendly

Просто введите URL страницы, которую хотите проверить, и дождитесь результатов анализа.

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

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

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

Создание адаптивных веб-сайтов также предполагает особый дизайн кнопок и ссылок. Очень важно подумать о пользовательском опыте и взаимодействии пользователей со ссылками и интерактивными кнопками. [Примечание: информацию о работе по поисковой оптимизации и продвижению веб-сайтов см. В Search Console в разделе «Удобство использования мобильных устройств»]. Убедитесь, что кнопки на смартфонах достаточно большие, по крайней мере, для большого пальца. Кроме того, убедитесь, что на них легко нажимать мышью при просмотре настольных компьютеров или ноутбуков.

Создание адаптивных веб-сайтов также требует разбавления информации. Я просто приведу вам пример: во время создания вы столкнетесь с текстами, которые вы должны оставить в поле зрения смартфона. Однако те тексты, от которых вы отказались при просмотре смартфона, будут приняты во внимание при просмотре планшетов, настольных компьютеров и ноутбуков. Невозможно разместить всю информацию и контент, которые у нас есть на удобном для компьютера сайте, на удобном для смартфонов сайте. Необходимо внести тонкие настройки, которые сделают сайт работоспособным даже на мобильных смарт-устройствах.

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

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

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

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

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

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

Как я уже отмечал в верхней части статьи, однажды утром вы проснулись и заметили, что ваш сайт в поисковой системе становится все ниже и ниже. Но вы не знаете, чем именно объясняется этот факт. Правда, этому может быть несколько причин. Однако первый вопрос, который вам следует задать: соответствует ли мой сайт последним критериям Google?

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

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