سئو تکنیکال

سئو تکنیکال

حالا که محتوای ارزشمندی را بر اساس تحقیقات کلمات کلیدی قوی ایجاد کرده‌اید، مهم است که مطمئن شوید نه تنها توسط انسان‌ها، بلکه توسط موتورهای جستجو نیز قابل خواندن است! نیازی نیست درک فنی عمیقی از این مفاهیم داشته باشید، اما درک این دارایی‌های فنی مهم است تا بتوانید هوشمندانه در مورد آنها با توسعه‌دهندگان صحبت کنید. صحبت کردن به زبان توسعه‌دهندگانتان مهم است زیرا احتمالاً برای انجام برخی از بهینه‌سازی‌هایتان به آنها نیاز خواهید داشت. اگر آنها نتوانند درخواست شما را درک کنند یا اهمیت آن را ببینند، بعید است که درخواست‌های شما را در اولویت قرار دهند. وقتی با توسعه‌دهندگان خود اعتبار و اعتماد ایجاد می‌کنید، می‌توانید شروع به از بین بردن کاغذبازی‌هایی کنید که اغلب مانع انجام کارهای مهم می‌شوند.

 

برای اینکه سئو ها مؤثر باشند، نیاز به پشتیبانی بین تیمی دارند.

 داشتن یک رابطه سالم با توسعه‌دهندگان ضروری است تا بتوانید چالش‌های سئو را از هر دو طرف با موفقیت مدیریت کنید. منتظر نمانید تا یک مشکل فنی باعث پیامدهای منفی سئو شود و بعد تازه توسعه‌دهنده را درگیر کنید. در عوض، از همان مرحله برنامه‌ریزی با هم همکاری کنید تا هدف جلوگیری کامل از بروز مشکلات باشد. اگر این کار را نکنید، بعداً ممکن است برایتان هم زمان و هم پول هزینه داشته باشد.

 

فراتر از پشتیبانی بین‌تیمی، درک بهینه‌سازی فنی برای سئو ضروری است اگر می‌خواهید مطمئن شوید که صفحات وب شما هم برای انسان‌ها و هم برای خزنده‌ها ساختار یافته‌اند. به همین منظور، ما این فصل را به سه بخش تقسیم کرده‌ایم:

  • نحوه کارکرد وب‌سایت‌ها
  • نحوه درک وب‌سایت‌ها توسط موتورهای جستجو
  • نحوه تعامل کاربران با وب‌سایت‌ها

از آنجا که ساختار فنی یک سایت می‌تواند تأثیر عظیمی بر عملکرد آن داشته باشد، درک این اصول برای همه حیاتی است. همچنین ممکن است ایده خوبی باشد که این بخش از راهنما را با برنامه‌نویسان، نویسندگان محتوا و طراحان خود به اشتراک بگذارید تا تمام طرف‌های درگیر در ساخت یک سایت درک یکسانی داشته باشند.

وب‌سایت‌ها چگونه کار می‌کنند

وب سایت ها چگونه کار می کنند

اگر بهینه‌سازی موتور جستجو (SEO) فرآیند بهینه‌سازی یک وب‌سایت برای جستجو باشد، سئوکارها حداقل نیاز به درک پایه‌ای از چیزی دارند که در حال بهینه‌سازی آن هستند!

در ادامه، ما مسیر وب‌سایت را از خرید نام دامنه تا حالت کامل نمایش داده شده آن در مرورگر توضیح می‌دهیم. یکی از اجزای مهم مسیر وب‌سایت، مسیر رندر بحرانی است، که فرآیند تبدیل کد وب‌سایت توسط مرورگر به صفحه قابل مشاهده است.

دانستن این موضوع درباره وب‌سایت‌ها برای سئوکارها از چند جهت مهم است:

  • مراحل در این فرآیند مونتاژ وب‌صفحه می‌تواند زمان بارگذاری صفحه را تحت تأثیر قرار دهد و سرعت نه تنها برای نگه داشتن کاربران در سایت شما مهم است، بلکه یکی از عوامل رتبه‌بندی گوگل نیز محسوب می‌شود.
  • گوگل برخی منابع مانند جاوااسکریپت را در «گذر دوم» رندر می‌کند. گوگل ابتدا صفحه را بدون جاوااسکریپت بررسی می‌کند و سپس چند روز تا چند هفته بعد، جاوااسکریپت را رندر می‌کند، به این معنی که عناصر حیاتی سئو که با جاوااسکریپت به صفحه اضافه شده‌اند ممکن است فوراً ایندکس نشوند.

تصور کنید فرآیند بارگذاری وب‌سایت مثل مسیر رفتن به محل کارتان است. شما در خانه آماده می‌شوید، وسایل خود را برای بردن به دفتر جمع می‌کنید و سپس سریع‌ترین مسیر از خانه تا محل کار را طی می‌کنید. مسخره است که فقط یکی از کفش‌هایتان را بپوشید، مسیر طولانی‌تر بروید، وسایلتان را در دفتر بگذارید، و بلافاصله به خانه برگردید تا کفش دیگر را بردارید، درست است؟ وب‌سایت‌های ناکارآمد تقریباً همین کار را انجام می‌دهند. این فصل به شما آموزش می‌دهد چگونه بفهمید وب‌سایتتان در کجا ناکارآمد است، چه کارهایی می‌توانید برای بهینه‌سازی انجام دهید و تأثیرات مثبت آن بر رتبه‌بندی و تجربه کاربری که از این بهینه‌سازی به دست می‌آید.

