Comments 27
Вопрос, что делать с seo в spa, где весь html это один div, а весь контент подгружается и рендерится динамически. P.S. ssr опускаем за скобки вопроса
Поисковики вполне умеют в обработку динамического контента и нормально индексируют.
Хороший вопрос, звучит как тема для еще одной статьи :)
Если вкратце, то следить за отображением контента на странице (есть достаточно расширений и сервисов, которые отображают, какие элементы отдаются роботу при отключении JS) + один из популярных способов - это пререндер, который отчасти решает проблему динамического контента.
Так смысл spa в том, что без js вообще нет никакого контента, кроме одного пустого div. Также не работает и пререндер, так как есть только один html, который состоит только из одного div, а любые страницы рендерится динамически.
Поэтому вопрос все ещё открыт.
Делаешь пререндер страниц, при первой загрузке отдаешь html в теге id="app"
Дальше как js загрузится будет спа, при дальнейших переходах тоже
бот заходит на целевую страницу, он увидит контент и разметку, для пользователя ничего не изменится
либо SSR
Где делаешь пререндер? Если на сервере, то это уже вопрос в сторону ssr.
Опять уход от вопроса. Как без изменений на сервере, только на фронте в spa улучшить seo
Где уход от вопроса то?
Если проект это чисто спа, то нужно ли там сео?
Если делаешь проект под сео значит надо изначально брать подходящий инструмент
Для лендоса неважно спа или не спа, так как там особо нечему индексироваться, либо он будет огроменный и до цели клиент не дойдет
Сайт на 500+ страниц делать как спа выбор странный
Хотите и сео и спа то вопрос к ssr
Либо надеяться что поисковые роботы дождутся рендера
и работаем с мегатегами
чего только не узнаешь...
А еще можно картинки сохранять в нужный размер и как jpg, тогда вместо 1.5 мб размер станет 40 кб.
Одно из самых старых правил SEO: тег
h1на любой странице всегда должен быть один
Если только вы не слышали про html5
<body>
<h1>Заголовок 1</h1>
<article>
<h1>article 1 Заголовок</h1>
<p>Какойто текст</p>
</article>
<article>
<h1>article 2 Заголовок</h1>
<p>Какойто текст</p>
</article>
</body>Например, здесь можно использовать h1 не беспокоясь на каком уровне находится конкретный раздел. https://www.w3.org/TR/2013/CR-html5-20130806/sections.html#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements
Это связано с тем, что поисковые системы считают наиболее важной информацию, которая ближе расположена к главной сайта
Сомневаюсь, что вы знаете как работает поисковая система изнутри
Например, здесь можно использовать
h1не беспокоясь на каком уровне находится конкретный раздел. https://www.w3.org/TR/2013/CR-html5-20130806/sections.html#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements
В теории всегда звучит красиво, буду рада почитать про Ваши кейсы продвижения подобных документов :)
Вы ссылаетесь на устаревшую и уже не актуальную версию спецификации, ещё и на снапшот от 2013 года. Официальная спецификация — HTML Living Standard.
В старых стандартах действительно можно было использовать сколько угодно <h1>, это относилось к попытке реализации алгоритма outline с вычислением уровня заголовка на основе вложенности секционных элементов.
Но этот алгоритм не был реализован ни одним из браузеров, и в конечном счёте его удалили из стандарта. Сейчас в примерах используются уровни заголовков, хотя и есть один пример с несколькими <h1>.
Но если выйти за пределы стандартов HTML и посмотреть на те же обшепринятые практики SEO или стандарты доступности, то всё-же правило "один <h1> на страницу" актуально. Более того, это даже логично.
С одной стороны логично, с другой нет. Например есть title в котором и пиши главный заголовок. Тег article - это отдельная сущность, которую можно вырезать из одного документа и вставить в другой, без переписывания в нём тегов.
В самой же спецификации не запрещено. Наоборот, разрешено. Ссылку которую вы скинули не просто какой-то пример с несколькими h1, на нём так и написано: A document can contain multiple top-level headings (Документ может содержать несколько заголовков верхнего уровня) т.е. его именно для этого туда и поместили.
То что в старых версиях спецификаций и в новых это не запрещается, значит можно. То что СЕОшники говорят что так нельзя, ну так копируют друг друга, они много что говорят. Причем, как видно, в разрез со спецификацией. Да, набор их действий правильно/неправильно может привести к какому-то положительному результату, но они точно не скажут что это случилось из за этого вот тега.
Сотня статей и видосов по SEO прочитано и пересмотренно. Но оно просто не хочет работать и все тут. Гуглу вообще пофиг на то сколько товаров, что на каждом товаре уникальный текст, что у каждого товара есть 1 h1, описание на 1200 слов с заголовками до h3, ключевыми словами. Гуглу пофиг, что у каждой страницы с каталогом также есть h1 допустим "Gold rings", если выбрать в фильтрах gold, zircon, то h1 будет gold ring with zircon (Это делается динамически), описание. То есть страницы явно подходят под структуру, а эту фичу с динамическим h1, описанием, мета title, description, я задолбался реализовывать. И ничего, за год существования сайта с такой структурой просто ничего. Я не знаю, это может быть связанно, что язык сайт en, весь текст en, а хостинг в турции?
Что Вы имеете в виду под "ничего" ? Нет желаемых позиций, продаж, сайт не в индексе?
Какой у вас регион продвижения?
Нет показов по ключевым словам, например, silver rings, buy silver ring, zircon ring, ring with zircon, jewelry handmade, online jewelry shop, и т.д. хотя слова используются в меню, описании товара, страниц, мета тегах страниц. Сайт на английском продвижение на англоговорящих, а какой регион, я не знал, что его можно выбирать при продвижении. Раньше сайт был на турецком, хостинг турецкий.
Ничего я имею ввиду 84 клика за год и 1000 показов. И то в основном по названию сайта, или по словам типо eo7(несколько кликов), так раньше назывался товар, потом был переименован в что-то типо Silver earring with diamonds "Night dream". То что пишется в кавычках это для того чтоб каждее название было уникально, потому что таких серёжки с бриллиантами там сотни.
Есть другой проект. Там индексируется по словам RTX4060 laptoplar, asus vivo book ..., msi Victor gp66, и прочие ноуты. Показов мало и позиция низкая( 50 - 100 место), но он индексирует хотя-бы по этим словам.
Знаю, что нужно закупать ссылки вкладывать деньги и тд. , но перед этим ведь надо чтоб вообще текста нормально работали, на сайте с ноутами можно попробовать, а вот на сайте с ювелирной вообще не идет
С точки зрения HTML всё может быть сделано правильно. Но это лишь один из факторов. Текст может быть уникальным, и описания по 1200 символов, но само содержание текстов, ключевые слова, формулировки могут не нравиться гуглу.
Также сайт может иметь все метатеги и правильную иерархию заголовков, но быть медленным как для пользователя, так и с точки зрения метрик Lighthouse.
Если сайт работает как SPA на модных фреймворках, это тоже может свести на нет усилия по созданию структуры и уникальных текстов. В общем нужно детальнее копать.
Про h1 это скорее общепринятая рекомендация чем обязанность.
Как человек, который не раз это все реализовывал по таскам от сеошников, скажу что в статье не хватает примеров. И как там насчёт schema.org?
Про schema.org уже рассказывали в другой статье, на которую дала ссылку :)
Ранее мы выпустили текст о том, как разработать HTML-шаблон страницы с учетом SEO. Моя статья ориентирована больше на оптимизацию разных типов сайтов, а не код.
Буду благодарна, если подробнее поделитесь, каких примеров Вам не хватило? Возможно, смогу дополнить статью ими.
Сайты услуг. Такие веб-ресурсы обычно предлагают какой-либо сервис и могут быть созданы как на более сложной CMS (Content Management System)
Кажется на скриншоте у вас как раз таки агрегатор курсов из различны школ, а не сайт услуг.
Как настроить SEO при создании сайтов самостоятельно?