فصل ۵
دانش فنی سئو به شما کمک می کند سایت خود را برای موتورهای جستجو بهینه کنید و به آن نزد توسعه دهندگان اعتبار ببخشید.
اکنون که محتوای ارزشمندی را در زمینه تحقیقات جامع کلمات کلیدی طراحی کرده اید ، اطمینان حاصل کنید که نه تنها توسط انسان ، بلکه توسط موتورهای جستجو نیز قابل خواندن است! نیازی نیست که درک فنی عمیقی از این مفاهیم داشته باشید ، اما مهم است که درک کنید این دارایی های فنی چه کاری انجام می دهند تا بتوانید هوشمندانه درباره توسعه دهندگان درباره آنها صحبت کنید. صحبت با زبان برنامه نویسان مهم است زیرا احتمالاً برای انجام برخی از بهینه سازی های خود به آنها نیاز خواهید داشت.
نحوه کار وب سایت ها
- مراحل روند چیدمان صفحه وب می تواند بر زمان بارگذاری صفحه تأثیر بگذارد و سرعت نه تنها برای نگه داشتن کاربران در سایت شما مهم است بلکه یکی از عوامل رتبه بندی گوگل است.
- گوگل منابع خاصی مانند JavaScript را با “پاس دوم” ارائه می دهد. گوگل ابتدا به صفحه بدون جاوا اسکریپت نگاه می کند ، سپس چند روز تا چند هفته بعد ، JavaScript را ارائه می دهد ، به این معنی که عناصر مهم سئو که با استفاده از JavaScript به صفحه اضافه می شوند نمایه نمی شوند.
چگونه یک وب سایت از سرور فراخوانی شده و در مرورگر نمایش داده می شود
- HTML – آنچه در یک وب سایت نمایش داده می شود (عناوین ، محتوای متن و غیره)
- CSS – ظاهر وب سایت (رنگ ، فونت ها و غیره)
- JavaScript – نحوه رفتار آن (تعاملی ، پویا و غیره)
HTML: آنچه در یک وب سایت نمایش داده می شود
HTML مخفف زبان نشانه گذاری ابر متن است و به عنوان ستون فقرات یک وب سایت عمل می کند. عناصری مانند عنوان ، پاراگراف ، لیست و محتوا همه در HTML تعریف شده اند.
در اینجا مثالی از یک صفحه وب و نحوه HTML متناظر با آن آمده است:
این عکس از W3schools.com مکان مورد علاقه ما برای یادگیری و تمرین HTML ، CSS و JavaScript است.
HTML برای سئو کاران مهم است زیرا این زبان بدنه صفحات وب را تشکیل میدهد. اگرچه در CMS شما نیازی به نوشتن صفحات خود با HTML ندارد (به عنوان مثال: با انتخاب “hyperlink” می توانید پیوندی ایجاد کنید بدون اینکه لازم باشد “a href =” را تایپ کنید) وقتی کاری را در یک صفحه وب انجام دهید مانند افزودن محتوا ، تغییر متن پیوندهای داخلی و غیره. گوگل این عناصر HTML را بررسی می کند تا تعیین کند که سند شما با یک درخواست خاص مرتبط است. به عبارت دیگر ، آنچه در HTML شما وجود دارد ، نقشی اساسی در چگونگی رتبه بندی صفحه وب شما در جستجوی گوگل دارد.
CSS: ظاهر وب سایت چگونه است
CSS مخفف “cascading style pages” است و این همان چیزی است که باعث می شود صفحات وب شما از فونت ها ، رنگ ها و طرح های خاصی استفاده کنند. HTML برای توصیف محتوا ایجاد شده است نه برای استیل آن ، بنابراین وقتی CSS وارد صحنه شد ، یک تغییر دهنده بازی بود. با استفاده از CSS بدون نیاز به کدگذاری دستی استیل ها در HTML هر صفحه می توان صفحات وب را “زیبا” کرد ، این یک فرایند دشوار به ویژه برای سایت های بزرگ است. فقط در سال 2014 بود که سیستم نمایه سازی گوگل شروع به ارائه صفحات وب شبیه یک مرورگر واقعی کرد.
در یک مرورگر فقط متنی یک روش SEO کلاه سیاه که سعی در استفاده از سیستم نمایه سازی قدیمی گوگل داشت ، پنهان کردن متن و پیوندها از طریق CSS به منظور دستکاری در رتبه بندی موتورهای جستجو بود. این عمل “متن و پیوندهای پنهان” نقض دستورالعمل های کیفیت گوگل است.
اجزای CSS که به ویژه سئوکاران باید به آنها اهمیت دهند:
- از آنجا که دستورالعمل های استیل به جای HTML صفحه شما می توانند در فایلهای صفحه استیل خارجی (پرونده های CSS) زندگی کنند باعث می شود صفحه شما از نظر کد کمتر باشد ، باعث کاهش اندازه انتقال فایل و بارگذاری سریعتر شود.
- مرورگرها هنوز مجبورند منابعی را مانند فایل CSS بارگیری کنند ، بنابراین فشرده سازی آنها باعث بارگیری سریعتر صفحات وب شما می شود و سرعت صفحه یک عامل رتبه بندی است.
- با استفاده از CSS برای پنهان کردن پیوندها و محتوا وب سایت شما مجازات شده و از فهرست گوگل حذف می شود.
JavaScript: نحوه رفتار یک وب سایت
در روزهای ابتدایی اینترنت صفحات وب با HTML ساخته می شدند. وقتی CSS آمد محتوای صفحه وب توانایی سبک گرفتن را داشت. وقتی زبان برنامه نویسی JavaScript وارد صحنه شد وب سایت می توانند پویا باشند.
جاوا اسکریپت فرصت های زیادی را برای ایجاد صفحه وب غیراستاتیک بوجودآورد. وقتی کسی تلاش می کند به صفحه پیشرفته با این زبان برنامه نویسی دسترسی پیدا کند ، مرورگر آن کاربر JavaScript را در برابر HTML ساکن که سرور برگردانده است ، اجرا می کند و در نتیجه یک صفحه وب با نوعی تعامل ایجاد می شود.
شما قطعاً جاوا اسکریپت را در عمل دیده اید – شاید متوجه آن را نشده باشید! به این دلیل که JavaScript تقریباً می تواند هر کاری را برای یک صفحه انجام دهد. به عنوان مثال می تواند یک پنجره بازشو ایجاد کند ، یا می تواند منابع شخص ثالث مانند تبلیغات را برای نمایش در صفحه شما درخواست کند.
ارائه در سمت مشتری در مقابل ارائه در سمت سرور
جاوا اسکریپت می تواند برخی از مشکلات را برای سئو ایجاد کند از آنجا که موتورهای جستجو JavaScript را به همان روشی که بازدیدکنندگان انسانی مشاهده نمی کنند نمی بینند. این به دلیل ارائه سمت کلاینت در مقابل سرور است. بیشتر JavaScript در مرورگر مشتری اجرا می شود. از طرف دیگر با رندر سمت سرور پرونده ها در سرور اجرا می شوند و سرور آنها را در حالت کاملاً رندر شده به مرورگر می فرستد. عناصر صفحه که حساس به جستجوگرها هستند مانند متن ، پیوندها و برچسب هایی که در سمت مشتری با JavaScript بارگذاری می شوند در کد صفحه شما قابل مشاهده نیستند. این بدان معنی است که خزنده های موتور جستجو آنچه در JavaScript شما است را نمی بینند. گوگل می گوید تا زمانی که از جستجوی فایلهای JavaScript توسط Googlebot جلوگیری نکنید آنها به طور کلی می توانند صفحات وب شما را درست مانند یک مرورگر ارائه و درک کنند. این بدان معناست که Googlebot باید همان مواردی را که کاربر مشاهده می کند ببیند.
موارد دیگری وجود دارد که ممکن است در روند ارائه صفحات وب شما توسط Googlebot اشتباه شود که می تواند از درک Google در محتوای JavaScript شما جلوگیری کند: شما دسترسی Googlebot را به منابع جاوا اسکریپت مسدود کرده اید (به عنوان مثال: با robots.txt ، مانند آنچه که در فصل 2 آموخته ایم)
سرور شما نمی تواند همه درخواست ها را برای خزیدن محتوای شما انجام دهد جاوا اسکریپت برای درک Googlebot بسیار پیچیده یا قدیمی است جاوا اسکریپت محتوای “تنبل” را در صفحه “بارگذاری” نمی کند تا زمانی که خزنده با صفحه کار خود را به پایان برساند. اگرچه JavaScript امکانات زیادی برای ایجاد صفحه وب ایجاد می کند اما اگر مراقب نباشید می تواند برخی از پیامدهای جدی را نیز برای سئو سایت شما ایجاد کند. خوشبختانه راهی برای بررسی اینکه آیا گوگل همان چیزی را که بازدیدکنندگان شما می بیند مشاهده می کند یا نه وجود دارد. برای این کار از ابزار “بازرسی URL” از کنسول جستجوی گوگل استفاده کنید. به سادگی URL صفحه خود را در نوار جستجوی GSC جایگذاری کنید:
از اینجا روی “Test Live URL” کلیک کنید.
بعد از اینکه Googlebot آدرس URL شما را مجدداً بازیابی کرد ، روی “View Tested Page” کلیک کنید تا نحوه خزیدن و نمایش صفحه خود را ببینید.
- چرخ فلک های برتر داستان ها
- ستاره ها را مرور کنید
- جعبه های جستجو برای لینک های سایت
- دستور پخت
Mobile-first indexing
از سال ۲۰۱۸ گوگل برای اولین بار شروع به تغییر وب سایت به نمایه سازی از طریق تلفن همراه کرد. این تغییر باعث ایجاد سردرگمی بین دوستی موبایل و تلفن همراه اول شده است ، بنابراین جدا کردن از آن مفید است. با استفاده از Mobile-first indexing گوگل نسخه موبایل صفحات وب شما را خزنده و نمایه می کند. سازگاری وب سایت خود با صفحه نمایش موبایل برای کاربران و عملکرد شما در جستجو مفید است. اما نمایه سازی برای اولین بار در تلفن همراه مستقل ازواکشن گرا بودن برای تلفن همراه اتفاق می افتد. این امر نگرانی هایی را برای وب سایت هایی ایجاد کرد که فاقد برابری بین نسخه های موبایل و دسک تاپ هستند مانند نمایش محتوای مختلف ، پیمایش ، پیوندها و غیره در نمای موبایل. به عنوان مثال یک سایت تلفن همراه با پیوندهای مختلف روشی را که Googlebot (موبایل) سایت شما را می خزد و ارزش پیوند را به سایر صفحات شما ارسال می کند تغییر می دهد.
بهبود سرعت صفحه برای رضایت بازدیدکنندگان
گوگل می خواهد محتوایی ارائه دهد که به سرعت برای جستجوگران بارگیری شود. به همین دلیل سرعت صفحه یکی از جنبه های اساسی سئو سایت در سایت است. ما می توانیم با بهره گیری از ابزارهایی مانند آنچه در زیر ذکر کردیم سرعت صفحات وب خود را بهبود ببخشیم. برای کسب اطلاعات بیشتر در مورد هر کدام روی پیوندها کلیک کنید.
- Google’s PageSpeed Insights tool & best practices documentation
- How to Think About Speed Tools
- GTMetrix
- Google’s Mobile Website Speed & Performance Tester
- Google Lighthouse
- Chrome DevTools & Tutorial
تصاویر یکی از اصلی ترین مقصران صفحات کند است!
همانطور که در فصل ۴ بحث شد تصاویر یکی از دلایل شماره یک بارگیری آهسته صفحات وب هستند! علاوه بر فشرده سازی تصویر ، بهینه سازی متن alt تصویر ، انتخاب قالب مناسب تصویر و ارسال نقشه سایت تصویر ، روش های فنی دیگری نیز برای بهینه سازی سرعت و نحوه نمایش تصاویر به کاربران شما وجود دارد. برخی از روش های اصلی برای بهبود تحویل تصویر به شرح زیر است:
۱. SRCSET : نحوه ارائه بهترین اندازه تصویر برای هر دستگاه
ویژگی SRCSET به شما امکان می دهد چندین نسخه از تصویر خود داشته باشید و سپس مشخص کنید که کدام نسخه باید در شرایط مختلف استفاده شود. این قطعه کد به برچسب <img> (جایی که تصویر شما در HTML قرار دارد) اضافه می شود تا تصاویر منحصر به فردی را برای دستگاه های با اندازه خاص ارائه دهد.
این مانند مفهوم طراحی واکشن گرا است که قبلاً به آن پرداختیم باستثنای تصاویر!
این فقط زمان بارگذاری تصویر شما را تسریع نمی کند بلکه یک روش منحصر به فرد برای افزایش تجربه کاربری با ارائه تصاویر متفاوت و بهینه برای انواع مختلف دستگاه است.
۲. بارگذاری تصویر بازدیدکنندگان با بارگذاری کند در حال انجام است
بارگذاری کند هنگامی رخ می دهد که به یک صفحه وب بروید و به جای دیدن یک فضای سفید خالی برای محلی که یک تصویر در آن قرار دارد هنگام بارگیری متن اطراف یک نسخه سبک تصویر تار یا یک جعبه رنگی در جای خود ظاهر شود. پس از چند ثانیه تصویر با وضوح کامل بارگیری می شود. پلت فرم محبوب وبلاگ نویسی Medium واقعاً به خوبی این کار را انجام می دهد.
نسخه با وضوح پایین در ابتدا بارگذاری می شود و سپس نسخه با وضوح کامل بارگیری می شود. این امر همچنین به بهینه سازی مسیر رندر حیاتی شما کمک می کند! بنابراین در حالی که تمام منابع صفحه دیگر شما در حال بارگیری هستند شما یک تصویر تیزر با وضوح پایین نشان می دهید که به کاربران کمک می کند اتفاقات بارگیری را داشته باشند. برای کسب اطلاعات بیشتر در مورد چگونگی بارگیری تصاویر با کند به راهنمای بارگیری تنبل گوگل مراجعه کنید.
با متراکم کردن و بهم پیوستن پرونده های خود سرعت را بهبود ببخشید
ممیزی سرعت صفحه اغلب توصیه هایی از جمله “کوچک کردن منبع” را ارائه می دهد ، اما این واقعاً به چه معناست؟ Minification با حذف مواردی مانند خطوط شکاف و فاصله و همچنین کوتاه کردن نام متغیرهای کد ، هرجا که امکان دارد ، یک پرونده کد را متراکم می کند.
“Bundling” اصطلاح رایج دیگری است که در رابطه با بهبود سرعت صفحه می شنوید. فرآیند بسته بندی دسته ای فایلهای زبان برنامه نویسی را در یک فایل واحد ترکیب می کند. به عنوان مثال می توان یک دسته از پرونده های JavaScript را در یک پرونده بزرگتر قرار داد تا مقدار پرونده های JavaScript را برای یک مرورگر کاهش دهد.
با کوچک کردن و همراه کردن فایل های مورد نیاز برای ساخت صفحه وب سرعت وب سایت خود را افزایش داده و تعداد درخواست های HTTP خود را کاهش می دهید.
بهبود تجربه مخاطبان بین المللی
وب سایت هایی که چند زبانه هستند باید بهترین خدمات بین المللی سئو را برای ارائه بهترین تجربه ها در اختیار شما قرار دهند. بدون این بهینه سازی ها بازدید کنندگان بین المللی ممکن است در یافتن نسخه سایت شما که برای آنها مناسب است دچار مشکل شوند.
دو روش اصلی برای بین المللی شدن یک وب سایت وجود دارد:
زبان
سایتهایی که صفحاتی به زبانهای مختلف دارند وب سایتهای چند زبانه محسوب می شوند. این سایت ها باید چیزی به نام برچسب hreflang اضافه کنند تا به گوگل نشان دهند که صفحه شما برای زبان دیگری کپی شده است. درباره hreflang بیشتر بیاموزید.
کشور
سایتهایی که مخاطبانی از چندین کشور دارند وب سایتهای چند منطقه ای نامیده می شوند و آنها باید یک ساختار URL را انتخاب کنند که هدف قرار دادن دامنه یا صفحات آنها را برای کشورهای خاص آسان کند. این می تواند شامل استفاده از دامنه سطح بالا کد کشور (ccTLD) مانند “ir.” برای ایران یا دامنه عمومی سطح بالا (gTLD) با زیر پوشه خاص کشور مانند “example.com/ca” برای کانادا درباره URL های خاص محلی بیشتر بدانید.