قبل از اینکه یک وب سایت قابل دسترسی باشد، باید راه‌اندازی شود!

  • خرید نام دامنه: نام دامنه‌هایی مثل moz.com از طریق ثبت‌کننده‌های دامنه مانند GoDaddy یا HostGator خریداری می‌شوند. این ثبت‌کننده‌ها سازمان‌هایی هستند که مدیریت رزرو نام دامنه‌ها را انجام می‌دهند.
  • اتصال نام دامنه به آدرس IP: اینترنت بدون کمک سرورهای نام دامنه (DNS) نمی‌تواند نام‌هایی مانند “moz.com” را به عنوان آدرس وب‌سایت بشناسد. اینترنت از مجموعه‌ای از اعداد به نام آدرس پروتکل اینترنت (IP) استفاده می‌کند (مثال: 127.0.0.1)، اما ما می‌خواهیم از نام‌هایی مانند moz.com استفاده کنیم زیرا برای انسان‌ها راحت‌تر به خاطر سپرده می‌شوند. ما نیاز داریم از DNS برای اتصال این نام‌های قابل خواندن توسط انسان به اعداد قابل خواندن توسط ماشین استفاده کنیم.

چگونگی رسیدن وب سایت از سرور به مرورگر:

  1. درخواست کاربر برای دامنه: حالا که نام دامنه از طریق DNS به آدرس IP متصل شده است، کاربران می‌توانند با تایپ مستقیم نام دامنه در مرورگر یا کلیک روی لینک به وب‌سایت دسترسی پیدا کنند.
  2. مرورگر درخواست‌ها را ارسال می‌کند: این درخواست برای یک صفحه وب باعث می‌شود مرورگر یک درخواست DNS انجام دهد تا نام دامنه را به آدرس IP تبدیل کند. سپس مرورگر یک درخواست به سرور برای دریافت کدهای وب‌سایت شما مانند HTML، CSS و JavaScript می‌فرستد.
  3. سرور منابع را ارسال می‌کند: پس از دریافت درخواست وب‌سایت توسط سرور، فایل‌های وب‌سایت برای مونتاژ در مرورگر کاربر ارسال می‌شوند.
  4. مرورگر صفحه وب را مونتاژ می‌کند: مرورگر اکنون منابع را از سرور دریافت کرده است، اما هنوز باید همه را کنار هم قرار دهد و صفحه وب را رندر کند تا کاربر بتواند آن را در مرورگر ببیند. وقتی مرورگر منابع وب‌صفحه را تحلیل و سازماندهی می‌کند، در حال ایجاد مدل شیء سند (DOM) است. DOM همان چیزی است که وقتی راست‌کلیک می‌کنید و “inspect element” را در مرورگر Chrome انجام می‌دهید می‌بینید (می‌توانید یاد بگیرید چطور این کار را در مرورگرهای دیگر انجام دهید).
  5. مرورگر درخواست‌های نهایی را انجام می‌دهد: مرورگر تنها پس از دانلود، تجزیه و اجرای تمام کدهای لازم صفحه، وب‌صفحه را نشان می‌دهد. در این مرحله، اگر مرورگر به کد اضافی نیاز داشته باشد تا وب‌سایت را نشان دهد، درخواست دیگری از سرور شما ارسال خواهد کرد.
  6. وب‌سایت در مرورگر ظاهر می‌شود: پس از همه این مراحل، وب‌سایت شما اکنون از کد به آن چیزی که در مرورگر می‌بینید، تبدیل (رندر) شده است.

 

با توسعه دهندگان خود درباره async صحبت کنید!

یکی از موضوعاتی که می‌توانید با توسعه‌دهندگان خود مطرح کنید، کوتاه کردن مسیر رندر بحرانی با تنظیم اسکریپت‌ها روی "async" است، زمانی که آن‌ها برای نمایش محتوای بالای صفحه لازم نیستند، که می‌تواند باعث سریع‌تر بارگذاری شدن صفحات وب شما شود. Async به DOM می‌گوید که می‌تواند در حین بارگیری اسکریپت‌های لازم برای نمایش وب‌سایت شما، به مونتاژ خود ادامه دهد. اگر DOM مجبور باشد هر بار که مرورگر یک اسکریپت را بارگیری می‌کند، مونتاژ خود را متوقف کند (که به آن «اسکریپت‌های مسدودکننده رندر» گفته می‌شود)، می‌تواند به طور قابل توجهی سرعت بارگذاری صفحه شما را کاهش دهد.

این وضعیت مثل این است که با دوستانتان بیرون برای غذا می‌روید و هر بار که یکی از شما به پیشخوان می‌رود تا سفارش دهد، مکالمه را متوقف می‌کنید و فقط وقتی او بازمی‌گردد، دوباره ادامه می‌دهید. با async، شما و دوستانتان می‌توانید همچنان به صحبت ادامه دهید حتی زمانی که یکی از شما در حال سفارش دادن است.همچنین ممکن است بخواهید سایر بهینه‌سازی‌هایی را که توسعه‌دهندگان می‌توانند برای کوتاه کردن مسیر رندر بحرانی اجرا کنند، مطرح کنید، مانند حذف کامل اسکریپت‌های غیرضروری، مثل اسکریپت‌های قدیمی ردیابی.

 

