Как адаптировать сайты для мобильных устройств

0

Автор: SatoMaker | Рубрика: Полезное рядом | 24-07-2015 |

Android-privilege-Escalation-Android-5-Lollipop-620x350

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

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

Первое, что стоит сделать прямо сейчас (если вы еще не удостоверились в корректном отображении сайта с мобильных устройств) – проверить ваш ресурс специальным сервисом от Google: http://www.google.com/webmasters/tools/mobile-friendly/. В результате проверки сайта вы получите заключение, оптимизирован ли сайт для мобильных устройств в глазах Googlebot. Если ресурс окажется не оптимизированным, то вы увидите конкретные замечания по вашему сайту, а также рекомендации по их устранению.

Наиболее часто встречающиеся проблемы:

- не указана область для просмотра с мобильных устройств;

- слишком мелкий шрифт;

-слишком мелкие элементы навигации (ссылки, кнопки и т.д.);

- элементы навигации расположены слишком близко друг к другу.

Большинство популярных CMS предлагает простые решения для устранения проблем и полноценной адаптации для мобильных устройств в несколько шагов. Указания по конкретным CMS можно найти в Руководстве для разработчиков от Google. Подробные руководства можно найти по таким системам, как WordPress, Joomla!, Drupal, Bitrix, Blogger, vBulletin, Tumblr, DataLife Engine, Magento, PrestaShop, Google сайты.

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

- задать область для просмотра с мобильных устройств: чтобы страница «подстроилась» под любой экран можно использовать метатег <meta name=»viewport» content=»width=device-width»>.

- установить базовый размер шрифта 16 пикселей;

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

После выполнения базовых требований следует еще раз проверить ресурс инструментом для вебмастеров от Google и убедиться в корректности отображения сайта на смартфонах.

http://wiki-work.ru

Записи по данной теме:

  • Похожих записей пока что нет :(
Понравилась статья? У Вас есть возможность получать ежедневные обновления блога удобным для Вас способом:
Подписаться на блог 'Сатомейкер' по email

Ваш электронный адрес:

 

 

Подписаться на блог 'Сатомейкер' по email

Подпишитесь через RSS:

 

Добавить в Google

 

Читать в Яндекс.Ленте


Follow Satomaker on Twitter






Ваш отзыв