Оптимизация изображений: как оптимизировать изображения для поиска

Там гораздо больше для поиска, чем 10 синих ссылок. MozCast показывает, что более 36% поисковых запросов содержат изображения.

Не говоря уже обо всех поисках, выполненных с помощью Google Image Search. Это огромное количество потенциального взаимодействия с веб-сайтом для брендов. Тем не менее, многие создатели веб-сайтов не тратят время на оптимизацию изображений, которые они используют для своего сайта — они считают, что простой строки альтернативного текста достаточно, чтобы угодить сложному алгоритму поисковой оптимизации изображений Google.

Но алгоритм Google становится умнее с каждым днем.

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

Оптимизация изображений для взаимодействия с пользователем

Хотя все SEO-стратеги хотят, чтобы их контент занимал высокие позиции в Google, важно создавать контент, обеспечивающий отличный UX (пользовательский опыт). Чем лучше вы предоставляете UX, тем выше вероятность вовлечения и конверсии. Вот почему лучшая оптимизация изображений включает в себя контекст, релевантность и качество сайта.

Вот как вы можете оптимизировать изображения для удобства пользователей.

Продумать размещение изображения

Выбор места размещения изображения на веб-странице больше всего влияет на контекст и релевантность. Многие создатели сайтов добавляют одно или два изображения в произвольные разделы своей веб-страницы, чтобы разбить текст. Но это может в конечном итоге сбить с толку и отвлечь вашу аудиторию. Изображения следует размещать рядом с наиболее релевантным текстом, чтобы предоставить посетителям контекст. Обратите внимание, как изображение в следующем разделе связано с текстом. Это также помогает Google предоставлять соответствующие изображения для соответствующих поисковых запросов.

Используйте качественные и уникальные изображения

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

Как объясняет Джон Мюллер из Google, «если вы пытаетесь получить рейтинг в Google Images, то использование того же изображения, что и на многих других сайтах, не принесет вам много пользы».

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

Обеспечьте удобство для мобильных устройств

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

Как правило, комбинация HTML, CSS и Javascript используется для отображения правильного размера изображения в зависимости от устройства. Большинство сайтов уже оптимизированы для мобильных устройств. Если вы работаете с очень старым сайтом или не уверены, просто отрегулируйте ширину веб-браузера. Вы должны увидеть, как изображения масштабируются по мере изменения размера окна браузера. Подробнее о создании адаптивных изображений можно прочитать в этом руководстве .

Не забывайте о качестве сайта

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

Как оптимизировать изображения для скорости

Согласно отчету Google , вероятность того, что посетители уйдут с веб-страницы, увеличивается на 32%, поскольку «время загрузки страницы уменьшается с 1 секунды до 3 секунд». Эта высокая статистика показывает, что скорость загрузки является важным фактором успеха веб-страницы. И ничто так не замедляет работу страницы, как изображение, которое загружается слишком долго.

К счастью, есть несколько способов оптимизировать изображение для повышения скорости загрузки страницы.

Выберите правильный формат изображения

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

1. PNG : Форматы PNG обычно используются для графики, снимков экрана или изображений, требующих сохранения прозрачности фона.
2. JPEG : самый известный из форматов изображений, JPEGS хорош для больших фотографий или иллюстраций.
3. SVG : лучше всего подходит для любых пользовательских логотипов или значков, которые можно просматривать в разных размерах.
4. WebP : лучший вариант для получения высококачественных результатов для изображений меньшего размера.
5. BMP : считается более устаревшим вариантом, BMP используется для растровых изображений.
6. GIF : для движущейся графики или анимации.

С оптимизацией изображений ведутся большие споры о том, что лучше с точки зрения оптимизации: GIF или видео. Оба формата имеют свои преимущества и недостатки. Видео, как правило, привлекают больше всего внимания — почти 70% потребителей с большей вероятностью купят продукт после просмотра видео о нем. В то же время видео, как правило, загружаются дольше, чем гифки, что может замедлить скорость страницы. Какой из них выбрать, будет зависеть от других элементов, которые есть на вашей веб-странице. Если он многотекстовый, рассмотрите возможность использования только GIF-файлов. Если на вашей странице их меньше, вы можете безопасно использовать видео без ущерба для скорости загрузки.

Помните о степени сжатия изображения

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

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