حالا که می‌دانید یک وب‌سایت چگونه در مرورگر ظاهر می‌شود، تمرکز خود را روی اجزای تشکیل‌دهنده وب‌سایت می‌گذاریم — به عبارت دیگر، کد (زبان‌های برنامه‌نویسی) استفاده شده برای ساخت این صفحات وب.

سه مورد رایج‌ترین آن‌ها عبارت‌اند از:

HTML: چیزی که یک وب سایت می‌گوید

HTML مخفف Hypertext Markup Language است و به عنوان ستون فقرات یک وب‌سایت عمل می‌کند. عناصری مانند عناوین، پاراگراف‌ها، فهرست‌ها و محتوا همگی در HTML تعریف می‌شوند.

این یک مثال از یک صفحه وب و HTML متناظر آن است:

این تصویر از W3schools.com گرفته شده است، مکانی که ما برای یادگیری و تمرین HTML، CSS و JavaScript دوست داریم.

 

HTML برای سئوکارها مهم است زیرا «زیر کاپوت» هر صفحه‌ای که ایجاد یا روی آن کار می‌کنند را تشکیل می‌دهد. در حالی که CMS شما احتمالاً نیاز ندارد که صفحات خود را به صورت دستی با HTML بنویسید (مثلاً انتخاب «hyperlink» به شما اجازه می‌دهد لینک ایجاد کنید بدون اینکه کد a href= را تایپ کنید)، هر بار که محتوایی اضافه می‌کنید، متن لینک داخلی را تغییر می‌دهید یا کاری روی صفحه وب انجام می‌دهید، در واقع در HTML دست می‌برید. گوگل این عناصر HTML را بررسی می‌کند تا مشخص کند سند شما چقدر برای یک جستجو مرتبط است. به عبارت دیگر، محتوای HTML شما نقش بزرگی در رتبه‌بندی صفحات وب شما در جستجوی ارگانیک گوگل دارد.

 

CSS: ظاهر یک وب سایت

CSS مخفف Cascading Style Sheets است و باعث می‌شود صفحات وب شما فونت‌ها، رنگ‌ها و چیدمان‌های خاصی داشته باشند. HTML برای توصیف محتوا ایجاد شده بود، نه برای سبک‌دهی، بنابراین وقتی CSS معرفی شد، تحول بزرگی بود. با CSS، صفحات وب می‌توانستند زیبا شوند بدون اینکه نیاز باشد سبک‌ها را به صورت دستی در HTML هر صفحه وارد کنید — فرآیندی که به خصوص برای سایت‌های بزرگ وقت‌گیر بود.

تا سال ۲۰۱۴، سیستم ایندکس‌گذاری گوگل صفحات وب را بیشتر شبیه یک مرورگر واقعی رندر می‌کرد، نه یک مرورگر متنی ساده. یکی از روش‌های سئو کلاه سیاه که سعی داشت از سیستم ایندکس‌گذاری قدیمی گوگل سوءاستفاده کند، مخفی کردن متن و لینک‌ها با CSS برای دستکاری رتبه‌بندی موتورهای جستجو بود. این روش «متن و لینک‌های مخفی» نقض دستورالعمل‌های کیفیت گوگل است.

اجزای CSS که سئوکارها باید به آن توجه کنند:

  • از آنجا که دستورات سبک می‌توانند در فایل‌های stylesheet خارجی (CSS) ذخیره شوند به جای HTML صفحه، حجم کد صفحه کاهش یافته، اندازه فایل کمتر و زمان بارگذاری سریع‌تر می‌شود.
  • مرورگرها هنوز باید منابعی مانند فایل CSS را دانلود کنند، بنابراین فشرده‌سازی آن‌ها می‌تواند سرعت بارگذاری صفحات شما را افزایش دهد و سرعت صفحه یک عامل رتبه‌بندی است.
  • داشتن صفحات با محتوای بیشتر نسبت به کد، می‌تواند باعث ایندکس بهتر محتوای سایت شود.
  • استفاده از CSS برای مخفی کردن لینک‌ها و محتوا می‌تواند منجر به جریمه دستی سایت شما و حذف آن از ایندکس گوگل شود.

JavaScript: رفتار یک وب سایت

در روزهای اولیه اینترنت، صفحات وب با HTML ساخته می‌شدند. با ورود CSS، محتوا می‌توانست سبک خاصی به خود بگیرد. وقتی زبان برنامه‌نویسی JavaScript وارد شد، وب‌سایت‌ها نه تنها ساختار و سبک داشتند، بلکه می‌توانستند پویا باشند.

JavaScript فرصت‌های زیادی برای ایجاد صفحات وب غیرثابت فراهم کرده است. وقتی کسی سعی می‌کند به یک صفحه که با این زبان برنامه‌نویسی تقویت شده دسترسی پیدا کند، مرورگر آن کاربر JavaScript را روی HTML استاتیک بازگشتی از سرور اجرا می‌کند و نتیجه یک صفحه وب است که با نوعی تعامل زنده می‌شود.

