یک آشنایی اولیه با مسائل فنی می‌تونه خیلی به کارت بیاد! اینطوری هم می‌تونی سایتت رو برای موتورهای جستجو بهتر بهینه کنی و هم ارتباطت با برنامه نویس‌ها و تیم فنی قوی‌تر می‌شه.

حالا که با تحقیق کلمات کلیدی محتوای ارزشمندی تولید کردی، باید مطمئن بشی که این محتوا هم برای کاربرا قابل فهم باشه و هم برای موتورهای جستجو.

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

درضمن، وقتی وارد دنیای سئوی فنی می‌شی، بهتره یه واژه نامه سئو کنار دستت داشته باشی تا راحت‌تر با مفاهیم جدید آشنا بشی.

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

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

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

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

سایت‌ها چطور کار می‌کنن؟

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

تو این بخش، از خرید دامنه تا لحظه ای که سایت به طور کامل تو مرورگر نمایش داده می‌شه رو بررسی می‌کنیم. یکی از بخش‌های مهم این مسیر، چیزی هست که بهش "مسیر بحرانی رندر" یا همون Critical Rendering Path می‌گن. این فرآیندیه که مرورگر، کدهای سایت رو به یه صفحه قابل مشاهده برای کاربر تبدیل می‌کنه.

اینکه این مراحل رو بدونی، به چند دلیل برای سئو خیلی مهمه:

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

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

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

• خرید دامنه: اول باید یه دامنه، مثل 7learn.com، رو بخری. این‌ها همون شرکت هایی هستن که مدیریت رزرو دامنه‌ها رو انجام می‌دن.
• وصل شدن دامنه به IP: اینترنت بدون کمک سرورهای DNS نمی‌تونه اسم هایی مثل "7learn.com" رو بفهمه. اینترنت از یه سری عدد به نام آدرس IP (مثل 127.0.0.1) استفاده می‌کنه، اما ما از اسم‌ها استفاده می‌کنیم چون برای ما راحت تره. DNS این اسم‌های قابل فهم برای انسان رو به اون اعداد قابل فهم برای ماشین‌ها وصل می‌کنه.

چطور یه وب سایت از سرور به مرورگر می‌رسه

• درخواست دامنه توسط کاربر: حالا که دامنه به یه آدرس IP از طریق DNS وصل شده، کاربرا می‌تونن با تایپ کردن نام دامنه توی مرورگرشون یا کلیک کردن روی لینک، به سایت دسترسی پیدا کنن.
• درخواست مرورگر: این درخواست باعث می‌شه مرورگر یه درخواست DNS بفرسته تا نام دامنه رو به آدرس IP تبدیل کنه. بعد از اون، مرورگر از سرور کدهایی مثل HTML، CSS و جاوا اسکریپت رو درخواست می‌کنه تا صفحه وب رو بسازه.
• سرور فایل‌ها رو می‌فرسته: وقتی سرور درخواست سایت رو دریافت کرد، فایل‌های لازم رو می‌فرسته تا توی مرورگر کاربر سر هم بشه.
• مرورگر صفحه رو می‌سازه: حالا که مرورگر منابع لازم رو از سرور گرفته، باید همه چیز رو سر هم کنه و صفحه رو رندر کنه تا کاربر بتونه اون رو توی مرورگر ببینه. مرورگر با مرتب کردن و تحلیل منابع صفحه، یه چیزی به اسم DOM می‌سازه. DOM همون چیزی هست که وقتی روی یه صفحه وب توی مرورگر کروم راست کلیک می‌کنی و "inspect" رو می‌زنی، می‌تونی ببینی (برای یادگیری روش این کار در مرورگرهای دیگه هم می‌تونی جستجو کنی).
• مرورگر درخواست‌های نهایی رو می‌فرسته: مرورگر فقط وقتی صفحه وب رو نشون می‌ده که همه کدهای لازم دانلود، تحلیل و اجرا شده باشه. اگه هنوز نیاز به کدهای بیشتری برای نمایش صفحه داشته باشه، درخواست‌های اضافی به سرور می‌فرسته.
• صفحه توی مرورگر نمایش داده می‌شه: بالاخره! بعد از این همه مرحله، صفحه وب از حالت کد به چیزی که توی مرورگر می‌بینی تبدیل (رندر) می‌شه.

نکته: صحبت با توسعه دهنده‌ها درباره Async!

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

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

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

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

• HTML – مشخص می‌کنه سایت چی می‌گه (مثل عنوان ها، محتوا و غیره).
• CSS – مشخص می‌کنه سایت چطور به نظر میاد (رنگ ها، فونت‌ها و غیره).
• JavaScript – رفتار سایت رو تعریف می‌کنه (قابلیت‌های تعاملی، پویا و غیره).

HTML: سایت چی می‌گه

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

