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

  1. Alt изображения и теги описания
  2. Размер изображения в SEO
  3. Организация изображений
  4. Какой формат изображения?
  5. Рейтинг в Google Images

Многие люди не понимают, сколько изображений играют на значимость SEO в целом. Хорошо известно, что Google предпочитает страницы с мультимедиа. Это означает, что обычно он предпочитает веб-сайт с большим количеством изображений, видео, PDF-файлов и т. Д., А не просто текст.

Но это не так просто, как просто добавить несколько изображений на ваш сайт. Подобно тексту и HTML, изображения также должны быть оптимизированы для поисковых систем. Несколько ключевых указателей для начала:

  • постарайтесь сделать изображения как можно меньше с точки зрения размера файла
  • Назовите свое имя файла изображения (example.jpeg) как-нибудь подходящее, желательно с целевым ключевым словом.
  • используйте метаданные изображения, такие как тег alt изображения, тег заголовка и заголовок, предпочтительно с ключевыми словами
  • бонусные баллы, если вы окружаете свои изображения ключевыми словами

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

Когда дело доходит до размера вашего изображения, есть несколько быстрых советов, чтобы сделать ваше изображение как можно меньше. Всегда сохраняйте свое изображение с минимальным разрешением. Например, предположим, что на вашем веб-сайте отображается только небольшой эскиз размером 200x200 пикселей, не загружайте его размером 4000x4000 пикселей и не уменьшайте его на своем веб-сайте.

Alt изображения и теги описания

Тег alt и описание изображения - это атрибут, который вы можете добавить ко всем тегам изображения.

Знаете ли вы настоящую причину существования альтернативных тегов изображения? Если ваше изображение по какой-либо причине не может быть отображено, ваш веб-браузер вместо этого будет отображать альтернативный текст или тег «alt». Еще одна причина, по которой можно использовать теги alt для изображений, заключается в том, что они помогают повысить рейтинг в Поиске картинок Google Когда сканер изображений Google посещает ваш сайт, так как он не может прочитать большинство типов изображений, он попытается захватить метаданные и другой текст вокруг изображения.

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

Размер изображения в SEO

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

Недавним примером этого могут служить изображения, содержащиеся в этом руководстве. Многие из них начинались с размера 100 КБ, они сохранялись как 50 КБ, а затем оптимизировались с использованием TinyPNG и нашего собственного сервера, уменьшая его до 15 КБ или менее. Это более чем на 75% меньше! Представьте, насколько быстрыми были бы веб-сайты, если бы все это делали.

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

Организация изображений

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

Если вы не чувствуете себя креативным, по крайней мере, создайте папку с именем «images» и используйте ее для хранения всех ваших изображений. Я лично рекомендую

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

Структурированные данные изображения

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

<div itemscope itemtype = "http://schema.org/ImageObject"> <h2 itemprop = "name"> Фотография чего-либо </ h2> <img src = "mexico-beach.jpg" itemprop = "contentUrl" /> Автор: <span itemprop = "author"> Патрик Кумб </ span> Снимок сделан в <span itemprop = "contentLocation"> Delray Beach, FL </ span> Дата загрузки: <meta itemprop = "datePublished" content = "2008-01- 25 "> 25 января 2015 г. <span itemprop =" description "> Я сделал этот снимок во время прогулки </ span> <div itemprop =" exifData "itemscope itemtype =" http://schema.org/PropertyValue "> <meta itemprop =" name "content =" Время экспозиции "> <meta itemprop =" value "content =" 1/500 сек. "> </ div> <div itemprop =" exifData "itemscope itemtype =" http: //schema.org/PropertyValue "> <meta itemprop =" name "content =" FNumber "> <meta itemprop =" value "content =" f / 3.0 "> </ div> <div itemprop =" exifData "itemscope itemtype itemtype = "http://schema.org/PropertyValue"> <meta itemprop = "name" content = "MaxApertureValue"> <meta itemprop = "value" content = "2.00"> </ div> <div itemprop = "exifData" itemcope item type = "http://schema.org/PropertyValue"> <meta itemprop = "name" content = "Flash"> <meta itemprop = "value" content = "Flash Off."> </ div> </ div>

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

Какой формат изображения?

При сохранении изображения в Photoshop или даже в Paint важно знать, в каком формате его сохранить.

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

Поиграйте с форматами изображений и посмотрите, насколько они велики, когда вы их сохраните. В этом примере эта фотография моего брата, сохраненная в Photoshop в формате JPEG, имеет размер 200 КБ (при максимальных настройках). Сохраните точно такую ​​же фотографию как PNG, и она будет более чем в два раза больше.

Рейтинг в Google Images

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

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

Оптимизация изображения инфографики

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

Знаете ли вы настоящую причину существования альтернативных тегов изображения?
Какой формат изображения?

Читайте так же:

  • Лимо-такси (LIMO-TAXI)
  • По Днепру была запущена «речная маршрутка»
  • Эконом такси Чайка
  • Трамвайные линии Екатеринослава 1897-1906 гг.
  • Каприз такси

Комментарии запрещены.

Новости