شما حتماً JavaScript را در عمل دیده‌اید — شاید فقط نمی‌دانستید! زیرا JavaScript می‌تواند تقریباً هر کاری روی یک صفحه انجام دهد. مثلاً می‌تواند یک پنجره پاپ‌آپ ایجاد کند، یا منابع شخص ثالث مانند تبلیغات را برای نمایش در صفحه شما درخواست کند.

رندر سمت کاربر در مقابل رندر سمت سرور

با این حال، JavaScript می‌تواند برای سئو مشکلاتی ایجاد کند، زیرا موتورهای جستجو JavaScript را به همان شکلی که بازدیدکنندگان انسانی می‌بینند، مشاهده نمی‌کنند. دلیل این امر تفاوت بین رندر سمت کاربر و رندر سمت سرور است. بیشتر JavaScript در مرورگر کاربر اجرا می‌شود. از طرف دیگر، در رندر سمت سرور، فایل‌ها در سرور اجرا می‌شوند و سرور آن‌ها را در حالت کاملاً رندر شده به مرورگر ارسال می‌کند.

عناصر حیاتی صفحه برای سئو مانند متن، لینک‌ها و تگ‌ها که در سمت کاربر با JavaScript بارگذاری می‌شوند، به جای اینکه در HTML شما موجود باشند، تا زمان رندر شدن نامرئی هستند. این بدان معناست که خزنده‌های موتور جستجو تا زمانی که JavaScript اجرا نشده، محتوای آن را نخواهند دید.

گوگل می‌گوید که تا زمانی که مانع خزیدن Googlebot در فایل‌های JavaScript خود نشوید، آن‌ها معمولاً قادرند صفحات وب شما را همانند مرورگر رندر و درک کنند، یعنی Googlebot باید همان چیزهایی را ببیند که یک کاربر هنگام مشاهده سایت در مرورگر خود می‌بیند. با این حال، به دلیل «موج دوم ایندکس‌گذاری» برای JavaScript سمت کاربر، گوگل ممکن است برخی عناصر را که تنها پس از اجرای JavaScript در دسترس هستند، از دست بدهد.

چند مورد دیگر نیز وجود دارد که ممکن است در فرآیند رندر صفحات شما توسط Googlebot اشتباه پیش برود و مانع درک محتوای JavaScript شما شود:

  • شما دسترسی Googlebot به منابع JavaScript را مسدود کرده‌اید (مثلاً با فایل robots.txt، همانطور که در فصل ۲ یاد گرفتیم)
  • سرور شما نمی‌تواند تمام درخواست‌ها برای خزیدن محتوای شما را پردازش کند
  • JavaScript بیش از حد پیچیده یا قدیمی است و Googlebot نمی‌تواند آن را درک کند
  • JavaScript محتوا را به صورت "lazy load" وارد صفحه می‌کند تا پس از اتمام خزیدن صفحه توسط Googlebot

لازم به ذکر است که JavaScript امکانات زیادی برای ایجاد صفحات وب فراهم می‌کند، اما اگر مراقب نباشید، می‌تواند پیامدهای جدی برای سئو شما داشته باشد.

خوشبختانه، راهی برای بررسی این وجود دارد که آیا گوگل همان چیزی را می‌بیند که بازدیدکنندگان شما می‌بینند یا نه. برای دیدن یک صفحه همانطور که Googlebot آن را مشاهده می‌کند، از ابزار "URL Inspection" در Google Search Console استفاده کنید. کافی است URL صفحه خود را در نوار جستجوی GSC وارد کنید.

تصویری از محل وارد کردن آدرس اینترنتی یک صفحه در کنسول جستجوی گوگل.

از اینجا، روی گزینه "Test Live URL" کلیک کنید.

کجا می‌توان نسخه زنده URL را در کنسول جستجوی گوگل آزمایش کرد؟

پس از اینکه Googlebot URL شما را دوباره خزید، روی "View Tested Page" کلیک کنید تا ببینید صفحه شما چگونه خزیده و رندر می‌شود.

نمای زنده‌ی ربات گوگل از صفحه‌ی خود را مشاهده کنید.

با کلیک روی زبانه "Screenshot" که کنار "HTML" قرار دارد، می‌توانید ببینید Googlebot موبایل صفحه شما را چگونه رندر می‌کند.

تب اسکرین شات ربات گوگل

در عوض، خواهید دید که Googlebot صفحه شما را چگونه می‌بیند و این با نحوه مشاهده صفحه توسط یک بازدیدکننده (یا شما) مقایسه می‌شود. در زبانه "More Info"، گوگل همچنین فهرستی از منابعی که ممکن است نتوانسته باشند برای URL وارد شده دریافت کنند را نشان می‌دهد.

درک نحوه کارکرد وب‌سایت‌ها پایه‌ای عالی برای موضوع بعدی ما فراهم می‌کند: بهینه‌سازی‌های فنی که به گوگل کمک می‌کند صفحات وب‌سایت شما را بهتر درک کند.

موتورهای جستجو چگونه وب سایت ها را درک می کنند