برای مثال، هر صفحه وب یه کد HTML مخصوص به خودش داره که شبیه اینه:

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

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

CSS مخفف "Cascading Style Sheets" هست، و همون چیزیه که به صفحات وب فونت، رنگ و طراحی خاص می‌ده. HTML در اصل برای نمایش محتوا ساخته شده بود و نه زیباسازی، تا اینکه CSS وارد شد و ورق رو برگردوند. با استفاده از CSS، دیگه نیازی نبود استایل‌ها رو توی HTML هر صفحه به صورت دستی وارد کنی، که مخصوصاً برای سایت‌های بزرگ کار خیلی سختی بود.

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

چیزهایی که به عنوان سئوکار باید درباره ی CSS بدونی:

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

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

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

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

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

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

جاوااسکریپت گاهی می‌تونه توی سئو مشکل ایجاد کنه، چون موتورهای جستجو مثل گوگل نمی‌تونن جاوااسکریپت رو دقیقاً همونجوری ببینن که ما (کاربرا) می‌بینیم. دلیلش اینه که جاوااسکریپت به دو شکل می‌تونه اجرا بشه: رندر سمت کاربر و رندر سمت سرور.

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

حالا مشکل چیه؟ وقتی جاوااسکریپت روی مرورگر کاربر (رندر سمت کاربر) اجرا می‌شه، موتورهای جستجو مثل گوگل هم نمی‌تونن اون بخش از سایت رو ببینن تا وقتی که مرورگر کدهای جاوااسکریپت رو "رندر" کنه. یعنی بخش هایی مثل متن، لینک و تگ هایی که با جاوااسکریپت لود می‌شن، تا وقتی اجرا نشن، توی کد صفحه دیده نمی‌شن و ممکنه گوگل نتونه اون‌ها رو بخونه.

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

مشکلاتی که ممکنه پیش بیاد:

• اگه دسترسی گوگل بات به فایل‌های جاوااسکریپت رو بسته باشی (با فایل robots.txt).
• اگه سرور نتونه درخواست‌های زیاد گوگل برای دیدن محتوا رو جواب بده.
• اگه جاوااسکریپتت خیلی پیچیده باشه و گوگل نتونه اونو درک کنه.
• یا اگه محتوای سایتت (مثل تصاویر یا متن ها) با جاوااسکریپت دیرتر لود بشه (این بهش lazy load می‌گن).

می تونی از ابزار "بررسی URL" توی گوگل سرچ کنسول استفاده کنی تا بفهمی آیا گوگل صفحت رو درست می‌بینه یا نه. کافیه آدرس URL صفحت رو توی اون ابزار وارد کنی تا نتیجه رو ببینی. بعد روی دکمه "Test Live URL" کلیک کن. بعد از اینکه گوگل بات دوباره URLت رو خزش کرد، روی "View Tested Page" کلیک کن تا ببینی صفحت چطور خزش و رندر شده. با کلیک روی تب "Screenshot" که کنار تب "HTML" قرار داره، می‌تونی ببینی گوگل بات نسخه موبایل صفحت رو چطور رندر کرده.
در نتیجه، می‌بینی گوگل بات چطور صفحت رو می‌بینه در مقابل اینکه یه بازدیدکننده (یا خودت) چطور صفحه رو می‌بینه. همچنین توی تب "More Info"، گوگل لیستی از منابعی که نتونسته بهشون دسترسی داشته باشه رو هم نشون می‌ده.

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

چطور موتورهای جستجو وب سایت‌ها رو می‌فهمن؟

تصور کن که یه ربات موتور جستجو هستی و داری یه مقاله ۱۰,۰۰۰ کلمه ای درباره طرز پخت کیک رو می‌خونی. چطوری می‌فهمی نویسنده کیه؟ مواد لازم چیا هستن؟ یا مراحل پخت کیک کدومن؟ اینجاست که "اسکیما" وارد می‌شه. اسکیما بهت کمک می‌کنه تا اطلاعات روی صفحه رو به شکلی دقیق‌تر و دسته بندی شده به موتورهای جستجو مثل گوگل منتقل کنی.

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

گوگل در سال ۲۰۱۶ اعلام کرد که نشانه گذاری "JSON-LD" رو برای اسکیما ترجیح می‌ده که بینگ هم ازش پشتیبانی می‌کنه. اگه می‌خوای لیست کامل نشانه گذاری‌های اسکیما رو ببینی، می‌تونی به سایت Schema.org سر بزنی یا راهنمای "Structured Data" گوگل رو بخونی. بعد از اینکه داده‌های ساختاریافته مناسب رو برای صفحاتت پیاده سازی کردی، می‌تونی کدت رو با ابزار "Structured Data Testing Tool" گوگل تست کنی.

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

