Является ли SVG лучше для SEO, чем другие форматы изображений?
Читая статью в Интернете, я прочитал, что SVG лучше подходит для SEO, чем другие форматы изображений. Насколько это верно? Кроме того, при добавлении изображения SVG на веб-сайт его следует добавлять как <svg>
или <img>
?
2 answers
В подавляющем большинстве случаев использования SVG не получает никаких особых преимуществ по сравнению с другими форматами изображений с точки зрения SEO. Однако изображения SVG часто меньше, чем их аналоги в других форматах изображений, что увеличивает время загрузки страницы, что косвенно способствует SEO.
Единственное, в чем SVG не намного лучше, так это в том, что поисковые роботы индексируют содержимое, не содержащее изображений, встроенное в них. Хотя искатели могут индексировать текстовое содержимое, они не переходят по ссылкам, и иначе они не смогут понять структуру SVG-документа.
Вопрос о том, следует ли использовать <img>
или <svg>
, в основном эквивалентен вопросу о том, имеет ли смысл связывать ваши изображения извне с помощью <img>
или встроить их с помощью <svg>
(вы также можете встроить их с помощью <img>
с URI данных, но это не рекомендуется, так как это увеличивает размер файла и противоречит назначению текстового формата SVG). в 90 % случаев имеет смысл связать ваши изображения веб-сайта внешне с помощью тега <img>
.
Также обратите внимание, что встроенные изображения SVG не могут быть включены в поиск изображений Google, только изображения с собственным путем на сервере имеют право на включение. Поэтому, если вы хотите, чтобы ваши SVG-изображения отображались в поиске изображений, обязательно свяжите их внешне с помощью тегов img
.
Существует также третий вариант встраивания, который заключается в использовании тега <object>
, но его следует использовать только для SVG, которые имеют сценарии или интерактивные содержание, и выходит за рамки этого ответа.
Чтобы расширить превосходный ответ Максимиллиана, важно отметить следующее:
Меньший размер SVG подходит только для иллюстраций, таких как логотип и другие изображения, которые состоят из сравнительно небольшого количества форм и цветов. Он совершенно непригоден и потребляет огромное количество ресурсов при использовании для фотографических изображений. (Или он просто встроит растровое изображение, тем самым полностью сведя на нет преимущества SVG).
Причина этого заключается в различии между векторными изображениями и растровыми изображениями "ведьма" - слишком большая тема для ответа на этот вопрос, но ее стоит изучить, если вы еще этого не сделали.