تصور کنید که شما یک خزنده موتور جستجو هستید و در حال اسکن یک مقاله ۱۰،۰۰۰ کلمه‌ای درباره نحوه پخت کیک هستید. چگونه نویسنده، دستور پخت، مواد اولیه یا مراحل لازم برای پخت کیک را شناسایی می‌کنید؟ اینجاست که Schema Markup وارد می‌شود. این ابزار به شما امکان می‌دهد تا موتورهای جستجو را با دسته‌بندی‌های مشخص‌تر تغذیه کنید و نوع اطلاعات موجود در صفحه خود را به آن‌ها نشان دهید.

Schema روشی برای برچسب‌گذاری یا سازمان‌دهی محتواست تا موتورهای جستجو درک بهتری از عناصر موجود در صفحات وب شما داشته باشند. این کد به داده‌های شما ساختار می‌دهد، به همین دلیل اغلب به آن «داده‌های ساختاریافته» گفته می‌شود. فرآیند سازمان‌دهی داده‌ها معمولاً «markup» نامیده می‌شود زیرا شما محتوای خود را با کد سازمان‌دهی شده علامت‌گذاری می‌کنید.

JSON-LD شیوه مورد علاقه گوگل برای Schema Markup است (اعلام شده در مه ۲۰۱۶) که توسط Bing نیز پشتیبانی می‌شود. برای مشاهده فهرست کامل هزاران نوع Schema Markup موجود، به Schema.org مراجعه کنید یا برای اطلاعات بیشتر در مورد نحوه پیاده‌سازی داده‌های ساختاریافته، راهنمای Google Developers Introduction to Structured Data را ببینید. پس از پیاده‌سازی داده‌های ساختاریافته‌ای که مناسب صفحات وب شما هستند، می‌توانید Markup خود را با ابزار Structured Data Testing Tool گوگل تست کنید.

علاوه بر کمک به ربات‌هایی مانند گوگل برای درک محتوای یک بخش خاص، Schema Markup می‌تواند ویژگی‌های ویژه‌ای را در صفحات نتایج جستجو (SERPs) فعال کند. این ویژگی‌های ویژه به "Rich Snippets" معروف هستند و احتمالاً شما قبلاً آن‌ها را مشاهده کرده‌اید. نمونه‌هایی از آن‌ها عبارت‌اند از:

  • اسلایدرهای Top Stories
  • ستاره‌های امتیازدهی (Review Stars)
  • جعبه‌های جستجوی Sitelinks
  • دستورهای آشپزی (Recipes)

به یاد داشته باشید، استفاده از داده‌های ساختاریافته می‌تواند باعث فعال شدن یک Rich Snippet شود، اما تضمینی برای نمایش آن نیست. انواع دیگری از Rich Snippets احتمالاً در آینده با افزایش استفاده از Schema Markup اضافه خواهند شد.

برخی توصیه‌های نهایی برای موفقیت با Schema:

  • می‌توانید از چند نوع Schema Markup در یک صفحه استفاده کنید. با این حال، اگر یک عنصر را علامت‌گذاری می‌کنید، مثلاً یک محصول، و محصولات دیگری در صفحه موجود هستند، باید آن محصولات را نیز علامت‌گذاری کنید.
  • محتوایی که برای بازدیدکنندگان قابل مشاهده نیست را علامت‌گذاری نکنید و دستورالعمل‌های کیفیت گوگل را رعایت کنید. برای مثال، اگر Structured Markup نقد و بررسی به صفحه اضافه می‌کنید، مطمئن شوید که آن نقدها واقعاً در آن صفحه قابل مشاهده هستند.
  • اگر صفحات تکراری دارید، گوگل می‌خواهد که هر صفحه تکراری با Structured Markup علامت‌گذاری شود، نه فقط نسخه Canonical.
  • محتوای اصلی و به‌روز (در صورت امکان) را در صفحات داده‌های ساختاریافته ارائه دهید.
  • Markup باید بازتاب دقیقی از محتوای صفحه شما باشد.
  • سعی کنید از دقیق‌ترین نوع Schema Markup برای محتوای خود استفاده کنید.
  • نقدهای علامت‌گذاری شده نباید توسط کسب‌وکار نوشته شوند. آن‌ها باید نقدهای واقعی و بدون پرداخت از مشتریان واقعی باشند.

با استفاده از Canonicalization به موتورهای جستجو صفحات ترجیحی خود را معرفی کنید

وقتی گوگل محتوای مشابه را در صفحات وب مختلف خزیده و مشاهده می‌کند، گاهی نمی‌داند کدام صفحه را در نتایج جستجو ایندکس کند. به همین دلیل تگ rel="canonical" ایجاد شد: تا به موتورهای جستجو کمک کند نسخه ترجیحی محتوا را بهتر ایندکس کنند و تمام نسخه‌های تکراری آن را ایندکس نکنند.

تگ rel="canonical" به شما امکان می‌دهد به موتورهای جستجو بگویید نسخه اصلی و مرجع یک محتوا کجا قرار دارد. در واقع شما دارید می‌گویید: «هی موتور جستجو! این صفحه را ایندکس نکن، به جای آن این صفحه منبع را ایندکس کن.» بنابراین، اگر می‌خواهید یک محتوا را دوباره منتشر کنید، چه دقیقاً همان نسخه و چه با کمی تغییر، اما نمی‌خواهید ریسک ایجاد محتوای تکراری را داشته باشید، تگ canonical این مشکل را حل می‌کند.