• کاروسل اخبار برتر (Top Stories)
• ستاره‌های نظرات (Review stars)
• باکس جستجوی لینک‌های سایت (Sitelinks search box)
• دستور پخت‌ها (Recipes)

یادت باشه که استفاده از داده‌های ساختاریافته (اسکیما) می‌تونه به نمایش "ریچ اسنیپت"‌ها توی نتایج جستجو کمک کنه، ولی هیچ تضمینی نیست که حتماً نمایش داده بشن. با افزایش استفاده از اسکیما، احتمالاً تو آینده انواع بیشتری از ریچ اسنیپت‌ها هم اضافه بشن.

چند تا نکته آخر برای موفقیت در استفاده از اسکیما:

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

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

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

تگ کنونیکال بهت اجازه می‌ده به موتورهای جستجو بگی که نسخه اصلی یه محتوا کجاست. در واقع داری بهشون می‌گی: "هی موتور جستجو! این صفحه رو ایندکس نکن، به جاش این صفحه مرجع رو ایندکس کن." بنابراین، اگه می‌خوای یه محتوا رو دوباره منتشر کنی (چه دقیقاً همون محتوا باشه یا با تغییرات جزئی)، ولی نمی‌خوای دچار مشکل محتوای تکراری بشی، تگ کنونیکال نجات دهندته!

برای اینکه مطمئن بشی محتوای منحصربه فرد توی سایتت فقط یک URL داره، باید کاننیکال سازی (Canonicalization) رو درست انجام بدی. گوگل توصیه می‌کنه که روی هر صفحه سایتت یه تگ کنونیکال قرار بدی که به خود همون صفحه اشاره کنه (self-referencing canonical). این کار باعث می‌شه موتورهای جستجو چند نسخه از یه صفحه رو به طور جداگانه ایندکس نکنن. مثلا ممکنه https://www.example.com و https://example.com به عنوان دو صفحه متفاوت در نظر گرفته بشن و محتوای تکراری ایجاد کنن.

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

تفاوت فیلتر کردن محتوا و جریمه محتوای تکراری

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

خیلی از سایت‌ها به خاطر گزینه‌های مرتب سازی و فیلتر کردن محصولات، صفحات تکراری زیادی دارن. مثلاً تو یه سایت فروشگاهی ممکنه گزینه ای مثل "مرتب سازی بر اساس قیمت از کم به زیاد" وجود داشته باشه که نتایج دسته بندی محصولات رو به این شکل تغییر بده: example.com/mens-shirts?sort=price_ascending. حالا اگه فیلترهای دیگه ای مثل رنگ، سایز، جنس و برند اضافه بشه، تعداد زیادی URL تکراری ایجاد می‌شه.

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

توی مقالات قبل گفتیم که سئو (SEO) به اندازه ای که برای موتورهای جستجو مهمه، برای کاربرا هم اهمیت داره. دلیلش هم اینه که موتورهای جستجو برای خدمت رسانی به کاربران ساخته شدن. به همین خاطر گوگل همیشه الگوریتمش رو طوری به روز می‌کنه که وب سایت هایی رو بالا بیاره که بهترین تجربه کاربری رو ارائه می‌دن. برای همینه که بعضی از سایت ها، با اینکه لینک‌های قوی دارن، توی نتایج جستجو خوب عمل نمی‌کنن.

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

تجربه مثبت برای کاربرای موبایل

امروز بیشتر از نصف ترافیک اینترنت از طریق موبایل هاست، پس واضحه که سایتت باید برای کاربرای موبایل هم قابل دسترسی و راحت باشه. گوگل توی آوریل 2015 آپدیتی ارائه کرد که صفحات موبایل پسند رو نسبت به بقیه صفحات اولویت می‌داد. حالا چطور می‌تونی مطمئن بشی که سایتت برای موبایل مناسب طراحی شده؟ با اینکه سه روش اصلی برای تنظیم سایتت برای موبایل وجود داره، گوگل طراحی واکنش گرا (responsive design) رو پیشنهاد می‌کنه.

طراحی واکنش گرا

تو طراحی واکنش گرا، صفحات وب برای نمایش در هر نوع دستگاهی، از موبایل گرفته تا کامپیوتر، به درستی تنظیم می‌شن. با استفاده از CSS، صفحات سایت می‌تونن به طور خودکار به اندازه صفحه دستگاه پاسخ بدن. این طراحی باعث می‌شه کاربرها نیاز نداشته باشن برای دیدن محتوا هی زوم کنن یا روی صفحه دوتا ضربه بزنن. اگه نمی‌دونی صفحات سایتت موبایل پسند هستن یا نه، می‌تونی از ابزار mobile-friendly test گوگل استفاده کنی!

AMP

