پرش به محتوای اصلی
بهترین روش‌های SEO در Next.js برای بازار ایران
توسعه وب

بهترین روش‌های SEO در Next.js برای بازار ایران

۲۵ اردیبهشت ۱۴۰۵ · تیم XSofts · 8 دقیقه

Next.js
SEO
React

چرا SEO در Next.js فرق می‌کند؟

در صفحات کلاسیک React، موتور جستجو اغلب با یک پوسته خالی روبه‌رو می‌شد. App Router این را عوض کرده است: HTML در سرور ساخته می‌شود، generateMetadata برای هر مسیر title و description یکتا می‌دهد، و sitemap و robots بخشی از خود اپ هستند. برای سایت فارسی همین ابزارها کافی نیستند؛ باید RTL، فونت عربی، سرعت شبکه ایران و دامنه یکتا را هم از روز اول درست بچینید.

اگر محصول یا سایت شرکتی می‌سازید، این کار را به عنوان یک چک‌لیست فنی ببینید، نه یک مرحلهٔ بعد از لانچ. جزئیات پیاده‌سازی وب را در صفحهٔ توسعه وب هم آورده‌ایم.

Metadata داینامیک، نه یک title برای همه

با generateMetadata برای هر صفحه title، description و Open Graph جدا بسازید. metadataBase را روی دامنهٔ canonical بگذارید تا تصویر و URL نسبی به آدرس مطلق تبدیل شوند. title را کوتاه و مشخص بنویسید؛ description باید یک جملهٔ واقعی باشد، نه تکرار کلمات کلیدی.

برای مقالات و نمونه‌کار، openGraph.type را article کنید و تاریخ انتشار را بدهید. اگر صفحه نباید ایندکس شود — مثل پنل ادمین یا نتیجهٔ جستجوی داخلی — همان‌جا robots را ببندید. یک اشتباه رایج این است که layout ریشه noindex داشته باشد و بعد انتظار رتبه از صفحات داخلی برود.

Canonical و یک دامنه، نه دو سایت موازی

یکی از www یا بدون www را انتخاب کنید و دیگری را با ۳۰۱ هدایت کنید. در عمل https://xsofts.ir مدل پایدارتری است چون گواهی، کوکی و Search Console روی یک مبدأ می‌مانند. sitemap و og:url باید همیشه https باشند.

هدایت را هم در لایهٔ اپ (middleware) و هم در Nginx یا CDN تکرار کنید. اگر فقط یکی از این دو کار کند، بعضی مسیرها با دو URL زنده می‌مانند و اعتبار لینک تقسیم می‌شود.

Schema.org به زبان موتور جستجو

Organization، WebSite، Article، FAQPage و BreadcrumbList را با JSON-LD تزریق کنید. برای صفحات خدمات از نوع Service و برای محصول نرم‌افزاری از SoftwareApplication استفاده کنید. نام سازمان، لوگو و لینک شبکه‌ها را در همهٔ صفحات یکسان نگه دارید؛ تناقض در نام برند سیگنال ضعیف است.

پرسش‌های متداول را فقط وقتی با FAQPage علامت بزنید که واقعاً در همان صفحه به صورت پرسش و پاسخ آمده باشند. نشانه‌گذاری خالی یا گمراه‌کننده بیشتر از نبود اسکیما ضرر دارد.

فارسی، RTL و چیزی که گوگل واقعاً می‌بیند

lang="fa" و dir="rtl" را روی خود html بگذارید، نه فقط روی یک div داخلی. فونت را با next/font بارگذاری کنید، subset عربی را محدود کنید و display: swap بدهید تا متن فارسی با فونت سیستم دیده شود، نه با مربع خالی.

تاریخ و عدد را با fa-IR قالب کنید. محتوای صفحه را به فارسی بنویسید؛ title انگلیسی روی متن فارسی معمولاً نرخ کلیک را پایین می‌آورد مگر مخاطب صریحاً فنی و بین‌المللی باشد.

عملکرد؛ پیش‌شرط رتبه، نه کار تزئینی

  • تصویر هیرو را با next/image، sizes درست و اولویت LCP بارگذاری کنید
  • JS کلاینت را از above-the-fold دور نگه دارید؛ Accordion و فرم را جدا هیدریت کنید
  • صفحات پایدار را Static Generation کنید تا HTML از CDN بیاید، نه از محاسبهٔ هر درخواست
  • فونت نمایشی را به وزن‌های لازم محدود کنید؛ یک خانواده با چهار وزن معمولاً کافی است

Core Web Vitals را جداگانه در مقالهٔ بهبود Core Web Vitals برای سایت‌های فارسی باز کرده‌ایم. اینجا همین بس که LCP و INP ضعیف، بهترین metadata را بی‌اثر می‌کند.

sitemap، robots و آنچه نباید ایندکس شود

sitemap.ts را از همان آرایه‌های محتوا بسازید که صفحات از آن خوانده می‌شوند. اگر مقاله یا خدمات را دستی به نقشه اضافه کنید، دیر یا زود از مسیر واقعی عقب می‌ماند. در robots مسیرهای /admin، /login و /api/ را ببندید و برای ربات‌های جستجو و دستیارهای معتبر اجازهٔ صریح بدهید.

اشتباه‌هایی که در پروژه‌های فارسی زیاد می‌بینیم

  • دو نسخهٔ زنده از سایت روی apex و www
  • description یکسان روی ده‌ها صفحه
  • تصویر OG با متن انگلیسی روی برند فارسی
  • اسکیما Article روی صفحه‌ای که مقاله نیست
  • اتکا به گزارش آزمایشگاهی PageSpeed بدون دیدن تجربهٔ واقعی کاربر ایران

جمع‌بندی

رتبه در گوگل برای بازار ایران از چهار چیز می‌آید: metadata یکتا، دامنهٔ canonical، schema درست، و صفحه‌ای که روی موبایل سریع باز شود. اگر این چهار لایه از روز اول در Next.js چیده شود، محتوا فرصت دیده شدن دارد. برای بررسی فنی سایت فعلی یا ساخت محصول جدید، از تماس با XSofts شروع کنید.

بازگشت به وبلاگ