کجا می‌توان rel=canonical را در کد منبع صفحه پیدا کرد؟

Canonicalization صحیح اطمینان می‌دهد که هر محتوای یکتا در وب سایت شما تنها یک URL دارد. برای جلوگیری از ایندکس شدن نسخه‌های متعدد از یک صفحه توسط موتورهای جستجو، گوگل توصیه می‌کند که هر صفحه از سایت شما یک تگ canonical خودارجاعی داشته باشد. بدون تگ canonical که به گوگل بگوید کدام نسخه از صفحه شما ترجیح داده می‌شود، ممکن است آدرس‌هایی مانند https://www.example.com و https://example.com به صورت جداگانه ایندکس شوند و باعث ایجاد محتوای تکراری شوند.

عبارت «از محتوای تکراری اجتناب کنید» یک اصل در اینترنت است و دلیل خوبی هم دارد! گوگل می‌خواهد سایت‌هایی با محتوای یکتا و ارزشمند را تشویق کند — نه محتوایی که از منابع دیگر گرفته شده و در چندین صفحه تکرار شده است. از آنجا که موتورهای جستجو می‌خواهند بهترین تجربه را برای جستجوگران فراهم کنند، به ندرت چند نسخه از همان محتوا را نشان می‌دهند و به جای آن تنها نسخه canonical را نمایش می‌دهند، یا اگر تگ canonical وجود نداشته باشد، هر نسخه‌ای که گوگل بیشترین احتمال را می‌دهد که اصلی باشد، نمایش داده می‌شود.

 

تمایز بین فیلتر محتوا و جریمه محتوا

هیچ چیزی به نام جریمه برای محتوای تکراری وجود ندارد. با این حال، شما باید سعی کنید از ایجاد مشکلات ایندکس به دلیل محتوای تکراری جلوگیری کنید، با استفاده از تگ rel="canonical" هر زمان که ممکن است. وقتی نسخه‌های تکراری یک صفحه وجود دارند، گوگل یک نسخه را به عنوان canonical انتخاب کرده و سایر نسخه‌ها را از نتایج جستجو فیلتر می‌کند. این به این معنا نیست که شما جریمه شده‌اید؛ فقط به این معناست که گوگل تنها می‌خواهد یک نسخه از محتوای شما را نمایش دهد.

برای اطلاعات بیشتر درباره canonicalization مطالعه کنید.

 

داشتن چندین صفحه تکراری به دلیل گزینه‌های مرتب‌سازی و فیلتر، در وب‌سایت‌ها بسیار رایج است. به عنوان مثال، در یک سایت فروشگاهی، ممکن است چیزی به نام فاکتد ناویگیشن (Faceted Navigation) داشته باشید که به بازدیدکنندگان اجازه می‌دهد محصولات را محدود کنند تا دقیقاً همان چیزی که می‌خواهند پیدا کنند، مثل ویژگی «مرتب‌سازی بر اساس» که نتایج صفحه دسته‌بندی محصولات را از کمترین به بیشترین قیمت مرتب می‌کند. این می‌تواند یک URL ایجاد کند که شبیه این باشد: example.com/mens-shirts?sort=price_ascending. حال اگر گزینه‌های مرتب‌سازی/فیلتر بیشتری مانند رنگ، اندازه، جنس، برند و غیره اضافه کنید، تصور کنید که تمام تنوع‌های ممکن از صفحه اصلی دسته‌بندی محصولات شما ایجاد می‌شود!

برای یادگیری بیشتر درباره انواع مختلف محتوای تکراری، این مقاله از Dr. Pete به شما کمک می‌کند تا تفاوت‌های مختلف را بهتر درک کنید.

چگونگی تعامل کاربران با وب سایت ها

در فصل اول گفتیم که با وجود اینکه SEO به معنای بهینه‌سازی موتور جستجو است، سئو به اندازه موتورهای جستجو، درباره انسان‌ها نیز اهمیت دارد. دلیل این امر این است که موتورهای جستجو برای خدمت‌رسانی به جستجوگران وجود دارند. این هدف توضیح می‌دهد که چرا الگوریتم گوگل وب‌سایت‌هایی را که بهترین تجربه ممکن را برای جستجوگران فراهم می‌کنند، پاداش می‌دهد و چرا برخی وب‌سایت‌ها، با وجود داشتن ویژگی‌هایی مانند پروفایل بک‌لینک قوی، ممکن است عملکرد خوبی در جستجو نداشته باشند.

وقتی بفهمیم چه چیزی تجربه مرور وب کاربران را بهینه می‌کند، می‌توانیم همان تجربه‌ها را ایجاد کنیم تا عملکرد جستجوی سایت حداکثر شود.

اطمینان از تجربه مثبت برای بازدیدکنندگان موبایل

