Анатолий Косарев – 50 руководств по SEO-оптимизации. Часть №2 (страница 3)
Обращение внимания на альтернативные теги также полезно для общей стратегии SEO на странице.
Вы хотите убедиться, что все остальные области оптимизации уже выполнены, но если изображение не загружается по какой-либо причине, пользователи увидят, каким должно быть изображение.
Кроме того, добавление соответствующих тегов alt к изображениям на веб-странице может помочь веб-сайту повысить рейтинг в поисковых системах за счет связывания ключевых слов с изображениями.
Даже Google отметил ценность замещающего текста в изображениях.
Это атрибут предоставляет Google полезную информацию о теме изображения. Мы используем эту информацию, чтобы определить лучшее изображение, которое нужно вернуть по запросу пользователя.
Альтернативный текст требуется и для лиц, которые не могут сами просматривать изображения. Описательный замещающий текст может точно предупредить пользователей о том, что изображено на фотографии. Например, у вас есть изображение шоколада на вашем сайте.
Альтернативный текст мог бы выглядеть так:
<img src = ”chocolate-1.jpg» alt = «шоколад» />
Однако лучший альтернативный текст, описывающий изображение, был бы следующим:
<img src = ”chocolate-kofe.jpg» alt = «батончик со вкусом темного шоколада и кофе» />
Альтернативный текст доступен для просмотра в кэшированной текстовой версии страницы, что помогает как пользователям, так и поисковым системам. Для дополнительной ценности SEO альтернативный текст может действовать как якорный текст внутренней ссылки, когда изображение ссылается на другую страницу сайта.
Сюда можно добавить слова, релевантные бренду, чтобы повысить узнаваемость. Просто избегайте переполнения ключевыми словами.
Укажите больше аргументов, характеризующих изображение, чем указано в имени файла. Хотя идеального количества слов не существует, постарайтесь найти от 10 до 20, чтобы что-то передать об изображении.
Хотя Атрибут title=«», многим кажется не уместным, однако при наведении мыши на изображение видеть некоторый текст
и приятно, и вызывает большее доверие к создателю контента. А это значит, что для поисковиков – это дополнительный аргумент в пользу авторитетности.
Атрибут title=«», также желательно употреблять. Его заполнение не должно быть идентичным атрибуту alt=«». Он должно иметь более подробное описание, и также содержать ключевые слова, или фразы.
7. ПОДУМАЙТЕ О СТРУКТУРЕ ФАЙЛА ИЗОБРАЖЕНИЯ
В 2018 году Google обновил свои правила изображения.
Одним из основных обновлений, которые они сделали, было то, что они использовали путь к файлу и имя файла для ранжирования изображений.
Путь к файлу и имя файла являются фактическим фактором ранжирования.
Например, если вы являетесь брендом электронной коммерции с несколькими продуктами, вместо того, чтобы помещать все изображения ваших продуктов в общую папку / media /, желательно структурировать ваши подпапки по темам, связанным с другими категориями, например, / shorts / или / denim /.
8. СДЕЛАЙТЕ ЗАГОЛОВОК И ОПИСАНИЕ СТРАНИЦЫ
Google также показал, что использует заголовок и описание вашей страницы как часть своего алгоритма поиска изображений.
На странице поддержки Google сказано:
«Google Images автоматически генерирует заголовок и фрагмент, чтобы лучше всего объяснить каждый результат и то, как он соотносится с пользовательским запросом…
Мы используем ряд различных источников для этой информации, включая описательную информацию в заголовке и метатеги».
Все ваши основные факторы SEO на странице, такие как метаданные, теги заголовков, текст на странице, структурированные данные и т. д., влияют на то, как Google ранжирует ваши изображения.
Прописать в полном объёме всё равно, что положить кусок колбасы на бутерброд. С колбасой бутерброд вкуснее. Поэтому не забудьте добавить колбасу для улучшения рейтинга изображений.
Я мясоед, но если вы не едите мясо, то придумайте своё сравнение.
9. ОПРЕДЕЛИТЕ СВОИ РАЗМЕРЫ
Если вы используете AMP или PWA, вам необходимо указать размеры изображения в исходном коде.
Однако, если вы их не используете, лучше всего определить ширину и высоту. Это обеспечивает качественное отображение изображения.
Кроме того, это позволяет браузерам изменять размер изображения до загрузки CSS.
Атрибуты размеров изображения также важны для предотвращения проблем с кумулятивным сдвигом макета (CLS), которые могут помешать вашей оптимизации Core Web Vitals.
Ключевым моментом является включение атрибутов ширины и высоты для каждого элемента изображения и видео.
Это сообщает браузеру, сколько места следует выделить для ресурса, и предотвращает раздражающее смещение содержимого, которое снижает вашу оценку CLS. Узнайте больше можете в руководстве «Оптимизация совокупного сдвига макета».
10. СТРУКТУРИРОВАННЫЕ ДАННЫЕ ИЗОБРАЖЕНИЯ
Добавление структурированных данных на ваши страницы помогает поисковым системам отображать ваши изображения в качестве расширенных результатов. Google Images поддерживает структурированные данные для изображений продуктов, видео и рецептов.
Например, если у вас есть рецепты на сайте, и вы добавляете структурированные данные к своим изображениям, Google может добавить к вашему изображению значок, показывающий, что оно принадлежит рецепту.
Добавление структурированных данных на ваши страницы помогает поисковым системам отображать ваши изображения в качестве расширенных результатов.
Воспользуйтесь Общими рекомендациями Google по структурированным данным, чтобы узнать, как добавлять структурированные данные на свои страницы в рамках параметров поисковой системы.
11. СДЕЛАЙТЕ ИЗОБРАЖЕНИЯ УДОБНЫМИ ДЛЯ МОБИЛЬНЫХ ГАДЖЕТОВ
Если не сделать изображения удобными для мобильных устройств, то худшем случае это может дать вам высокий показатель отказов и низкую конверсию. Но, если всё сделать в соответствии с указаниями, изложенными ниже, то это может дать больше возможностей для ранжирования и улучшить взаимодействие с пользователем.
Проблема в том, как оптимизировать изображения для индекса, ориентированного на мобильные устройства?
Вы создаете адаптивные изображения. Это означает, что изображение будет масштабироваться в зависимости от размера сайта, независимо от того, использует ли пользователь настольный компьютер или мобильное устройство. Изображение подстраивается под размер устройства.
Mozilla предлагает всеобъемлющую на использование srcset и sizes атрибуты для обеспечения браузер дополнительных исходных изображений, позволяя отображать идентичное содержание изображения с измененным размером для данного устройства.
Важно отформатировать это с другой частью значения атрибута в каждой строке, как показано в этом примере из их ресурса:
<img srcset="elva-fairy-480w.jpg 480w, elva-fairy-800w.jpg 800w» sizes=» (max-width: 600px) 480px, 800px» src="elva-fairy-800w.jpg» alt=«Elva dressed as a fairy»>
Узнайте больше об использовании srcset для адаптивных изображений; на официальном сайте компании.
12. ДОБАВЬТЕ ИЗОБРАЖЕНИЯ В СВОЙ ФАЙЛ SITEMAP
Независимо от того, добавляете ли вы изображения в карту сайта или создаете новую карту сайта для изображений, вам нужны изображения где-нибудь в файлах карты сайта.
Наличие ваших изображений в карте сайта значительно увеличивает шансы поисковых систем сканировать и индексировать ваши изображения. Таким образом, увеличивается посещаемость сайта.
Если вы используете WordPress, Yoast предлагает решение для карты сайта в своем плагине.
ОПТИМИЗАЦИЯ ТЕСТА НА СКОРОСТЬ
После того, как вы оптимизировали свои изображения, как узнать, достаточно ли быстро загружается страница вашего веб-сайта? Используйте один из следующих инструментов, чтобы проверить скорость вашего сайта:
– WebPageTest
– Pingdom
– GTmetrix
– WebWait
– Google PageSpeed Insights
ПОНИЖАЕТСЯ РЕЙТИНГ СТРАНИЦЫ, ЕСЛИ
– Большое количество графических ссылок для навигации на сайте.
– Избегайте файлы изображения называть так: “image1.jpg», “pic.gif», “1.jpg»
– Затрудняют индексацию длинные имена файлов, например, moi_dgugany_po_universitetu_2014_goda.jpg. Пробелы в именах файлов, и написание имен файлов кириллицей – не допустимо.
– Не допустимо в атрибутах alt и title писать длинные предложения, и с избытком использовать ключевые слова.