как сайт адаптировать под телефон
3 способа быстро адаптировать сайт под мобильные устройства
Google объявил, что с 21 апреля в поисковый алгоритм будет включен фактор дружественности сайта к мобильным устройствам. Повлияет это нововведение на основную выдачу Google или только на результаты мобильного поиска, будет видно позднее.
А пока мы советуем нашим клиентам и читателям задуматься об адаптации своих сайтов под мобильные устройства и предлагаем несколько способов сделать это быстро.
Оно мне надо?
Ответ на этот вопрос можно найти, проверив, как ваш сайт отображается в следующих сервисах тестирования Google:
Если вы видите подобное сообщение — статья для вас:
Адаптивный дизайн
В каких случаях подойдет? Если у вас сайт-визитка, информационный сайт, блог, одностраничник, интернет-магазин (с простой структурой, дизайном и/или небольшим ассортиментом), сайт услуг или форум.
Как реализовать?
Можно смело брать один из CSS-фреймворков (bootstrap, responsivegridsystem, Sceleton и пр.) и адаптировать существующий дизайн. Либо используйте CSS3 Media Queries.
Например, если использовать фреймворк bootstrap, то вам понадобится, вкратце:
Или же в таблице стилей выделить через медиа-запросы (CSS3 Media Queries) несколько разрешений и задать оптимальные размеры элементов страницы, например:
Некоторые элементы, которые актуальны для мониторов, можно, а иногда и нужно будет скрыть для мобильных устройств либо вместо них выводить другие, более компактные.
Плюсы данного метода: быстрая реализация для перечисленных типов сайтов.
Минусы: скрипты и стили, которое не используются на мобильной версии, но используются на десктопной, все же будут подгружаться и влиять на время загрузки.
Что мы получим?
Сайт, который будет доступен со всех устройств, дизайн будет узнаваем на всех этих устройствах, только элементы будут сдвигаться по вертикали. Некоторые элементы не будут отображаться на мобильных устройствах (и наоборот) либо будут отображаться в более компактном виде.
И рассмотрим пример. Меню для устройств с экраном более 768px выглядит так:
А для экранов менее 768px выглядит так (в свернутом виде):
И так, при клике на иконку в правом углу (в развернутом виде):
Отдельный шаблон для мобильных устройств на основном домене
В каких случаях подойдет? Практически для любого информационного сайта, блога, форума, в том числе для интернет-магазинов. Для визитки отдельный шаблон уже будет лишним.
Как реализовать?
Нужны знания php и база основных устройств для их определения и вывода соответствующего шаблона. Т.е. нужно написать скрипт, который будет определять тип устройства и выводить для него соответствующий шаблон.
Отдельно стоит упомянуть о CMS. Если ваш сайт на WordPress, то о вас уже позаботились, и можно обойтись установкой плагинов для адаптации сайтов под мобильные устройства.
Среди них: WPTouch, WordPress Mobile Pack, WP Mobile Detector и т. д. Все эти плагины имеют несколько тем оформления и дополнительные полезные фишки вроде сбора статистики по мобильным пользователям.
Также в настройках этих плагинов есть возможность установить, какие блоки будут отображаться в мобильной версии сайта, а какие нет. Есть возможность добавлять свой логотип, что помогает пользователям, зашедшим на ваш сайт с мобильного устройства, идентифицировать ваш сайт.
Плюсы: В случае с плагинами — очень быстрый и простой способ реализации, быстрее, чем адаптивная верстка. В случае создания отдельного шаблона для сайта — возможность упростить дизайн сайта, уменьшить количество активных элементов, т. е. сделать сайт «легче».
Минусы: не для всех CMS есть такие плагины, да и не всегда они корректно работают. Бывает, что сайт хорошо отображается на моб.устройствах, но при этом по скорости не лучше, а даже хуже, чем его полная версия. Стоит отметить, что иногда бывают баги в определении мобильного устройства, если это какой-то редкий телефон, и в этом случае на таком устройстве будет отображена полная версия сайта.
Что мы получим?
Сайт для мобильных устройств будет доступен по тому же адресу, что и основной сайт, только шаблон его будет существенно отличаться от шаблона основного сайта, он будет значительно упрощен, но все-таки узнаваем.
Рассмотрим пример сайта с установленным плагином, который адаптирует его под мобильные устройства.
Например, вот так сайт выглядит на ПК:
А вот так выглядит этот же сайт на мобильном:
Мобильная версия сайта на поддомене
В каких случаях подойдет? Для интернет-магазинов, каталогов, интернет-порталов, социальных сетей.
Как реализовать?
Этот вариант похож на предыдущий, также достаточно трудоемкий в плане реализации. Но для больших интернет-магазинов с огромным ассортиментом – единственный выход.
Немного подробнее о реализации: создается поддомен, на нем такой же движок, как и на основном домене, но база данных используется одна на оба сайта (чтобы в случае внесения каких-либо изменений, не пришлось их добавлять дважды). При заходе с мобильного устройства происходит перенаправление пользователя на поддомен. В качестве имени поддомена обычно используют варианты: m.sitemane.com, mobile.sitename.com, pda.sitename.com и пр.
Примечание (спасибо читателям за вопрос): Чтобы обезопасить себя от проблем с дублированием контента, ознакомьтесь с рекомендациями Google и Яндекс.
И снова хорошая новость для владельцев сайтов на WordPress – есть плагины, которые создают мобильную версию вашего сайта на поддомене, например, WP Mobile Edition.
Плюсы данного метода: Можно существенно облегчить дизайн сайта для мобильных устройств, что хорошо скажется на его скорости.
Минусы: нужно создавать поддомен и настраивать его, писать для него отдельный шаблон и скрипт, определяющий, с какого девайса зашел пользователь, а это дольше, чем создание адаптивного дизайна.
Что мы получим?
Дополнительный адрес сайта на поддомене ”m.” с отличным от основного домена дизайном, упрощенным. В сети примеров такой реализации полно, вот, например, известный всем сайт:
Если вы определились с выбором и заказали один из методов реализации, не забудьте при приеме работ проверить, как ваш сайт отображается на мобильных устройствах и в онлайн-тестах Google.
Пришла с небольшими знаниями в настройке, установке и принципах работы нескольких CMS. С тех пор «обросла» знаниями и опытом в разработке сайтов на следующих CMS, PHP и JS/CSS-фреймворках: WordPress, Joomla, Bitrix, MODx, Drupal, Codeigniter, Laravel, Bootstrap.
Разрабатывает, дорабатывает, перерабатывает и адаптирует сайты.
Девиз: если очень захотеть, можно в космос полететь
Полное руководство по адаптации сайта под мобильный трафик
Вы прекрасно знаете, зачем необходимо адаптировать сайт под мобильный трафик, правда? Вот вам еще одна причина: Google уже в ближайшее время будет отмечать на странице выдачи значком Mobile-friendly удобные для просмотра на маленьких экранах смартфонов и планшетов ресурсы. Сам по себе значок ничего не значит. Вот что важно: его обладатели получат трафик сайтов, которые не адаптированы под мобильные гаджеты.
Хотите выигрывать в постоянной борьбе за посещаемость? Тогда вам пригодится полное руководство по адаптации сайтов под мобильный трафик.
Что случится, если вы проигнорируете интересы мобильных пользователей
По данным comScore, в январе 2014 года доля мобильного трафика в США впервые превысила долю посещений сайтов с десктопов. По данным Kokoc Group, в России ситуация отличается: по состоянию на середину 2014 года около 80 % пользователей посещали сайты с помощью стационарных компьютеров, включая ноутбуки. Однако в рунете существует выраженная тенденция роста мобильного трафика. Обратите внимание на график использования операционных систем отечественными пользователями.
Рост частоты использования ОС Android впечатляет, правда? Кстати, вы можете быстро определить долю мобильных пользователей своего сайта с помощью системы Google Analytics. Для этого:
Поисковые системы не могут не учитывать интересы мобильных пользователей. Поэтому они лишат вас трафика, если вы не сделаете сайт удобным для использования с помощью планшетных ПК и смартфонов. Вы потеряете многих пользователей навсегда: исследование компании Equation Research показывает, что 46 % пользователей никогда не возвращаются на сайт, если первый опыт его посещения с помощью мобильного гаджета оказался неудачным. Наконец, эффективность вашего ресурса будет постоянно падать: существующие пользователи не смогут участвовать в дискуссиях, оформлять заказы, подписываться на рассылку и совершать другие действия, если воспользуются смартфоном или планшетом.
Не нравится такая перспектива? Тогда адаптируйте сайт под мобильный трафик.
К чему стремиться: признаки mobile-friendly ресурса
Когда вы заходите на недружественный к мобильным пользователям сайт с помощью смартфона, то сразу это понимаете. А каким объективным признакам соответствует адаптированный под маленькие экраны ресурс? Они перечислены ниже:
Как добиться этого на практике? Читайте дальше.
Шаг 1: убедитесь, что используете mobile-friendly дизайн
Откройте свой сайт с помощью смартфона или планшета и оцените удобство его использования. Если у вас нет под рукой мобильного гаджета, воспользуйтесь инструментом Screenfly. Он позволяет оценить внешний вид сайта на экранах разных девайсов. Достаточно ввести URL ресурса в адресную строку и выбрать гаджет в горизонтальном меню.
Если вы видите, что сайт нуждается в адаптации под мобильный трафик, вам придется выбрать один из двух вариантов: создание мобильной версии сайта или использование адаптивного дизайна.
Мобильная версия сайта
Мобильная версия сайта — это выбор для владельцев интернет-магазинов, веб-сервисов, больших сайтов. Вы можете обратиться к веб-разработчикам и попросить их о помощи. Если вы используете WordPress, то у вас есть возможность создать мобильную версию сайта самостоятельно в несколько кликов. Для этого можно воспользоваться плагинами:
Вы можете самостоятельно найти плагины, позволяющие быстро адаптировать под мобильный трафик ресурсы, работающие на Joomla, Drupal и других популярных CMS.
Адаптивный дизайн
Адаптивный дизайн обеспечивает корректное отображение сайта на экранах гаджетов с разным размером экранов. Вы можете обратиться к веб-разработчикам или установить шаблоны с адаптивной версткой для популярных «движков».
Отдельного упоминания заслуживают два преимущества адаптивного дизайна перед мобильной версией сайта. Во-первых, сам Google рекомендует использовать адаптивную верстку. Во-вторых, этот способ адаптации под мобильный трафик позволяет сохранить единый дизайн сайта при отображении на экране любого гаджета.
Шаблоны для WordPress с адаптивным дизайном доступны на сайте WordPress.org.
Шаг 2: замените ссылки на «тапабельные» кнопки
Когда владельцы мобильных гаджетов попадают на неадаптированные сайты, у них немедленно развивается так называемый синдром толстых пальцев. Не спешите открывать медицинские справочники, этот сленговый термин не имеет отношения к болезням. Юзабилисты описывают этим синдромом ошибки, возникающие у пользователя при попытке нажать на ссылку или элемент навигации.
Какой размер должна иметь кнопка или элемент навигации, чтобы ей успешно пользовался мобильный пользователь? Ориентируйтесь на следующие рекомендации:
Обратите внимание, владельцы мобильных гаджетов не могут комфортно использовать сайт, если в тексте есть слишком много ссылок, которые расположены близко друг от друга.
Как создать mobile-friendly кнопки и элементы навигации
Вы можете заказать функциональные кнопки с индивидуальным дизайном или воспользоваться шаблонными инструментами. Если вы используете WordPress, обратите внимание на следующие плагины:
Шаг 3: убедитесь, что используете удобные формы
Для чего нужен мобильный трафик? Правильно, чтобы конвертировать его в подписки, заказы продуктов и т.п. Владельцы сайтов очень часто используют в качестве конверсионных элементов различные формы. Представьте, что бывает, если формы не адаптированы для заполнения на мобильном гаджете.
Как проверить, адаптированы ли формы на вашем сайте под мобильный трафик? Да очень просто: зайдите на сайт с помощью смартфона или планшета и попробуйте заполнить форму. Если вам приходится увеличивать форму, вы не можете понять, какие данные необходимо вводить в то или иное поле, значит, форма не подходит для мобильного сайта.
Вы можете заказать разработку удобных форм для мобильного сайта, а также воспользоваться шаблонными решениями для популярных CMS.
Шаг 4: предложите пользователям читабельный контент
Пользователи мобильных гаджетов с небольшими экранами чаще всего выходят в интернет, чтобы решить какую-то конкретную задачу: сравнить цены на продукт в разных магазинах, найти контактные данные продавца, прочитать инструкцию по использованию медицинского препарата. Они попадают на ваш сайт благодаря понятному и привлекательному заголовку. На сайте они должны найти адаптированный для чтения с маленького экрана контент.
В английском языке есть слово snackable (от англ. «снэк» — закуска). Контент для мобильных пользователей должен быть snackable: удобным для быстрого чтения или даже поверхностного сканирования на ходу.
Удобный для чтения с мобильного экрана контент соответствует следующим характеристикам:
Шаг 5: адаптируйте электронные письма к чтению с маленького экрана
Адаптировать Email к чтению с экранов мобильных гаджетов можно с помощью следующих инструментов для рассылки:
Выбрав почтовый сервис, убедитесь, что вы сделали все, чтобы ваши письма читали.
Присоединяйтесь к мобильной эволюции и не теряйте трафик
Интернет медленно, но верно становится мобильным. Еще Дарвин установил, что в процессе эволюции выживают наиболее приспособленные виды. Если вы хотите победить в соревновании за трафик, у вас есть только один выбор: адаптировать сайт к чтению с экранов мобильных гаджетов.
Заказать адаптивную верстку сайта вы можете в нашем агентстве. Все подробности читайте по ссылке.
Как адаптировать сайт под мобильные устройства: методы и примеры
Что такое адаптивный сайт
Адаптивность – это функция интернет-страницы, которая позволяет ей корректно отображаться на различных устройствах.
Полноформатные страницы просматриваются не только на экранах персональных компьютеров, но и на смартфонах, планшетах. Разрешение на компьютере не соответствует формату, к которому привыкли глаза владельца смартфона: изображение кажется мелким и для прочтения приходится увеличивать текст вручную. Все это создает неудобство для пользователя.
Для чего нужна адаптация
Адаптация сайта для мобильных устройств нужна, чтобы сделать формат страницы более удобным для пользователей. Она отвечает за решение таких проблем, как: полоса прокрутки, неудобство ссылок, неправильное расположение отдельных элементов, слишком мелкий шрифт.
Адаптивность – это способ привлечь новую аудиторию, обеспечив пользователям с мобильными устройствами удобство в пользовании сайтом.
Поисковые системы и ранжирование
В таких поисковых системах, как Яндекс и Гугл, адаптивность — один из факторов, влияющих на позицию сайта в поисковике, так как это в первую очередь критерий удобства для пользователей.
Для анализа поисковые системы используют быстрое закрытие страницы. Если пользователь закрывает страницу сразу после ее открытия, то его не устроил формат отображения. Такие страницы теряют свои позиции в топе.
Влияние на конверсию
Конверсия в интернет-маркетинге – это соотношение числа пользователей страницы, выполнивших на нем какие-либо действия, к общему числу заходивших на сайт.
Адаптивность страницы для мобильных устройств напрямую влияет на конверсию, потому что многие клиенты совершают операции через смартфоны. Удобное расположение кнопок, правильный размер шрифта и эстетический дизайн увеличивают активность пользователя.
Рекламные кампании
Для продвижения своего продукта часто используется реклама, расположенная на других интернет-страницах. При переходе с одного сайта на другой может возникнуть проблема несоответствия форматов. Это оттолкнет пользователя.
В таких случаях адаптивность страницы под различные устройства поможет найти новых клиентов.
Преимущества и недостатки
Преимущества адаптации сложно недооценить:
К недостаткам адаптации сайта можно отнести:
Адаптация — это стратегическое бизнес-решение, которое хоть и потребует дополнительных затрат времени и средств, но будет полезно.
Принципы адаптации
Базовые идеи, которые лежат в основе адаптации сайтов:
Методы
Как адаптировать сайт? Есть три варианта адаптации, которые используют программисты. Это адаптивный дизайн, мобильная версия, динамическая демонстрация. 
Адаптивный дизайн
Этот метод простой и быстрый. HTML-код остается одинаковым для полноформатной и для мобильной версии. Меняют дизайн страницы : для мобильной версии увеличивают размер текста, горизонтальные блоки сдвигают по вертикали, мелкие боковые части убирают или скрывают.
Для этого необходимо открыть доступ к ресурсам страницы, включая параметры CSS, JavaScript, изображения и т.д.
В настройке используется метатег Viewport, который необходимо вписать в код страницы. Он отвечает за настройку ширины экрана для разных устройств, не используя при этом переадресацию.
После внедрения мета-тега, нужно вписать в код свойства и инструкции CSS, настроить CSS-фреймворк, создать разметку.
Мобильная версия
Отличие этого метода от предыдущего состоит в том, что фактически создается новая страница с отдельным кодом и другим адресом. Мобильный сайт базируется на поддоменах, поэтому обычный пользователь может и не заметить небольшие изменения в адресе сайта. Неудобств для него это не создает.
Основная проблема – поисковики могут идентифицировать оба сайта как дубликат и не выводить один из них в топ, записав в спам. Чтобы этого не случилось, нужно применить в коде для изначальной версии тег Link rel=»alternate» и указать ссылку на мобильный вариант.
Помимо мобильной версии можно создать мобильное приложение. Это подойдет для интернет-магазинов с большим количеством товаров, привлечет больше пользователей и упростит работу компании.
Динамическая демонстрация
Динамическая демонстрация – это смешанный вариант предыдущих методов. При ней сохраняется единый для стандартной и мобильной версий адрес, но меняется HTML-код. Меняется формат и масштаб показа мобильной версии, но элементы не сдвигаются. В коде прописывается HTTP-заголовок Vary.
Как сделать адаптацию сайта самому
Сделать сайт адаптивным будет проблематично, так как для качественной работы требуются изменения в коде. Однако можно воспользоваться конструкторами, которые предлагают сервисы Tilda и Adobe Muse.
Адаптивный сайт на Тильде
Генератор сайтов Тильда имеет специальный конструктор для адаптации сайтов под мобильные устройства. Эта функция платная.
Плюсы работы с Тильдой:
Работа с Adobe Muse
С марта 2020 года Adobe Muse больше не поддерживается. Пользователям предлагают альтернативные варианты программ.
Онлайн-сервисы для создания сайта для мобильных устройств
Существуют онлайн-сервисы, которые помогут в адаптации сайта для мобильных устройств:
Плагины для оптимизации сайта для мобильных устройств на WordPress
Существует несколько плагинов на WordPress, которые позволят владельцу сайта без дополнительных настроек, установить мобильную версию для сайта:
Проверка адаптивности сайта
После того, как будет создана мобильная версия сайта, ее необходимо проверить на адаптивность для исключения ошибок в настройках.
Сделать это можно через сервис Google Mobile Friendly или нажав клавишу F12, выбрав «Дополнительные инструменты», «Инструменты разработчика».
Если вы используете браузер Mozilla Firefox, то проверить сайт на адаптивность можно нажав клавишу F12, выбрав «Меню», «Разработка», «Адаптивный дизайн».
Серверы покажут как пользователи мобильных устройств видят сайт.
Заключение
Адаптация сайта для мобильных устройств играет важную роль в привлечении новых клиентов. При правильной оптимизации профиля сайт выйдет в топ у поисковых систем, появятся новые пользователи и вырастут продажи.
10 способов адаптации вашего сайта под мобильные устройства
Ваш веб-сайт уже оптимизирован под мобильные устройства? Если еще нет — это не конец света. Современные браузеры содержат такие нововведения, как пинч-зум и автоматическая регулировка размера шрифта.
Если у вас нет времени или денег, чтобы оптимизировать ваш сайт под мобильную среду — вот десять простых вещей, которые вы можете сделать прямо сейчас, чтобы у « мобильных » посетителей сайт выглядел прилично.
1. Установите правильные атрибуты полей форм
Если вы используете на сайте поля ввода для имени пользователя или адреса, выключайте autocorrect и включайте autocapitalize :
Если не сделать так, то система автоматизированного ввода Т9 будет заменять имена, к примеру, “ Erwan ”, на что-то вроде “ Erevan ”.
Установка автоматического использования первых заглавных букв в типах words освободит пользователей от необходимости каждый раз включать капитализацию букв – то есть каждое слово будет начинаться с большой буквы (к примеру “ Ken burns ” станет “ Ken Burns ”):
Подумайте обо всех подводных камнях, с которыми пользователь может столкнуться на вашем сайте.
2. Задайте подходящую для мобильных устройств ширину
Откройте ваш сайт в браузере вашего компьютера и уменьшайте ширину окна программы до тех пор, пока не сможете что-либо прочитать в нем.
Это и будет минимально допустимой шириной. Берите текущее значение ширины и устанавливайте его в свойство @viewport путем установки тега meta в заголовок страницы head :
В следующий раз, когда ваш сайт будет открыт на мобильном устройстве, будет автоматически установлена указанная вами ширина. Посетителю сайта не придется пользоваться зумом:
Эта картинка демонстрирует лишнее место справа:
А эта картинка показывает правильно установленное значение ширины.
3. Установите ширину картинок в 100%
Теперь, когда ваш сайт имеет определенную ширину, некоторые изображения станут очень широкими. Этого не случалось ранее, потому как разрешения десктопных мониторов довольно широки и большинство картинок помещаются по ширине:
Если вы переживаете, что изображение станет менее четким, то вы зря волнуетесь. На современных мобильных устройствах такого не произойдет.
4. Установите ширину полей ввода в 100%
При просмотре сайта с мобильного устройства этот параметр не даст полям input выйти за пределы экрана.
5. Будьте бдительны когда используете Disable для кнопок подтверждения отправки форм
Чтобы избежать многочисленных нажатий на кнопку подтверждения отправки формы, стоит делать submit неактивным после первого клика по ней.
В отличие от настольных устройств мобильные часто теряют связь с сетью. Если вы делаете кнопку не активной, пользователь не сможет нажать ее повторно. И в этой ситуации имейте в виду, что причиной подобной ситуации может стать не только потеря сети.
Во время входящего звонка браузер мобильного устройства закроется. И далее ситуация с заблокированной кнопкой подтверждения повторится. Пользователь не сможет отправить уже заполненную форму.
И если вы все-таки решили деактивировать кнопку submit — делайте это на несколько секунд.
6. В длинных строках используйте word-wrap
Иногда бывает необходимо отобразить длинные строки, такие как примеры кода, ссылки, номера банковских счетов. Если ваш сайт окажется узким для того, чтобы целиком показать строку, она может « уехать » за пределы экрана мобильного устройства:
7. Будьте осторожны, используя пробелы
Обычной практикой при отображении длинных строк является использование пробелов через каждые пять знаков. Так пользователю будет удобнее запоминать их для ввода в другое приложение.
Однако умный пользователь не будет делать этого вручную. Он воспользуется буфером обмена. Однако в случае с пробелами ему придется их удалить. Насколько удобно и быстро удалять пробелы на мобильном устройстве?
Дабы избежать подобных ситуаций, вместо пробелов между группами символов используйте отступы:
Как видите, « пробелы » между символами остаются, но с тем отличием, что при копировании-вставке нет нужды что-то удалять. Как минимум, это удобно и экономит время!
8. Преимущества медиа-запросов
Вы можете создать пользовательские стили, которые будут работать только при просмотре сайта с мобильных устройств (или же отображаться в маленьком окне браузера), а на настольном компьютере сработает обычный вариант веб-страницы. Используйте для этого целевые стили внутри медиа-запросов как в примере ниже:
Теперь вы знаете еще один трюк, который поможет вашему сайту выглядеть лучше на мобильном устройстве.
9. Избегайте fixed позиционирования
Когда вы делаете разметку подобным образом, ваш заголовок будет увеличиваться вместе со страницей и, возможно, займет все пространство экрана:
Самое простое решение — не использовать фиксированные позиции элементов для отображения на мобильных устройствах.
Пример ниже, использующий метод медиа-запросов, покажет, как воплотить это в жизнь:
10. Используйте стандартные шрифты
Применение пользовательских шрифтов придает сайту вид профессионально выполненного продукта, но пользователям приходится подгружать файлы со шрифтами. Выполняется это перед тем, как сайт отобразится на устройстве.
Как правило, объем подобных файлов достаточно велик. На мобильном устройстве этот процесс может занять большое количество времени. В это время на экране мы видим незаполненное пространство вместо текста:
В случае использования Google Font Loader для загрузки шрифтов вы сможете отобразить текст с помощью стандартного шрифта, пока грузится пользовательский. Затем вы генерируете страницу заново, и отображается нужный вам шрифт.
Это будет наилучшим вариантом. Пользователь читает текст пока шрифты грузятся, и наслаждается красотой по окончанию их загрузки. Вот код:
Заключение
Эти десять небольших трюков помогут вам преобразить уже существующий сайт. Они избавят ваших посетителей от многих мучений при пользовании вашей страницей. Не откладывайте в долгий ящик, начните применять их прямо сейчас.