با توجه به اینکه بیش از نیمی از ترافیک وب امروزه از موبایل می‌آید، می‌توان گفت که وب‌سایت شما باید برای بازدیدکنندگان موبایل قابل دسترسی و آسان برای مرور باشد. در آوریل ۲۰۱۵، گوگل به‌روزرسانی‌ای در الگوریتم خود منتشر کرد که صفحات موبایل‌دوست را نسبت به صفحات غیرموبایل‌دوست در رتبه‌بندی بالاتر قرار می‌داد. پس چگونه می‌توان اطمینان حاصل کرد که وب‌سایت شما موبایل‌دوست است؟ اگرچه سه روش اصلی برای تنظیم وب‌سایت برای موبایل وجود دارد، گوگل Responsive Web Design را توصیه می‌کند.

طراحی واکنش‌گرا (Responsive Design)

وب‌سایت‌های واکنش‌گرا به گونه‌ای طراحی شده‌اند که با صفحه نمایش هر نوع دستگاهی که بازدیدکنندگان استفاده می‌کنند، مطابقت داشته باشند. می‌توانید از CSS استفاده کنید تا صفحه وب نسبت به اندازه دستگاه «واکنش» نشان دهد. این روش ایده‌آل است زیرا مانع از این می‌شود که بازدیدکنندگان برای مشاهده محتوا مجبور شوند دوبار ضربه بزنند یا بزرگ‌نمایی/کوچک‌نمایی کنند.

مطمئن نیستید صفحات وب شما موبایل‌دوست هستند یا نه؟ می‌توانید از Google’s Mobile-Friendly Test برای بررسی استفاده کنید!

تصویری از اینکه چگونه طراحی واکنش‌گرا می‌تواند قالب‌بندی روی صفحه را تغییر دهد، به طوری که متن در کنار یا زیر تصویر قرار گیرد.

AMP

AMP مخفف Accelerated Mobile Pages است و برای ارائه محتوا به بازدیدکنندگان موبایل با سرعت بسیار بیشتر نسبت به تحویل غیر AMP استفاده می‌شود. AMP قادر است محتوا را با چنین سرعتی ارائه دهد زیرا محتوا را از سرورهای کش خود (نه سایت اصلی) ارسال می‌کند و از نسخه ویژه‌ای از HTML و JavaScript مخصوص AMP استفاده می‌کند.

برای اطلاعات بیشتر درباره AMP، مطالعه کنید.

Mobile-First Indexing

از سال ۲۰۱۸، گوگل شروع به انتقال وب‌سایت‌ها به Mobile-First Indexing کرد. این تغییر باعث برخی ابهامات بین موبایل‌دوستی و Mobile-First شد، بنابراین توضیح آن مفید است. در Mobile-First Indexing، گوگل نسخه موبایل صفحات وب شما را خزیده و ایندکس می‌کند. سازگار کردن وب‌سایت با صفحه نمایش موبایل برای کاربران و عملکرد شما در جستجو مفید است، اما Mobile-First Indexing مستقل از موبایل‌دوستی اتفاق می‌افتد.

این موضوع باعث نگرانی‌هایی برای وب‌سایت‌هایی شده است که بین نسخه موبایل و دسکتاپ خود هماهنگی ندارند، مانند نمایش محتوای متفاوت، ناوبری متفاوت، لینک‌های متفاوت و غیره در نمای موبایل. به عنوان مثال، یک سایت موبایل با لینک‌های متفاوت می‌تواند نحوه خزیدن Googlebot (mobile) را تغییر دهد و اعتبار لینک‌ها را به سایر صفحات شما منتقل کند.

بهبود سرعت صفحه برای کاهش ناامیدی بازدیدکنندگان

گوگل می‌خواهد محتوا را برای جستجوگران با سرعت بسیار بالا ارائه دهد. ما انتظار داریم نتایج سریع بارگذاری شوند و وقتی این اتفاق نمی‌افتد، سریعاً به صفحه نتایج جستجو (SERP) بازمی‌گردیم تا صفحه‌ای بهتر و سریع‌تر پیدا کنیم. به همین دلیل، سرعت صفحه یکی از جنبه‌های حیاتی SEO داخلی است.

می‌توانیم سرعت صفحات وب خود را با استفاده از ابزارهایی که در ادامه آمده است، بهبود دهیم. برای اطلاعات بیشتر روی لینک‌ها کلیک کنید:

تصاویر یکی از عوامل اصلی کندی صفحات هستند!

همان‌طور که در فصل ۴ بحث شد، تصاویر یکی از مهم‌ترین دلایل بارگذاری کند صفحات وب هستند! علاوه بر فشرده‌سازی تصاویر، بهینه‌سازی متن جایگزین (alt text)، انتخاب فرمت مناسب تصویر و ارسال Sitemap تصاویر، راه‌های فنی دیگری نیز برای بهینه‌سازی سرعت و نحوه نمایش تصاویر به کاربران وجود دارد. برخی از روش‌های اصلی برای بهبود ارائه تصاویر عبارت‌اند از:

۱. SRCSET: چگونگی ارائه بهترین اندازه تصویر برای هر دستگاه

