سئو جاوااسکریپت (JavaScript SEO) چیست؟ گوگل چطور سایت‌های JS را می‌بیند

JavaScript SEO سئو فنی و سرعت به‌روزرسانی: ۱۱ آبان ۱۴۰۵
تعریف کوتاه

سئو جاوااسکریپت یعنی مطمئن شدن از اینکه موتورهای جستجو محتوا و لینک‌هایی را که با جاوااسکریپت ساخته می‌شوند ببینند و ایندکس کنند. گوگل جاوااسکریپت را رندر می‌کند، اما با تأخیر و محدودیت؛ و بسیاری از خزنده‌های دیگر، از جمله اغلب ربات‌های هوش مصنوعی، اصلاً اجرایش نمی‌کنند.

گوگل چطور صفحه‌ی جاوااسکریپتی را پردازش می‌کند؟

  1. خزش: Googlebot HTML اولیه را دریافت می‌کند.
  2. صف رندر: صفحه برای اجرا با یک نسخه‌ی به‌روز کروم در صف قرار می‌گیرد. معمولاً سریع است، اما ممکن است تأخیر داشته باشد.
  3. ایندکس: HTML نهایی بعد از اجرای جاوااسکریپت تحلیل می‌شود.

هر چیزی که در HTML اولیه باشد، مطمئن‌تر و سریع‌تر دیده می‌شود.

رندر سمت سرور یا سمت کاربر؟

  • CSR (رندر سمت کاربر): HTML تقریباً خالی است و محتوا در مرورگر ساخته می‌شود. بیشترین ریسک سئو.
  • SSR و SSG (رندر سمت سرور و تولید ایستا): HTML کامل از سرور می‌آید و جاوااسکریپت فقط تعامل را اضافه می‌کند. بهترین گزینه برای سئو؛ فریم‌ورک‌هایی مثل Next.js و Nuxt این را ساده کرده‌اند.

«رندر پویا» (نشان دادن نسخه‌ی جدا به ربات‌ها) را گوگل فقط یک راه‌حل موقت می‌داند و برای پروژه‌های جدید توصیه نمی‌کند.

چرا مهم‌تر از قبل شده؟

بسیاری از خزنده‌های سرویس‌های هوش مصنوعی و برخی موتورهای جستجو فعلاً جاوااسکریپت را اجرا نمی‌کنند. محتوایی که فقط بعد از اجرای JS ظاهر می‌شود، ممکن است در پاسخ‌های این سرویس‌ها اصلاً دیده نشود.

اشتباه‌های رایج

  • لینک‌های غیرواقعی: ناوبری با onclick یا دکمه به‌جای <a href>؛ گوگل فقط لینک‌های واقعی را دنبال می‌کند.
  • آدرس‌های مبتنی بر # برای صفحه‌های مختلف.
  • کد وضعیت اشتباه: اپلیکیشن تک‌صفحه‌ای که برای صفحه‌ی ناموجود کد 200 برمی‌گرداند (Soft 404).
  • محتوای وابسته به تعامل: متنی که فقط با کلیک یا اسکرول بارگذاری می‌شود.
  • بستن فایل‌های JS در robots.txt.

چطور بررسی کنیم؟

در URL Inspection سرچ کنسول، گزینه‌ی «View crawled page» و تب HTML نسخه‌ی رندرشده را نشان می‌دهد. آن را با «View Page Source» مرورگر (HTML خام) مقایسه کنید؛ اگر محتوای اصلی فقط در نسخه‌ی رندرشده هست، به خزنده‌های بدون JS آسیب‌پذیرید.

آموزش کامل آموزش کامل سئو تکنیکال: خزش، ایندکس و ساختار فنی سایت