Рассмотрите возможность использования плагина WordPress для оптимизации изображений. Для блога MarketMuse мы используем Kraken . После настройки он автоматически сжимает изображения при их загрузке в CMS. Это идеально подходит для создания эффективного рабочего процесса.

Выберите правильные размеры изображения

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

Инструмент проверки браузера Chrome поможет вам быстро определить подходящий размер. Визуализированный размер — это размеры, в которых отображается изображение. В блоге MarketMuse ширина столбца составляет 760 пикселей, что фактически является максимальной шириной, при которой будет отображаться изображение. Внутренний размер — это размер изображения, загруженного в WordPress (наша CMS). Обычно внутренняя ширина не должна быть больше визуализируемой.

Исключением из правила являются скриншоты, на которых вы хотите, чтобы посетители видели все детали, которые они упустили бы на изображении меньшего размера. Например, в блоге MarketMuse мы часто показываем скриншоты нашей платформы. Но часто трудно различить отдельные функции с какой-либо точностью из-за ограничения ширины столбца в 760 пикселей.

Таким образом, исходное изображение (в данном случае шириной 1644 пикселя) загружается в WordPress и отображается в меньшем размере шириной 760 пикселей. Когда читатели нажимают на изображение, оно открывается в полном размере, где детали можно увидеть во всей красе.

Краткое примечание . Если сжатия изображения недостаточно, рассмотрите возможность использования CDN (сети доставки контента). CDN — это географически распределенная группа серверов, которые работают вместе для обеспечения быстрой доставки интернет-контента. Эта разница в скорости может быть весьма существенной, а стоимость минимальной, а в некоторых случаях бесплатной. Прочтите это руководство от Cloudflare , чтобы узнать больше.

SEO-оптимизация изображений для Discovery

Изображения не могут ранжироваться в Google, если они не обнаружены. В этом отношении могут помочь два предмета; карта сайта изображения и семантическая разметка.

Используйте карты сайта для изображений

Что такое карта сайта для изображений и как она помогает Google находить ваши изображения? Карта сайта для изображений — это XML-карта сайта, предназначенная для перечисления всех URL-адресов изображений на сайте. Карта сайта — это, по сути, план, который помогает Google находить, понимать и сканировать соответствующие URL-адреса на вашем сайте.

Технически вам не нужна карта сайта. Вы можете просто отправить URL-адреса через Google Search Console. Но гораздо эффективнее иметь его, особенно когда он автоматически обновляется по мере выхода нового контента.

Для блога MarketMuse мы используем RankMath , плагин WordPress, который обрабатывает карты сайта среди множества других задач SEO. Это в значительной степени установить и забыть. Это руководство от Google по созданию карты сайта может быть полезно, если вам нужно создать ее вручную.

Учитывайте семантическую разметку

Поначалу словосочетание «семантическая разметка» может показаться изначально сложным. К счастью, это не какое-то слишком сложное программное обеспечение, о котором вам нужно беспокоиться. Семантическая разметка относится к разметке содержимого или HTML конкретной страницы. Это помогает людям и поисковым системам лучше понимать содержимое страницы. Это делает его идеальным для оптимизации изображения.

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

SEO-оптимизация изображений для индексации

Есть несколько вещей, которые вы можете сделать, чтобы Google точно индексировал ваши изображения.

Получить описание

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

Включите структурированные данные

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

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

Используйте альтернативные теги

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

Есть несколько ключевых советов по написанию хорошего альтернативного текста , который оптимизирует ваше изображение.

• Используйте целевое ключевое слово (ключевые слова) . Добавление целевых ключевых слов в альтернативный текст — это основной способ связать ваш сайт с соответствующими темами и повысить его видимость в поисковой системе.
• Будьте краткими : от 80 до 125 символов (около 16 слов) для максимальной доступности . До 50 слов для ранжирования в Google Image Search.
• Избавьтесь от ненужных фраз . Никогда не начинайте тег alt с таких фраз, как «Это изображение ____» или «Это изображение ____». Это избыточно и занимает основное место. Перейдите прямо к источнику изображения для краткости и ясности.

Краткое примечание : частый вопрос, когда дело доходит до индексации, заключается в том, индексирует ли Google изображения CSS. Ответ - нет. Джон Мюллер из Google заявил, что лучше использовать обычные теги изображений и с атрибутом alt, указывающим на изображение.

Вынос

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