ویژگی SRCSET به شما اجازه می‌دهد چندین نسخه از تصویر خود داشته باشید و مشخص کنید که در موقعیت‌های مختلف کدام نسخه استفاده شود. این قطعه کد به تگ <img> اضافه می‌شود (جایی که تصویر شما در HTML قرار دارد) تا تصاویر منحصربه‌فردی برای دستگاه‌های با اندازه خاص ارائه دهد.

این مفهوم شبیه طراحی واکنش‌گرا است که قبلاً درباره آن صحبت کردیم، اما مخصوص تصاویر!

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

تصویری که صفحه دسکتاپ، صفحه تبلت و صفحه گوشی را نشان می‌دهد، که همه آنها قالب‌بندی متن و تصاویر متفاوتی دارند.

۲. نمایش به بازدیدکنندگان که بارگذاری تصویر در حال انجام است با Lazy Loading

Lazy Loading زمانی اتفاق می‌افتد که شما وارد یک صفحه وب می‌شوید و به جای دیدن یک فضای خالی سفید برای تصویر، یک نسخه کم‌کیفیت و مات از تصویر یا یک جعبه رنگی در همان مکان نمایش داده می‌شود در حالی که متن اطراف در حال بارگذاری است. پس از چند ثانیه، تصویر با وضوح کامل بارگذاری می‌شود. پلتفرم محبوب بلاگ‌نویسی Medium این کار را بسیار خوب انجام می‌دهد.

ابتدا نسخه کم‌کیفیت بارگذاری می‌شود و سپس نسخه کامل و با وضوح بالا نمایش داده می‌شود. این روش همچنین به بهینه‌سازی Critical Rendering Path کمک می‌کند! بنابراین در حالی که سایر منابع صفحه شما در حال دانلود هستند، یک تصویر پیش‌نمایش کم‌کیفیت نشان داده می‌شود که به کاربران اطلاع می‌دهد که صفحه در حال بارگذاری است.

برای اطلاعات بیشتر در مورد نحوه Lazy Loading تصاویر خود، به راهنمای Lazy Loading گوگل مراجعه کنید.

 

بهبود سرعت با فشرده سازی و تجمیع فایلها

ممیزی سرعت صفحه اغلب توصیه‌هایی مانند «minify resource» ارائه می‌دهد، اما این دقیقاً چه معنایی دارد؟ Minification یک فایل کد را با حذف مواردی مانند خط‌های اضافی، فاصله‌ها و کوتاه کردن نام متغیرهای کد تا حد امکان فشرده می‌کند.

Bundling اصطلاح رایج دیگری است که برای بهبود سرعت صفحه می‌شنوید. فرآیند Bundling فایل‌های هم‌زبان کدنویسی را در یک فایل واحد ترکیب می‌کند. به عنوان مثال، چندین فایل JavaScript می‌توانند در یک فایل بزرگ‌تر قرار بگیرند تا تعداد فایل‌های JavaScript مورد نیاز مرورگر کاهش یابد.

با minify و bundle کردن فایل‌های مورد نیاز برای ساخت صفحه وب خود، وب‌سایت شما سریع‌تر می‌شود و تعداد درخواست‌های HTTP (فایل) کاهش می‌یابد.

بهبود تجربه برای مخاطبان بین المللی

وب‌سایت‌هایی که مخاطبانی از چند کشور را هدف قرار می‌دهند، باید با بهترین شیوه‌های SEO بین‌المللی آشنا شوند تا تجربه‌ای مرتبط و مناسب برای کاربران ارائه دهند. بدون این بهینه‌سازی‌ها، بازدیدکنندگان بین‌المللی ممکن است در یافتن نسخه‌ای از سایت که برای آن‌ها طراحی شده است، دچار مشکل شوند.

دو روش اصلی برای بین‌المللی کردن وب‌سایت وجود دارد:

۱. زبان
سایت‌هایی که مخاطبان چند زبان را هدف قرار می‌دهند، وب‌سایت‌های چندزبانه نامیده می‌شوند. این سایت‌ها باید چیزی به نام hreflang tag اضافه کنند تا به گوگل نشان دهند که صفحه آن‌ها دارای نسخه‌ای به زبان دیگر است. برای اطلاعات بیشتر درباره hreflang مطالعه کنید.

۲. کشور
سایت‌هایی که مخاطبان چند کشور را هدف قرار می‌دهند، وب‌سایت‌های چندمنطقه‌ای نامیده می‌شوند و باید ساختار URL‌ای را انتخاب کنند که هدف‌گیری دامنه یا صفحات را برای کشورهای خاص آسان کند. این می‌تواند شامل استفاده از ccTLD مانند .ca برای کانادا، یا یک gTLD با زیرپوشه مخصوص کشور مانند example.com/ca برای کانادا باشد. برای اطلاعات بیشتر درباره URLهای مختص منطقه مطالعه کنید.

 

شما تحقیق کرده‌اید، نوشته‌اید و وب‌سایت خود را برای موتورهای جستجو و تجربه کاربری بهینه کرده‌اید. بخش بعدی پازل SEO بسیار مهم است: ایجاد اعتبار (Authority) تا صفحات شما بتوانند در نتایج جستجو رتبه بالایی کسب کنند.

به فصل ششم برویم: Link Building و ایجاد اعتبار!

 

نوشته شده توسط برتنی مولر, منبع موز

۴۲
۱۴۰۴/۶/۳