Vue-FAQ
925 subscribers
563 photos
90 videos
558 links
Канал сайта https://vue-faq.org
Информация о Vue.js, фронтенд разработке и не только

Contacts: @RuslanMakarov
Download Telegram
Адаптировал для Реддита и запостил там свою статью Google и Yandex SEO оптимизация для SPA приложений

Как обычно, на таких ресурсах интересны комментарии пользователей.
Первый комментарий - что Bing тоже уже несколько лет хорошо понимает JavaScript
Второй, от false_creek_change, приведу здесь:

Консультант по
SEO/a11y на проводе. Не могу передать, сколько раз я сталкивался с SEO-специалистами и/или клиентами, которые клялись, что вам нужен SSR, чтобы поисковые роботы правильно индексировали ваш SPA. Это не так уже почти десять лет. Есть множество гигантских Ecommerce брендов, которые используют SPA уже много лет и имеют чрезвычайно высокие показатели SEO (на ум приходит Walmart). Анекдотично, я лично руководил конверсией сайта .NET MVC Ecommerce со 100 000+ SKU на Vue 2 SPA, и мы действительно увидели улучшение наших SEO-метрических показателей. Это было 8 лет назад.

Мы обычно исходим из следующих соображений:

- Является ли HTML семантическим и доступным (a11y)?
- Предоставляется ли схема через JSON+LD и/или теги?
- Соответствуют ли основные показатели сайта (core web vitals) требованиям?
- Требует ли контент действий пользователя перед загрузкой? Например, если навигация по категориям находится в меню, который по умолчанию скрыт, то такая навигация может не индексироваться. В общем случае, если что-то может быть сделано через SSR, то это же также может быть отображено на стороне клиента и проиндексировано.

Все это Google укажет в Search Console / Lighthouse, чтобы сообщить вам о наличии проблемы.


#seo #spa #google #ssr
Еще о SEO

Case study с сайта Strapi

Наше одностраничное приложение (SPA) на базе Nuxt. js генерируется статически и передается через CDN по всему миру для максимальной скорости и доступности. Это необычно для электронной коммерции, но позволяет нам поддерживать множество продуктов без необходимости предварительно рендерить и статически генерировать тысячи страниц во время сборки/развертывания, так как мы столкнулись с этой проблемой на ранних этапах разработки.

Мы используем CDN Netlify и их предварительный рендерер, который обрабатывает запросы для
SEO и обновлений, поскольку у нас обычно нет серверных или индексных файлов.

Для Seo можно использовать пререндереры хостеров, как здесь.

#seo #nuxt
Хм..
Почитал как работают Core Web Vitals и прозрачным прямоугольником на сплэш-скрине смог свести LCP до минимума (ранее был в районе 2 секунд)

Это этим занимаются SEO-специалисты?

#seo #webvitals
Маск делает "беспристрастный" поисковик, альтернативу Google

(шутка)

#musk #seo
Если вы используете Google Analytics то Google Pagespeed часто ругается сам на себя - gtag.js размером в 100Кб+ снижает показатели сайта.

Можно сделать следующий финт:

 <script async src="https://www.googletagmanager.com/gtag/js?id=G-0SGZMMY7Y4"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());

gtag('config', 'G-0SGZMMY7Y4');
</script>


меняете на

<script>
window.addEventListener('load', function() {
setTimeout(() => {
var script = document.createElement('script');
script.src = 'https://www.googletagmanager.com/gtag/js?id=G-0SGZMMY7Y4';
script.async = true;
document.head.appendChild(script);

window.dataLayer = window.dataLayer || [];
function gtag(){ dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', 'G-0SGZMMY7Y4');
}, 3000);
});
</script>
});


Ушедшие в первые 3 секунды посетители считаться не будут, но они, обычно, и не нужны.

#google #seo
К хорошим новостям

Год назад я делал испытания по индексации поисковиками SPA на Vue, и тогда Google справился, а Яндекс не потянул

За прошедшее время Яндекс подучился и поумнел (скриншот)

Итого, Vue SPA:

1. Индексируются поисковиками
2. Дают лучшие показатели Web vitals, чем SSR Nuxt

Да, постраничный OpenGraph по-прежнему надо делать для SPA отдельным скриптом на сервере, но это простая небольшая логика.

Чем там ещё SSR фреймворки хвалились?

Всегда говорил, что BFF SSR - тупиковая ветвь развития фронтенда, усложняющая архитектуру и загрязняющая код веб приложения без необходимости. Те самые "фокусы". Видимо, доходит и до других, потому как в последнее время что-то часто встречаются статьи типа: "Nuxt это не только SSR"

#ssr #seo #nuxt
Эван поставил на свои проекты llms.txt

https://vite.dev/llms.txt
https://rolldown.rs/llms.txt
https://vuejs.org/llms.txt

Сгенерированы vitepress-plugin-llms
(надо было ловить хайп и писать такой плагин)

#ai #seo