AMP (Accelerated Mobile Pages) مخفف صفحات موبایلی پرسرعته و برای ارائه محتوا با سرعت بیشتر به کاربرای موبایل استفاده می‌شه. AMP از سرورهای کش استفاده می‌کنه و یه نسخه خاص از HTML و جاوااسکریپت داره که باعث می‌شه محتوا سریع‌تر بارگذاری بشه.

ایندکس گذاری Mobile-first

از سال 2018، گوگل شروع کرد به ایندکس گذاری سایت‌ها بر اساس نسخه موبایلشون (mobile-first indexing). بعضی‌ها این تغییر رو با mobile-friendliness اشتباه گرفتن، پس بهتره این دوتا رو از هم تفکیک کنیم. توی ایندکس گذاری اول موبایل، گوگل نسخه موبایل صفحات وب سایتت رو ایندکس می‌کنه. اینکه سایتت برای موبایل‌ها سازگار باشه، هم برای کاربرها و هم برای نتایج جستجو مفیده، اما ایندکس گذاری اول موبایل به صورت مستقل از mobile-friendliness انجام می‌شه.

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

بهبود سرعت صفحه برای جلوگیری از خستگی کاربرها

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

• ابزار PageSpeed Insights گوگل و مستندات بهترین شیوه ها
• چطور درباره ابزارهای سرعت فکر کنیم
• GTMetrix
• تستر سرعت و عملکرد وب سایت‌های موبایلی گوگل
• Google Lighthouse
• Chrome DevTools و آموزش هاش

تصاویر، یکی از اصلی‌ترین مقصرهای کند بودن صفحات!

تصاویر یکی از بزرگترین دلایل کندی صفحات وب هستن! علاوه بر فشرده سازی تصاویر، بهینه سازی متن جایگزین (alt text)، انتخاب فرمت مناسب تصویر و ارسال نقشه سایت تصاویر، راه‌های فنی دیگه ای هم برای بهبود سرعت نمایش تصاویر به کاربرها وجود داره. چند تا از مهم‌ترین روش‌های بهینه سازی تصاویر رو اینجا برات آوردم:

1. SRCSET: چطور بهترین سایز تصویر رو برای هر دستگاه ارائه بدیم؟

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

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

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

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

۲. نمایش پیش نمایش تصاویر در حال بارگذاری با لیزی لودینگ

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

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

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

توی ارزیابی سرعت صفحه معمولاً پیشنهادهایی مثل "فشرده سازی منابع" رو می‌بینی، ولی واقعاً این یعنی چی؟ فشرده سازی (minification) به این معنیه که فایل‌های کدی رو با حذف چیزهایی مثل فاصله‌ها و شکست خط‌ها و همچنین خلاصه کردن نام متغیرها فشرده کنیم.

تجمیع (bundling) هم یه اصطلاح دیگه ست که برای بهبود سرعت صفحه به کار می‌ره. توی این روش، چند فایل کدنویسی مشابه رو با هم ترکیب می‌کنیم و به یه فایل واحد تبدیلشون می‌کنیم. مثلاً چند فایل جاوااسکریپت رو می‌تونی توی یه فایل بزرگ‌تر بذاری تا تعداد فایل‌های جاوااسکریپت برای مرورگر کمتر بشه.

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

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

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

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

۱. زبان

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

۲. کشور

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

سوالات متداول

۱. چرا باید با اصول فنی سئو آشنا بشم؟

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

۲. رندر سمت کاربر و رندر سمت سرور چه تفاوتی با هم دارن؟

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

۳. چطور می‌تونم بفهمم گوگل صفحات سایتم رو چطور می‌بینه؟

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

۴. چرا استفاده از داده‌های ساختاریافته (اسکیما) برای سئو مهمه؟

داده‌های ساختاریافته به موتورهای جستجو کمک می‌کنن که بهتر بفهمن محتوای صفحت درباره چیه. همچنین ممکنه به نمایش امکانات ویژه ای مثل ریچ اسنیپت‌ها توی نتایج جستجو کمک کنه، مثل نمایش ستاره‌های نظرات یا باکس جستجوی لینک‌های سایت.

۵. تگ کنونیکال چیه و چرا باید ازش استفاده کنم؟

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

۶. چطور می‌تونم مطمئن بشم سایت من برای موبایل‌ها بهینه شده؟

گوگل پیشنهاد می‌کنه از طراحی واکنش گرا (responsive design) استفاده کنی که صفحات سایتت به طور خودکار برای نمایش توی هر دستگاهی سازگار بشه. برای بررسی سازگاری صفحات با موبایل، می‌تونی از ابزار "Mobile-Friendly Test" گوگل استفاده کنی.

۷. AMP چیه و چطور به سرعت سایت کمک می‌کنه؟

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

۸. چطور می‌تونم تصاویر سایتم رو برای سرعت بهتر بهینه کنم؟

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

جمع بندی

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