Форум
Читайте нас также:

об электронной торговле - для интернет-магазинов и ритейла. портал и сообщество

Форум

Google рассказал как сделать "мобильными" статичные страницы

Сотрудница Google Зинеб Аит Бахаджи опубликовала ряд рекомендаций по оптимизации статичных страниц под мобильный поиск.

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

Вносить изменения в сайт понадобилось из-за скорого запуска фильтра mobilefriendly, который будет пессимизировать в мобильной выдаче сайты без мобильной оптимизации страниц.

Что касается рекомендаций, то первым делом Зинеб Аит Бахаджи рекомендует вебмастерам перенести сайт на какую-либо CMS. Таким образом можно избавиться от "ручной" работы и возможных ошибок.

Если такой возможности нет, то необходимо следовать этому набору рекомендаций:

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

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

– Используйте файлы стилей (CSS) вместо тега "font" или других элементов html в коде страницы.

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

– Избавьтесь от фиксированных размеров элементов. Например, если ширина страницы указана в пикселях (600px), то следует изменить ее на проценты (например, 80%).

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

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

– Избегайте таблиц шириной в 3-4 колонки. Они не умещаются на мобильные экраны. Если они уже на сайте есть, следует их уменьшить.

– Избавьтесь на от тега <pre>. Они могут расширять страницу.

  • Для форматированных текстов используйте границы CSS, отступы и т.д.
  • Для верстки таблиц используйте тег <table>. Верстать их нужно с учетом рекомендаций, указанных выше.
  • Для шрифтов фиксированной ширины используйте CSS font-family:monospace.
  • В других моментах, где нужно сохранить пробелы (например, компьютерный код), следует использовать <pre>, но добавить чтобы разрешить горизонтальную прокрутку.

– Добавьте в код DOCTYPE, чтобы облегчить работу пользователям со старыми браузерами. Например, Internet Explorer 8. Дело в том, что такие браузеры могут входить в "режим совместимости", что приведет к некорректному отображению страницы.

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



Прокомментировать


:D
:)
:(
:o
:shock:
:?
8)
:lol:
:x
:P
:oops:
:cry:
:evil:
:twisted:
:roll:
:wink:
:!:
:?:
:idea:
:arrow:
:|
:mrgreen:
.

Читайте также

Как продвигать сервис в соц. сетях? 7

Создавайте заказы на таких сервисах, как Адвего.ру, и набирайте группы по 20-40 чел. за 20-50 центов для ВКОНТАКТЕ. и прочих социалках.

Рекламный рынок России-2015: просядет все, кроме Интернета

К концу года расходы на рекламу в мире вырастут на 4,6%, особенно успешное развитие обещают рекламе в Интернете и на мобильных устройствах
Локальный поиск Google: тематичность рулит
Локальный поиск Google: тематичность рулит

Для продвижения в локальной выдаче Google лучше использовать ссылки с сайтов схожей тематики. К такому выводу пришли 22 эксперта в области локального поиска






2001 - 2017 © Оборот.ру. Все права защищены