Пятница, 13 — прекрасный день, чтобы опубликовать очередной пост по теме mobile optimized. Сегодня я расскажу как исправить ошибки, о которых шла речь в прошлом посте: «ширина контента не соответствует области просмотра» и «маленький размер шрифта».

Резиновый дизайн вместо фиксированного

Для исправления неправильной ширины контента надо из сайта с фиксированной шириной сделать сайт с резиновой шириной, то есть сделать сайта «сжимаемым». Сжиматься он должен вплоть до 300-320 пикселей по ширине.

Как это сделать? В теории достаточно просто, необходимо везде пиксели заменить на проценты для блоков и элементов, а для шрифтов пиксели заменить на относительные пункты (em вместо px). На практике это преобразование может быть катастрофически сложным и дл кого-то проще будет заменить тему на адаптивную, если речь идет о распространенных CMS вроде Joomla и WordPress.

Резиновый дизайн не обязательно должен заполнять все пространство на десктопах и ноутбуках, для этого в стилях есть параметр max-width, где пиксели будут уместны. Например, для этого блога внешний контейнер имел ширину 1000px и его стиль определялся так:

#page{
	width:1000px;
	margin:0px auto;
}

Переписываем этот стиль так:

#page{
	max-width:1000px;
	width:100%;
	margin:0px auto;
}

На больших экранах ничего не поменялось, а на маленьких блог должен сжиматься в 100% экрана, какой-бы она не была. Должен, но не будет, потому что внутренние блоки имеют фиксированные размеры и горизонтальный скроллинг на узких экранах никуда не денется. Ширину внутренних блоков необходимо также переводить в проценты, при этом помнить, что проценты надо считать относительно родительского блока. Например, ширина блога была 1000px, ширина основной колонки — 725px, ширина правой колонки (сайдбара) — 275px. Размер в процентах вычисляется по формуле:

 Продолжаю серию статей по адаптации сайтов для мобильных «mobile optimized». Уже набиты первые шишки, но намечаются и некоторые успехи. Сегодня остановлюсь подробней на тех ошибках, которые указывает Google, и на правильной настройке области просмотра — базовой настройке. Сразу отмечу, что простого способа настроить сайт для мобильных мне найти не удалось. Так что если у вас какая-то стандартная CMS и вы безболезненно можете заменить тему на адаптивную — вы счастливый человек…

Пара ремарок

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

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

Ошибки оптимизации для мобильных

Ошибки, которые указывает Google при оптимизации для мобильных:

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

В каких случаях Google может замедлить индексацию сайта или совсем остановить ее?

На конференции в Нью-Йорке представитель Google из команды Google Webmaster Central рассказал о двух сигналах, останавливающих робота:

1. увеличивающееся время отклика страниц сайта
2. появление 5xx ошибок

Если время отклика сайта все время увеличивается, страницы отдаются все медленнее, то сервер может быть перегружен и имеет смысл приостановить или совсем прекратить запрашивать URLы с сайта. Аналогично и с ошибками из категории 5xx — различные внутренние ошибки сервера, также возникающие иногда из-за высокой нагрузки на сервере или неправильной его конфигурации. Через некоторое время робот повторно запросит какие-то страницы и если ошибки исчезли, а время отклика приемлемые, то индексация сайта возобновится.

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

Еще один «разминочный» пост.

Мэту Каттсу задали вопрос, какое влияние окажут две ссылки на одной странице, ведущие на один URL — как по ним будет передаваться PR и ссылочное, если текст ссылок разный?

Что касается PageRank, то вес страницы будет делиться между всеми ссылками и если на странице две ссылки на один URL, то на целевую страницу по этим ссылкам передается две «порции» веса страниц.

Что касается учета текста ссылок, то по состоянию на 2009 год (ничего себе актуальность!), учитывается текст первой ссылки, текст второй игнорируется.

Видео под катом.