Как в SVG вставить текст для SEO краулера?

Question

[hckn]

У меня на сайте есть логотип

<h1>
  <svg></svg>
<h1/>

Т.е. просто картинка в h1.
Я слабо знаком с SVG, но видел что часто туда прямо текст пишут, чуть ли не title

Как в SVG написать текст:

1. невидимый для юзеров, т.е. существующий только в разметке
2. чтобы боты могли прочитать выполнив document.querySelector('h1').innerText
3. чтобы код оставался валидным с точки зрения спецификации HTML

Comments

[Moskus]

1. ну так и вставьте элементы <title> и <desc>
3. формально невыполнимо, так как спецификация HTML определяет все в пространстве имен HTML, а SVG в него не входит, так что это требование сформулировано некорректно.

[hckn]

Moskus, а у вас есть сведения со стороны сео по поводу тайтла в свг?

[hckn]

И я имел ввиду спецификауию не только хтмл. У свг вероятно же тоже есть?

[Moskus]

hckn, есть сведения что то, чем вы занимаетесь - трата времени из области шаманизма.

Answer 1

[Арсений Матыцин]

В качестве innerText никак.
SVG упорядочевается другим алгоритмам валидности относительно HTML разметки, так что…
Чисто теоретически можно попробовать использовать h1 прямо в разметке SVG и, если она будет записана, как есть, а не через, например, Embed — прочитается

Но есть мнение, что вы хотите просто заставить поисковик увидеть текст. Если это так:
1. Не используйте логотип в h1
2. Используйте img, object который будет подсасывать файл svg. И тут уже используйте alt и title

Ну главное, согласен с оратором в комментариях: запрос составлен некорректно. И задача, скорее всего, поставлена также.

Comments

[hckn]

Да просто я анимирую эту SVG, поэтому мне надо вставить именно кодом. Попробую тайтл, но не совсем ясна SEO сторона этого действия, впрочем, я слишком заморачиваюсь.

[Арсений Матыцин]

SEO жрет title, который находится в , он должен соответствовать запросу, h1 может содержать, например, высокочастотник.
Поэтому смело убирай лого из h1 и делай так, как тебе удобно. И можешь бить палкой того, у кого увидел логотип в качестве h1 (если он не является 100% вхождением в запрос, например)

[hckn]

Арсений Матыцин, логотип в h1 это стандартно довольно-таки. Самый главный заголовок страницы - ее лого, которое в 99% символизирует название сайта. Если убрать лого из h1, тогда непонятно как быть с советом делать название сайта в h1 (у меня просто вместо названия логотип, который и есть названием)

Пример из жизни - тот же Твиттер. Там отрабатывает и document.querySelector('h1').innerText

[Moskus]

hckn, вы верите, что у Twitter это сделано для SEO и что это точно не плод творчества индийских рабов?

[Арсений Матыцин]

Я занимаюсь разработкой и поддержкой сайтов последние лет 7, видел, как сайты продвигались чисто по ключам (keywords) и как поисковики стали пользоваться услугами обычных людей для поиска релевантности. Я, конечно, не эксперт непосредственно в SEO (по крайней мере в его текстовом формате), но то, что логотип не должен быть в H1 знаю наверняка. Так и то, что я описал выше. Включая исключения.

Так что еще раз предлагаю пойти закидать камнями того, кто сказал или показал, что h1 с логотипом в нем это круто.

[Арсений Матыцин]

hckn, К слову, о твиттере. На данный момент он, как и FB, VК. Это значит, что им нет смысла использовать SEO вообще для продвижения бренда. К тому же все они — приложения с данными доступными в сети, а остальном мало отличаются от обычной админки WP. А первое правило приложения — можешь забить болт на семантику вообще и хоть все сделать на div. Блоки, тексты, наплевать, в приложении главное получить информацию, ввести и обработать.

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

[hckn]

Moskus, может и не для СЕО, а для accessibility (что автоматом идет и в СЕО плюсом). Суть в том, что там каждое решение обдумано до мелочей.

[hckn]

Арсений Матыцин, вообще да, сейчас посмотрел контентные сайты топовые. У них логотип просто в ссылке. h1 - это заголовок статьи. На главной странице вообще ниодного h1 нету! Спасибо за замечание, вы правы.

[Moskus]

hckn, не делайте из Twitter икону. Там тоже живые люди работают, которые могут быть дураками. Вон, Flickr - многомиллионный бизнес, а там такая чума творится... Вам тут дело говорят, h1 - для текстового заголовка страниц, а не для картинок.