Вторник, 21 декабря 2010 г.
Опубликовано также в
Google Grants Blog
С приближением праздничного сезона у всех нас появляется немало задач по обслуживанию сайтов. Именно поэтому мы решили посвятить второй пост в нашей
серии публикаций клиники сайтов
очистке вашего исходного кода. В ходе анализа представленных сайтов некоммерческих организаций мы заметили некоторую путаницу в отношении того, какие HTML-теги или разметку следует использовать и какой контент в них размещать. И то, и другое может существенно повлиять на пользователей и на то, как ваш сайт выглядит на странице результатов поиска.
Прежде чем украшать дом, украсьте свои <title>элементы
Из всех представленных сайтов НКО 27% неправильно использовали свои <title>
элементы, которые имеют решающее значение для того, чтобы и Google, и пользователи понимали, что важно для вашего сайта. Обычно поисковая система отображает около 60 символов из вашего элемента заголовка; это ценное пространство, поэтому вы должны его использовать! Прежде чем переходить к самому коду, давайте сначала посмотрим, как отличный элемент заголовка одного из представленных сайтов,
Sharp, будет выглядеть на странице результатов поиска:
![]()
В идеале отличный <title> элемент будет содержать название организации вместе с описательным слоганом. Давайте посмотрим на некоторые представленные примеры:
| Организация | <title> исходный код | Удобство использования | Поведение тегов |
| Sharp | <title>Top San Diego Doctors and Hospitals - Sharp HealthCare</title> | Лучший | Содержит название организации и описательный слоган |
| Interieur | <title>Interieur 2010 - 15-24 October Kortrijk, Belgium</title> | Хороший | Содержит название организации и неописательный слоган |
| VAMS International | <title>Visual Arts and Music for Society | VAMS International</title> | Нормальный | Содержит только название организации |
Если вы не укажете тег <title> , Google попытается создать заголовок за вас. Вероятно, вы сможете сделать это лучше, чем наше самое точное предположение, так что дерзайте: возьмите под контроль свой тег
<title> ! Это простое исправление, которое может сыграть огромную роль. Использование конкретных тегов
<title> для ваших более глубоких URL-адресов также важно, и мы рассмотрим это в нашем следующем посте клиники сайтов.
Следите за своими тегами описания meta тегами
Описание meta теги
не использовались на полную мощность на 54% представленных сайтов. Эти теги часто используются для формирования двухстрочного фрагмента (сниппета), предоставляемого пользователям на странице результатов поиска. С помощью качественного сниппета вы можете заинтересовать потенциальных читателей и подготовить их к тому, чтобы узнать больше о вашей организации. Давайте еще раз взглянем на хороший пример среди представленных сайтов,
Tales of Aussie Rescue:

Если теги описания meta отсутствуют или нерелевантны, сниппет будет выбран из содержимого страницы автоматически. Если вам повезло и был автоматически выбран хороший сниппет, помните, что поисковые системы выбирают сниппеты по-разному, поэтому лучше поддерживать последовательность и релевантность, написав надежный тег описания meta тег.
Держите свои <h> элементы на своих местах
Еще одно быстрое исправление — убедиться, что ваш сайт правильно использует теги заголовков. В нашем исследовании некоммерческих организаций почти 19% представленных сайтов имели потенциал для улучшения элементов заголовков. Самой частой проблемой в тегах заголовков была тенденция начинать заголовки с тега <h2> или <h3> , не включая тег
<h1> , предположительно из эстетических соображений.
Заголовки дают вам возможность сообщить как Google, так и пользователям, что важно для вас и вашего сайта. Чем меньше число в теге вашего заголовка, тем важнее текст в глазах Google и ваших пользователей. Воспользуйтесь этим тегом <h1> ! Если вам не нравится, как визуально отображается тег <h1> , вы всегда можете изменить его внешний вид в вашем CSS.
Используйте alt-текст для изображений
Всегда приятно демонстрировать свои семейные фотографии в праздничный сезон, но не забывайте рассказывать нам, о чем они. Более 37% проанализированных сайтов ненадлежащим образом использовали атрибут alt для изображений. При правильном использовании этот атрибут может:
- Помочь Google понять, что изображено на вашей картинке
- Позволить пользователям текстовых браузеров, людям с проблемами доступности или пользователям ограниченных устройств понять ваши изображения
Имейте в виду, что богатый и описательный alt-текст здесь является ключевым моментом. Давайте еще раз посмотрим на некоторые из представленных сайтов и использование ими атрибута alt:
| Организация | Исходный код | Удобство использования | Поведение тегов |
| Sponsor A Puppy | <img alt="Sponsor a Puppy logo" src="..." /> | Лучший: alt-текст указывает, что изображение является основным логотипом организации | Использует богатый, описательный alt-текст для описания изображений, кнопок и логотипов |
| Philanthropedia | <img alt="Logo" height="..." /> | Хороший: alt-текст указывает, что изображение является логотипом, но не описывает его дополнительно организацией или ее поведением | Использует неописательный альт-текст для изображений, кнопок и логотипов или использует альт-текст только спорадически |
| Coastal Community Foundation | <img src="..." /> | Неидеально: альт-текст отсутствует | Не использует альт-текст или использует текст, не добавляющий смысла (часто встречается при нумерации изображений) |
Небольшой экскурс по вашим новогодним обещаниям
У Google есть отличные ресурсы для дальнейшего изучения передовых методов работы с исходным кодом. Для
начала вы можете использовать наш
HTML Suggestion Tool
в Webmaster Tools. Кроме того, всегда полезно сделать ваш сайт
доступным для всех пользователей.
Как мы это применяем
Google announcements age. We keep this post here for the record, and we note for clients whether the behaviour it describes still applies today or has since been superseded.
Связанные услуги