Оптимизация изображений под SEO — SEO на vc.ru
SEO
SEO блиц
Картинки дополнительно привлекают трафик на сайт, увеличивают привлекательность страницы и восприятие контента, а также влияют на скорость загрузки и релевантность страниц запросу. Они способны улучшить видимость сайта в поисковых системах при правильной SEO-оптимизации.
5127 просмотров
Правила оптимизации изображений
Выбор формата изображения
Используйте форматы изображений, которые поддерживаются всеми популярными браузерами и индексируются поисковыми системами:
- GIF — если необходима анимация.
- PNG — если необходимо сохранить мелкие детали в высоком разрешении или нужна прозрачность фона.
- JPEG — для фото и прочих изображений.
Существуют и другие форматы: WebP, JPEG XR — они имеют меньший вес, но их поддерживают не все браузеры.
Оптимизируйте вес изображения
1. Размещайте изображения в правильном разрешении. Не допускайте ситуацию, когда исходный размер картинки превышает отображаемый в браузере. В таком случае браузеру приходится самому масштабировать изображение, что снижает производительность сайта.
2. Уменьшайте вес изображения. Существует множество сервисов для сжатия размера изображения. В результате их применения удается значительно снизить размер файла без существенной потери качества.
Текстовая оптимизация изображений
- Старайтесь, чтобы картинка соответствовала по смыслу окружающему ее тексту.
- Используйте в названии файлов ключевые слова, например printer-canon-pixma-ip7240. jpeg а не img_11432.jpeg
- Заполняйте атрибут alt (альтернативный текст) для тега <img>. Он используется поисковыми роботами для правильной индексации и «понимания» содержания изображений. Также, если по каким-то причинам изображение не будет загружено, на его месте отображается альтернативный текст.
- Атрибут title также важен, его содержание отображается при наведении курсора на изображение.
- Заполняйте атрибуты alt и title в соответствии с ключевыми словами, но не следует заполнять их одинаково.
- Добавляйте уникальные изображения, поисковые системы умеют определять оригинальность графики и, как и в ситуации с текстом, выше ценят уникальные картинки.
Индексация изображений
Важно, чтобы картинки были доступны для индексирования поисковым роботам. Запрет на индексацию может быть установлен соответствующим правилом в файле robots. txt.
Это может быть:
- запрет к папке, в которой располагаются изображения, например Disallow: /bitrix/images;
- запрет на индексирование определенного формата файлов Disallow: *.jpg.
Проверить доступность изображений для индексации можно, воспользовавшись инструментом проверки файла robots.txt в сервисах Яндекс Вебмастер и Google Search Console.
Как выглядит код оптимизированной картинки
В соответствии с данными выше рекомендациями по текстовой оптимизации изображений, их код может выглядеть следующим образом:
<img src=»/images/optimizatsiya-izobrazhenij.jpg» alt=»Пример оптимизированного изображения» title=»SEO-оптимизация картинок» />
Что дает оптимизация картинок
- Привлечение дополнительного трафика. У оптимизированных изображений больше вероятность попасть в выдачу картинок поисковых систем, получая тем самым больше переходов и привлекая дополнительный трафик.
- Дополнительное повышение релевантности страницы. Оптимизация изображений позволяет поисковым системам лучше понимать содержание картинки. Использование тематических картинок привнесет дополнительный вклад в релевантность страницы и повысит удобство восприятия контента для посетителей сайта.
Ждите новые заметки в блоге или ищите на нашем сайте.
чек-лист — Маркетинг на vc.ru
На SEO-аудите мы часто сталкиваемся с, казалось бы, мелкой проблемой — многие пренебрегают полной оптимизацией изображений. А зря, ведь она может:
1437 просмотров
- Повысить скорость загрузки страницы. Если изображения слишком много весят, ваш сайт будет тормозить, а это точно приведет к уходу потенциальных клиентов.
- Улучшить визуализацию контента. Пользователям проще воспринимать текст, проиллюстрированный картинками. Для коммерческих сайтов оптимизация изображений бывает даже важнее оптимизации текста — вряд ли клиентам салона красоты будет удобно ориентироваться в стрижках по текстовому описанию.
- И наконец — принести дополнительный трафик. Доля трафика с изображений составляет обычно 2-3% и приходит, например, от поиска по картинкам. Качественные и оптимизированные изображения легко могут выйти в топ, даже если сам сайт далеко от первой страницы выдачи.
Сегодня расскажем о каждом этапе оптимизации изображений подробно на своих примерах. Этот чек-лист — ваша шпаргалка, чтобы ничего не забыть и добиться лучших результатов при комплексной оптимизации;)
Делайте ставку на информативные изображения
Оптимизация начинается с выбора картинки — она должна не просто украшать или разбавлять текст, а дополнять, подчеркивать и иллюстрировать информацию. Например, для статьи о сборе чая в Китае вместо красивых, но неинформативных фотографий плантаций, мы добавили иллюстрацию, на которой чай распределен по сортам. Так читателю проще понять, чем они отличаются внешне.
Хорошо, если на картинке виден результат (до и после химчистки ковров) или процесс (этапы создания вышивки на одежде).
Нужно позаботиться и о количестве картинок. В зависимости от тематики, долю изображений можно варьировать. Например, в обычной SEO-статье без интеграций товаров слишком большое количество изображений может привести к размытию релевантности текста. А вот для интернет-магазинов работает правило «больше — лучше». Одной фотографии изделия будет недостаточно, ведь люди хотят рассмотреть вещь детально, прежде чем покупать. Когда мы работали с онлайн-магазином премиальной одежды, то размещали как минимум 6 изображений товара в карточке: фото на модели со всех сторон и отдельное фото деталей изделия.
Проверяйте авторские права
Используйте только уникальные изображения и фото. Это можно реализовать с помощью штатного фотографа, который будет делать собственный контент, или фотобанков. Во втором случае важно помнить — даже у купленной на фотостоке картинки есть лицензия с ограничениями. Об условиях можно прочитать в лицензионном соглашении — к примеру, вам могут запретить использовать фото в коммерческих целях или изменять его.
Если не соблюдать правила, можно получить претензию.Чтобы упростить вам жизнь, делимся лайфхаком — в поиске по Google Картинкам есть специальный фильтр, по которому можно понять, есть ли у изображения лицензия или нет.
В настройках можно выбрать один из вариантов предоставления прав на картинки:
- Commercial & other лицензия — изображения, используемые на коммерческой основе. Их нельзя брать без разрешения правообладателя.
- Creative Commons лицензия — это пакет лицензий на авторские изображения, который позволяет пользоваться картинками без разрешения автора.
Изображения, которые нельзя использовать без разрешения автора, отмечены специальными шильдиками в поиске.
Оптимизируйте названия файлов, чтобы улучшить ранжирование
Часто на сайтах висят изображения с названиями «JbFGajhIb.jpeg» — никакой информации они не несут. Человекопонятный URL (ЧПУ) названия для файлов изображений гораздо лучше проинформирует и посетителя сайта, и поискового бота о содержимом.
- имя файла не должно содержать спама и непонятных слов на кириллице;
- в имени должно быть отражено содержимое картинки.
Например, если на картинке изображены красные кроссовки, лучшим вариантом ЧПУ будет: «krossovki-krasnie.jpg».
Увеличивайте скорость сайта за счет дополнительных сервисов
Если загрузка сайта идет больше 3 секунд, пользователи будут быстро уходить с него. Это приведет к ухудшению поведенческих факторов. Обычно эта проблема решается стандартным сжатием изображений перед добавлением на сайт. Для работы с небольшими сайтами и лендингами мы используем сервис Squoosh и оптимизируем картинки вручную, чтобы проконтролировать изменение изображения вплоть до 1 пикселя и добиться самого оптимального варианта.
Но что делать, если оптимизацию приходится проводить уже на готовых сайтах, где может быть больше 150 000 изображений? В этом случае дешевле и быстрее оптимизировать изображения пачками в сервисах. Мы, например, работаем с Compressor.io, ILoveIMG.com, Jpegtran. Оптимизация всех изображений в таких сервисах проходит на полном автопилоте в фоновом режиме.
Оптимизируйте изображения для мобильных
Скорость интернета на десктопах и смартфонах сильно отличается. То же самое и с расширениями экранов. Если размещать в мобайле большие картинки для широких экранов, скорость загрузки контента сильно замедлится, а само изображение отобразится неправильно.
Чтобы решить проблему, настройте адаптивные изображения с атрибутом srcset тега img. Атрибут srcset содержит несколько изображений с описанием их размеров по ширине или плотности пикселей.
Загрузите на сайт несколько вариантов изображений с разными разрешениями таким образом:
Браузер проанализирует нужные параметры — устройство, разрешение экрана, скорость интернета — и самостоятельно выберет подходящий размер изображения.
Это только один вопрос из большой темы о SEO-оптимизации для мобильных. Если хотите узнать о каждом этапе подробно, читайте наш гайд, в котором мы рассказали о 8 точках оптимизации сайта для мобильного.
Не забудьте заполнить атрибуты alt и title
Атрибуты alt и title помогают поисковикам понять тематику изображения. Но просто заполнить их значениями «Фото1» и «Фото2» нельзя — это не даст никакой информации поисковым ботам. В выдачу попадают только картинки с четким описанием, которые можно найти по конкретному запросу.
С title все легко — это, как и alt, описание картинок, только не для поисковых ботов, а для пользователей. Title выводится при наведении курсора на изображение и обычно представляет собой короткую фразу, объясняющую, что происходит на картинке. На SEO он не влияет, но может быть полезен читателям.
А вот с alt сложнее — разберемся подробнее.
Alt — это альтернативное текстовое описание изображения. В коде оно выглядит так:
Если по каким-то причинам картинку на сайте загрузить не удалось, а alt отсутствует, пользователи увидят неправильный контент, а поисковые боты просканируют пустую страницу.
Чем заполнить alt? Есть несколько вариантов — покажем на примере одного из наших e-commerce проектов:
Самый простой вариант заполнения атрибута — alt=»Название товара». Это даст поисковику минимальную информацию об объекте на фото. Чтобы расширить данные, мы указывали бренд, добавляли конкретные модели, не забывали и про детали — цвет, размер или артикул.
Если у вас есть несколько изображений одного и того же товара, то поисковик может посчитать их дублями и вывести в поиск, например, вместо шести только одно изображение. Чтобы уникализировать alt, достаточно дописать уточнение: «вид сзади», «адаптер».
Главное — не допустить переспама и избегать коммерческих вхождений в атрибутах, например, «Электрическая газонокосилка Чемпион ЕМ3411 — купить на сайте/заказать доставку». Это приведет к санкциям от поисковиков.
Пользуйтесь модулем Custom title и alt, если товаров больше 10 000
С такой проблемой могут столкнуться крупные интернет-магазины — составить атрибуты вручную для нескольких тысяч изображений почти нереально. В таких случаях мы пользуемся модулем Custom Title и Alt для картинок в ссылках и теге img. Модуль автоматически генерирует значения по описанным правилам — так мы быстро оптимизируем alt и title у изображений, уже размещенных на сайте.
Добавляйте описание под изображения
Еще один способ помочь поисковикам понять, соответствует ли изображение тематике страницы, — текстовое описание под ним. Если на странице много картинок и мало текста, например, в карточке товара, описание изображений просто необходимо. Или, если, как в примере ниже, картинка нуждается в пояснении.
Вхождение ключевых слов в описании не будет лишним, главное — не переспамить, чтобы не попасть под санкции.
Если поисковые системы «не хотят» индексировать изображения — воспользуйтесь инструментами Sitemap или Schema.org
Поздравляем, вы все оптимизировали: подобрали релевантные тематике изображения, уменьшили вес, правильно прописали атрибуты и названия. Вот только бывает и так, что после всего этого поисковые системы все равно не хотят или не успевают индексировать изображения и выводить их в поиск. Из-за чего это может случиться:
- сложная структура сайта или несколько уровней вложенности документов;
- реализация изображений через JavaScript, например, увеличение картинки или 3D-показ.
Есть два способа ускорить индексацию и отразить весь контент:
- Файл Sitemap.
- Разметка Schema.org.
Сначала о Sitemap
Поможет отобразить весь контент даже в скриптах. Для этого нужно указать ссылки на все изображения, размещенные на странице сайта в файлах sitemap (в <url>), используя контейнер <image:image> с тегом <image:loc>.
Пример карты сайта для одного изображения на одной странице
Нам Sitemap помог при работе с интернет-магазином люксовой одежды и обуви. По запросу «Обувь» поисковики не выдавали никаких картинок для нашего сайта.
Чтобы помочь роботам определить, что сайт релевантен запросам и вывести товары в поиск по картинкам, мы добавили Sitemap для изображений. В течение месяца роботы начали частично индексировать изображения, а уже на второй месяц все изображения появились в поиске по картинкам. За счет этого мы увеличили видимость проекта в поиске и даже привели дополнительный трафик — на сайт с картинок пришло примерно 250-300 пользователей. Для узконишевого магазина с небольшим трафиком это был неплохой результат.
Теперь о Schema.org
Позволяет улучшить представление сайта на страницах Google и Яндекс Картинки, а еще расширяет сниппет в поисковой выдаче — благодаря Schema.org нужная информация подтягивается в сниппет и распознается роботами. Разметка добавит в сниппет ссылку на изображение и его миниатюру, название и описание, подпись к изображению, его высоту и ширину. Пример:
Пользуйтесь рекомендациями и помните — максимальную эффективность в SEO можно достичь только при комплексной оптимизации сайта.
В блоге Кинетики мы рассказываем о своих процессах, делимся опытом, инсайтами и шаблонами внутренних инструментов
Google Image SEO Best Practices | Центр поиска Google | Documentation
Google Images — это способ визуального поиска информации в Интернете. Пользователи могут быстро изучить информацию с большим контекстом вокруг изображений с новыми функциями, такими как подписи к изображениям и видные значки.
Добавляя больше контекста к изображениям, результаты могут стать намного более полезными, что может привести к
более качественный трафик на ваш сайт. Вы можете помочь в процессе обнаружения, убедившись, что
ваши изображения и ваш сайт оптимизированы для Google Images, например, с помощью атрибуты alt
для
изображений или разметки структурированных данных. Следуйте нашим рекомендациям, чтобы повысить вероятность того, что ваш контент
появится в результатах поиска Google Картинок.
Создайте отличный пользовательский интерфейс
Чтобы улучшить видимость вашего контента в Google Images, сосредоточьтесь на пользователе, предоставив отличный пользовательский интерфейс. опыт: делать страницы в первую очередь для пользователей, а не для поисковиков . Вот несколько советов:
- Обеспечьте хороший контекст: Убедитесь, что ваш визуальный контент соответствует теме страница. Мы предлагаем отображать изображения только там, где они добавляют исходную ценность странице. Мы особенно не одобряйте страницы, на которых ни изображения, ни текст не являются оригинальным контентом.
- Оптимизация размещения: По возможности размещайте изображения рядом с соответствующим текстом. Когда это делает смысл, рассмотрите возможность размещения самого важного изображения в верхней части страницы.
- Не вставляйте важный текст в изображения: Избегайте встраивания текста в изображения, особенно важные текстовые элементы, такие как заголовки страниц и пункты меню, потому что не все пользователи могут получить к ним доступ (и инструменты перевода страниц не будут работать с изображениями). Чтобы обеспечить максимальную доступность вашего контента, сохранить текст в формате HTML, предоставить замещающий текст для изображений.
- Создавайте информативные и высококачественные сайты: Хороший контент на вашей веб-странице так же важен как визуальный контент для картинок Google — он обеспечивает контекст и делает результат более действенный. Содержимое страницы может использоваться для создания текстового фрагмента изображения, и Google считает, качество контента страницы при ранжировании изображений.
- Создавайте сайты, удобные для устройств: Пользователи чаще ищут в Google Картинках с мобильных устройств, чем с рабочий стол. По этой причине важно, чтобы вы разработали свой сайт для всех типов и размеров устройств. Используйте тест для мобильных устройств чтобы проверить, насколько хорошо ваши страницы работают на мобильных устройствах, и получить отзывы о том, что нужно исправить.
- Создайте хорошую структуру URL для вашего изображения: Google использует путь URL, а также имя файла, чтобы понять ваши изображения. Подумайте о том, чтобы упорядочить изображение таким образом, чтобы URL-адреса были построены логично.
Проверьте заголовок и описание страницы
Google Images автоматически создает ссылку заголовка и фрагмент, чтобы наилучшим образом объяснить каждый результат и как это связано с запросом пользователя. Это помогает пользователям решить, стоит ли нажимать на результат. Вот два примера того, как могут выглядеть ссылки заголовка и фрагмент в результатах поиска Google. страница:
Мы используем ряд различных источников для получения этой информации, включая описательную информацию в
заголовок и мета-тегов
для каждой страницы.
Вы можете помочь нам улучшить качество заглавной ссылки и фрагмента, отображаемого на ваших страницах. следуя заголовку Google и рекомендации по сниппетам.
Добавить структурированные данные
Если вы включите структурированные данные, Google Images может отображать ваши изображения в виде расширенных результатов, в том числе выдающийся значок, которые предоставляют пользователям релевантную информацию о вашей странице и могут привлечь более целевой трафик на вашу сайт. Google Images поддерживает структурированные данные следующих типов:
- Продукт
- Видео
- Рецепт
- Метаданные изображения
Следуйте общим рекомендациям по структурированным данным. а также любые рекомендации, относящиеся к вашему типу структурированных данных; в противном случае ваши структурированные данные может не подходить для отображения расширенных результатов в Google Картинках. В каждой из этих структурированных данных типы, атрибут изображения является обязательным полем для получения значка и расширенного результата в Google. Изображений. Вот два примера того, как расширенные результаты могут выглядеть в Google Картинках:
Оптимизация для увеличения скорости
Изображения часто вносят наибольший вклад в общий размер страницы, из-за чего страницы могут замедляться и дорого грузить. Обязательно примените последнюю оптимизацию изображения и приемы создания адаптивных изображений для обеспечения высокого качества и быстрого взаимодействия с пользователем.
Проанализируйте скорость вашего сайта с помощью PageSpeed Insights и посетите наш Почему скорость имеет значение? чтобы узнать о лучших практиках и методах повышения производительности веб-сайта.
Добавить фотографии хорошего качества
Качественные фотографии привлекают пользователей больше, чем размытые, нечеткие изображения. Кроме того, четкие изображения более обращение к пользователям в миниатюре результата и увеличение вероятности получения трафика от пользователей.
Включите описательные заголовки, подписи, имена файлов и текст для изображений
Google извлекает информацию о предмете изображения из содержания страницы, включая подписи и заголовки изображений. По возможности убедитесь, что изображения размещены рядом с соответствующий текст и на страницах, имеющих отношение к теме изображения.
Точно так же имя файла может дать Google подсказки о предмете изображения. По возможности используйте короткие, но описательные имена файлов. Для
например, my-new-black-kitten.jpg
лучше, чем IMG00023.JPG
. Избегайте использования общих имен файлов, таких как image1.jpg
, pic.gif
, 1.jpg
при
возможный. Если на вашем сайте тысячи изображений, возможно, вы захотите автоматизировать
называние изображений.
Если вы локализуете свои изображения, не забудьте также перевести имена файлов, помня о Рекомендации по кодированию URL если вы используете не латинские или специальные символы.
Использование описательного замещающего текста в атрибуте
alt
Замещающий текст (текст, описывающий изображение) улучшает доступность для людей, которые не могут просматривать изображения на веб-страницы, включая пользователей, которые используют программы чтения с экрана или имеют соединения с низкой пропускной способностью.
Google использует замещающий текст вместе с алгоритмами компьютерного зрения и содержимым страницы для понять суть изображения. Кроме того, замещающий текст в изображениях полезен в качестве якорного текста, если вы решили использовать изображение в качестве ссылки.
При написании замещающего текста сосредоточьтесь на создании полезного информационного контента с использованием ключевых слов.
надлежащим образом и в контексте содержания страницы. Избегайте заполнения атрибутов alt
ключевые слова (также известный как наполнение ключевыми словами)
так как это негативно влияет на пользователей и может привести к тому, что ваш сайт будет воспринят как спам.
Плохо (отсутствует замещающий текст) :
Плохо (наполнение ключевыми словами) :
Лучше :
jpg» alt=»щенок»/>
Лучший :
Также учитывайте доступность вашего замещающего текста.
Рекомендации W3. Для
элемент
, вы можете добавить атрибут alt
элемента, а для встроенного
элементов, вы можете использовать элемент
. Для
пример:
Мы рекомендуем протестировать ваш контент, проверив доступность и используя эмулятор медленного сетевого подключения.
Помогите нам обнаружить все ваши изображения
Используйте семантические элементы изображения HTML для встраивания изображений
Использование семантической разметки HTML помогает поисковым роботам находить и обрабатывать изображения. Google анализирует HTML
элементов (даже если они заключены в другие элементы, такие как
элементов) на ваших страницах для индексации изображений, но не индексирует изображения CSS.
Хорошо:
Плохо:
Щенок золотистого ретривера
Использовать карту сайта для изображений
Вы можете предоставить URL-адреса изображений, которые мы могли бы не обнаружить в противном случае отправка карты сайта изображения.
Карты сайта для изображений могут содержать URL-адреса из других доменов, в отличие от обычных карт сайта, которые междоменные ограничения. Это позволяет использовать CDN (сети доставки контента) для размещения изображений. Если вы используете CDN, мы рекомендуем вам подтвердить право собственности имени домена CDN в Search Console, чтобы мы могли информировать вас о любых ошибках сканирования, которые мы можем обнаружить.
Используйте поддерживаемые форматы изображений
Картины Google поддерживают изображения в следующих форматах: BMP, GIF, JPEG, PNG, WebP и SVG. Его Также рекомендуется, чтобы расширение имени файла совпадало с типом файла.
Вы также можете встраивать изображения в качестве URI данных. URI данных предоставляют способ включения файла, например изображения,
встроенный, установив атрибут src
элемента img
как строку в кодировке Base64.
используя следующий формат:
Хотя встраивание изображений может сократить HTTP-запросы, тщательно выбирайте, когда их использовать, поскольку это может значительно увеличить размер страницы. Подробнее об этом см. раздел о плюсах и минусах встроенных изображений на нашей странице web.dev.
Адаптивные изображения
Разработка адаптивных веб-страниц повышает удобство работы пользователей, поскольку пользователи используют их в множество типов устройств. Обратитесь к нашему руководству по адаптивным изображениям. чтобы узнать о лучших методах обработки изображений на вашем веб-сайте.
Веб-страницы используют элемент
или атрибут srcset
элемента img
для
укажите адаптивные изображения. Однако некоторые браузеры и поисковые роботы не понимают эти атрибуты.
Мы рекомендуем всегда указывать резервный URL-адрес с помощью атрибута src
.
Атрибут srcset
позволяет указать разные версии одного и того же изображения, специально для разных размеров экрана.
Пример : <источник изображения>
<изображение srcset="maine-coon-nap-320w.jpg 320w, maine-coon-nap-480w.jpg 480w, maine-coon-nap-800w.jpg 800w" src="мейн-кун-сон-800w.jpg" alt="Акварельная иллюстрация мейн-куна, неторопливо дремлющего перед камином">
Элемент
представляет собой контейнер, используемый для группировки различных <источник>
версий одного и того же образа. Он предлагает запасной подход, поэтому
браузер может выбрать правильное изображение в зависимости от возможностей устройства, таких как плотность пикселей и экран
размер. 9Элемент 0005 picture также пригодится для использования новых форматов изображений с
встроенная изящная деградация для клиентов, которые могут еще не поддерживать новые форматы.
Согласно разделу 4.8.1 стандарта HTML,
убедитесь, что вы предоставили элемент img
в качестве запасного варианта с src Атрибут
при использовании элемента picture
в следующем формате:
Пример :
<картинка> svg">
Оптимизировать для безопасного поиска
Безопасный поиск — это параметр в учетных записях пользователей Google, который указывает, показывать или блокировать явные изображения, видео и веб-сайты в результатах поиска Google. Убедитесь, что Google понимает характер вашего сайта, чтобы Google мог применять к нему фильтры безопасного поиска. в случае необходимости. Узнайте больше о пометке страниц безопасного поиска.
Отказаться от встроенной ссылки на Google Images
При желании вы можете предотвратить появление полноразмерного изображения в поиске Google Images страницу результатов, отказавшись от встроенных ссылок в результатах поиска Google Images.
Чтобы отказаться от встроенной ссылки:
- Когда ваше изображение запрашивается, проверьте заголовок реферера HTTP. в запросе.
- Если запрос исходит из домена Google, ответьте с кодом состояния HTTP
200
или код состояния HTTP204
и отсутствие содержимого.
Google по-прежнему просканирует вашу страницу и увидит изображение, но отобразит сгенерированное уменьшенное изображение во время сканирования в результатах поиска. Этот отказ возможен в любое время и не требует повторной обработки. изображений веб-сайта. Такое поведение не считается маскировкой изображения. и не приведет к ручным действиям.
Вы также можете полностью запретить отображение изображения в результатах поиска.
И, наконец…
Пожалуйста, прочитайте наше Руководство для начинающих по поисковой оптимизации. который содержит много полезной информации для лучшего ранжирования. Если у вас есть еще вопросы, пишите их в справочном сообществе Центра поиска Google.
Рекомендации по SEO для изображений, чтобы сделать ваш контент более доступным для поиска
Чтобы рассмотреть важность визуального поиска в 2021 году, давайте начнем с примера.
На днях я погуглил «как провести vlookup в Excel». Я просмотрел несколько статей, но остался недоволен — я не хотел читать о vlookup, я хотел см. ит.
Введите: Сила образов.
Как только я нажал на «Изображения», я быстро нашел то, что мне было нужно:
Я знаю, что я не одинок. Фактически, в настоящее время половина всех поисковых запросов в Google заканчивается на странице результатов поиска, и пользователь не переходит ни к каким результатам.
В 2021 году и далее маркетологи начинают обращать внимание на важность визуальных изображений как на мощную возможность привлечь новую аудиторию в поисковой выдаче.
Кроме того, как сказала мне менеджер по маркетингу HubSpot Кристен Бейкер: «После проведения эксперимента с изображениями в блоге HubSpot я обнаружила, что ранжирование в пакетах изображений Google увеличивает количество показов и кликов по нашему контенту».
Но… легче сказать, чем сделать, верно?
Здесь давайте рассмотрим, что такое оптимизация изображений, и лучшие практики, которым вы можете следовать, чтобы сделать ваши веб-страницы более доступными для поиска в результатах поиска изображений.
Что такое оптимизация изображений?
Поисковая оптимизация изображений относится к практике оптимизации ваших изображений для поисковых систем с помощью продуманного замещающего текста, соответствующих заголовков, хороших размеров файла и многого другого. SEO-оптимизация изображений может облегчить интерпретацию вашего контента сканерами поисковых систем, что может повысить его SEO как на страницах результатов поиска, так и на страницах результатов изображений, и сделать ваш сайт более доступным для обнаружения.
Рекомендации по поисковой оптимизации изображений
1. Используйте релевантный, точный замещающий текст для обеспечения доступности для пользователей и SEO.
Напомню: замещающий текст — это написанная копия, описывающая изображение. Например, если вы нажмете на продукт попкорна Pipcorn и осмотрите страницу, вы увидите, что альтернативный текст точно описывает изображение продукта как «Popcorn Family Pack Popcorn Pipsnacks LLC»:
Альтернативный текст играет две важные роли в SEO. .
Во-первых, альтернативный текст, также известный как альтернативные теги или альтернативные описания, помогает поисковым роботам более эффективно индексировать ваш веб-сайт, что положительно влияет на результаты поиска.
Фактически, Google заявляет на своей странице для разработчиков: «Вы можете помочь в процессе обнаружения, убедившись, что ваши изображения и ваш сайт оптимизированы для Google Images… [и] увеличить вероятность того, что ваш контент появится в результатах поиска Google Images. .»
Во-вторых, замещающий текст улучшает взаимодействие с пользователем. Замещающий текст может описывать изображение для слабовидящего читателя, а также помогает, если читатель не может правильно загрузить или увидеть изображение на своем устройстве.
Чтобы получить полное представление о том, как написать высококачественный замещающий текст, ознакомьтесь с замещающим текстом изображения: что это такое, как его написать и почему это важно для SEO.
2. Рассмотрите возможность использования подписей для описания изображения.
Подписи обычно не нужны, если контекст страницы может помочь читателям понять, что изображено на изображении — например, в этом сообщении в блоге я не использовал никаких подписей, потому что я использовал текст для представления каждого изображения. мы показали.
Однако, если у вас веб-сайт с большим количеством визуальных элементов, рассмотрите возможность использования подписей, чтобы помочь читателям понять изображение в контексте. Например, в портфолио фотографов Тома Халла он подписывает свои изображения, чтобы зрители могли контекстуализировать, где или что изображено на изображении:
Используйте здравый смысл, когда дело доходит до добавления подписей, но если вы чувствуете, что это может помочь читателям (и ботам) лучше различать изображение, то это может быть полезным добавлением на страницу.
3. Сжатие изображений для ускорения загрузки.
Сжатие изображений является жизненно важным компонентом любой хорошей стратегии оптимизации веб-сайта.
Почему?
Потому что, проще говоря, это помогает вашим веб-страницам загружаться быстрее, что обеспечивает лучший пользовательский опыт, а также помогает повысить рейтинг вашего сайта в поисковых системах.
Чтобы эффективно сжимать изображения, попробуйте такой инструмент, как Free Image Compression Tool компании Attrock, Compress JPEG или Squoosh.
Как правило, менее 100 КБ является идеальным с точки зрения хорошего размера файла.
Однако важно отметить, что Google не учитывает размер каждого отдельного изображения. Вместо этого он просматривает 90 293 всего 90 294 размера страницы.
Итак, если у вас есть небольшое изображение, где разница в качестве менее существенна, вы можете попробовать сжать это изображение до 30-50 КБ… что даст вам дополнительное пространство для сохранения другого изображения на 30 КБ больше, особенно если это изображение теряет качество после сжатие.
Если вы все еще беспокоитесь о качестве изображения после сжатия, ознакомьтесь с разделом Как обеспечить высокое разрешение изображений.
4. Публикуйте оригинальные изображения, а не только стоковые фотографии.
В конечном счете, Google (и читатели) отдают приоритет оригинальному контенту, а это означает, что если вы надеетесь, что ваши изображения будут ранжироваться на страницах результатов поиска изображений, крайне важно использовать оригинальные, уникальные изображения.
Это особенно важно, если вы работаете на веб-сайте электронной коммерции и публикуете изображения своего продукта. Многие покупатели используют изображения для покупки потребительских товаров. Фактически, 50% онлайн-покупателей говорят, что изображения помогли им решить, что купить.
Если ваше изображение не точно демонстрирует ваш продукт, оно будет скрыто под более качественными изображениями конкурентов.
Рассмотрите возможность использования таких продуктов, как Canva, для создания внутренней инфографики, графиков или анимированных изображений, которые помогут вашему бренду выделиться на страницах результатов поиска и сделать ваши изображения более доступными для обмена.
5. Перед загрузкой изображений назовите их.
Имя вашего файла может повлиять на то, насколько легко роботам поисковых систем будет интерпретировать ваше изображение, поэтому полезно переименовать файл до , загрузив его на свою веб-страницу.
Вместо того, чтобы использовать общее имя «IMG_0883», попробуйте использовать соответствующие ключевые слова для описания того, что находится на изображении, подобно вашему замещающему тексту. Это также поможет гарантировать, что ваше изображение появится на странице результатов поиска изображений, что увеличит посещаемость вашего сайта.
6. Используйте адаптивные изображения.
Адаптивные изображения имеют решающее значение для того, чтобы ваши читатели могли видеть ваши изображения на любом типе устройства. В настоящее время очень важно, чтобы ваши страницы были оптимизированы для мобильных устройств, чтобы влиять на рейтинг в поисковых системах, а также на удобство пользователей.
Если ваши изображения не адаптивны, страница не будет выглядеть на мобильных устройствах так же четко, как на настольных компьютерах, что негативно влияет на поисковую оптимизацию, а также на восприятие вашего бренда вашими читателями.
К счастью, некоторые службы хостинга веб-сайтов, в том числе HubSpot, автоматически обеспечивают адаптивность ваших изображений.
Однако, при необходимости, вы можете сделать ваши изображения адаптивными с помощью быстрого кода. Например, вы можете добавить в свой HTML-код следующий код:
Или этот код для вашего CSS:
.responsive {
width: 100%;
высота: авто;
}
7. Используйте изображения как возможность обратной ссылки.
Создание высококачественных, уникальных, оригинальных изображений не только отлично подходит для вашего собственного веб-сайта, но и дает прекрасную возможность заработать обратные ссылки, когда других веб-сайтов используют ваше изображение для своих страниц.
Например, рассмотрим следующий график, созданный широкополосным поиском:
Изображение в настоящее время занимает первое место на странице результатов поиска изображений по ключевым словам «сколько людей используют мобильные устройства для поиска».
Кроме того, по данным Ahrefs, этот пост в блоге имеет более 3000 обратных ссылок. Я готов поспорить, что эти обратные ссылки отчасти связаны с тем, что другие компании хотят использовать уникальные графики Broadband Search для своего собственного контента.
Если вы создаете высококачественные изображения, другие компании могут захотеть разместить эти изображения на своих сайтах со ссылками на ваш бизнес. Это означает, что, в конечном счете, изображения могут иметь прямое влияние на объем трафика, потенциальных клиентов и клиентов, которых вы получаете для своего бизнеса благодаря своим маркетинговым усилиям.
8. Добавьте изображения в существующую карту сайта.
Google предлагает добавить изображения в существующую карту сайта или создать отдельную карту сайта только для изображений, чтобы помочь поисковым системам обнаружить ваши изображения. В частности, это полезно для изображений, которые Google не может найти с помощью сканирования, например изображений, доступ к которым осуществляется через формы JavaScript.