Старый статичный сайт можно сделать mobile-friendly. Google знает как!
14 Апреля 2015
Старый статичный сайт можно сделать mobile-friendly. Google знает как!

Старый статичный сайт можно сделать mobile-friendly. Google знает как!

Грядет обновленный алгоритм Google, и аналитик компании Зинеб Аит Бахаджи (Zineb Ait Bahajji) поделилась на форуме вебмастеров инструкцией, как старый статичный сайт на HTML можно к нему подготовить.

· Следует использовать режим эмуляции в браузере Chrome. Это позволит протестировать отображение сайта на разных экранах и разрешениях.

· Настройте область просмотра.

· Вместо <font> и других встроенных HTML-элементов используйте CSS.

· Следует использовать HTML-элементы с CSS, которые самостоятельно будут подстраиваться под необходимые размеры, если страница большая по ширине.

· Замените все элементы с фиксированной шириной (например, <table width=600>) элементами с относительной шириной (например, <table width="80%">), максимальной шириной (<table style="max-width:600px;">) или адаптивной шириной в соответствии с медиазапросом.

· Способ работы с широкими изображениями, которые позволяю подгонять по ширине экрана устройства – это добавить img { max-width:100% } в таблицу стилей.

· Используйте <table> только для таблиц. Избегайте его использования в макете. Если есть <table> в макете - конвертируйте его в div + CSS floats/inline блоки для правильного отображения на десктопе. Затем добавьте медиазапросы, чтобы элемент стал адаптивным.

· Если у вас есть широкие таблицы (с 3-4 столбцами и более), то их следует рекомендуется модифицировать или преобразовать код в стиль без таблицы (<dl>), т.к. они могут некорректно отображаться на мобильных устройствах.

· Теги <pre> делают страницу шире, нужно избавиться от них.

· Для пользователей старых браузеров, таких как Internet Explorer 8 добавьте объявление DOCTYPE. Тег DOCTYPE указывает браузерам следовать стандарту, тем самым сводя к минимуму шансы неверного отображения страниц в старом браузере.

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

Хотите быстро увеличить посещаемость сайта?
Хотите увеличить конверсию сайта?

Закажите аудит юзабилити бесплатно!

Личный кабинет

Логин
Пароль

Обратный звонок

Имя
Телефон
Email

Заказать услугу

Имя
Телефон
Email

Отзыв

Бесплатный расчет

Имя
Тема обращения
Телефон
Email
Слышали о нас ?
Комментарий
Прикрепить тех.задание