طراحی سایت

استفاده از جاوا اسکریپت در چگونگی خزیدن ربات گوگل و فهرست بندی سایت توسط Google تأثیر دارد. اطمینان حاصل کنید که استفاده از JavaScript مانعی برای یافتن وب سایت شما از طریق موتورهای جستجو توسط کاربران نیست.
جاوا اسکریپت و SEO همیشه با هم خوب نبودند. ربات های موتور جستجو ، از جمله Googlebot ، نمی توانند Javascript را بررسی و بخزند ، بنابراین نمی توانند محتوای جاسازی شده با JavaScript را ببینند. اکنون ، گوگل و سایر موتورهای جستجو می توانند جاوا اسکریپت را خزنده و ارائه دهند. در این مقاله ی راهنمای SEO ، ما به شما نشان می دهیم که چگونه می توانید JavaScript را پیاده سازی کنید و اطمینان هم داشته باشید که SEO شما تحت تأثیر قرار نمی گیرد.

 

آیا موتورهای جستجو می توانند JavaScript را خزنده کنند؟

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

BING قابلیت رباتهای خود را با توجه به JavaScript محدود می کند ، و لزوماً از همان چهارچوبهای JavaScript پشتیبانی شده در آخرین نسخه مرورگر شما پشتیبانی نمی کند. بنابراین BING توصیه می کند از رندر پویا استفاده کنید. Google همچنین به مدیران وب سایتهایی که به سرعت محتوای JavaScript را تغییر می دهند توصیه می کند که از ارائه پویا استفاده کنند .

 

در این مقاله ، اندی فاول از سرچ جستجوگر در این مقاله نشان می دهد که چگونه JavaScript زمان بارگذاری وب سایت های تلفن همراه را افزایش می دهد.

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

 

Google از سال 2015 قادر به ارائه جاوا اسکریپت و CSS بوده و در آن زمان توصیه کرده است که هیچ م componentsلفه مهمی از سایت ، از جمله اجزای موجود در JavaScript یا CSS ، از خزیدن از طریق robots.txt مستثنی نباشد . گوگل همچنین اظهار داشت که اصل پیشرفت تدریجی را ترجیح می دهد ، رویکردی که شامل بهبود پی در پی وب سایت های HTML است. با این حال ، جاوا اسکریپت هنوز هم خزیده و ارائه می شود.

در اکتبر 2018 ، جان مولر در پاسخ به Reddit ، اشاره کرد که جاوا اسکریپت در سالهای آینده اهمیت بیشتری پیدا خواهد کرد و به SEO ها این نکته را می دهد تا بیشتر روی SEO JavaScript تمرکز کنند: “اگر شما به دنبال SEO فنی هستید ، پس از HTML شما باید بیشتر و بیشتر JS را درک کنید “.

 

با جاوا اسکریپت ، این دسترسی مستقیم امکان پذیر نیست. در مرحله اول ، خزنده باید DOM (Document Object Model) را تجزیه و تحلیل کند. کد DOM بارگیری و لیست می شود و فقط در صورت انجام این کار می توان وب سایت را ارائه داد. هر مرورگری هنگام وبگردی این کار را به صورت خودکار انجام می دهد. اگر می خواهید جاوا اسکریپت را آزمایش کنید ، می توانید به اصطلاح ” مرورگرهای بدون عنوان” استفاده کنید . این یک مرورگر بدون رابط کاربری گرافیکی است که توسط یک خط فرمان کار می کند.

 

5 قانون برای JavaScript و SEO

• محتوا باید در رویداد load نمایه شود تا محتوای JavaScript برای موتورهای جستجو منطقی باشد.
• محتوای وابسته به رویدادهای کاربر قابل فهرست نیست.
• سایت های JS به یک URL قابل فهرست شدن با پشتیبانی از سمت سرور نیاز دارند.
• بهترین روشهای SEO که برای سایتهای HTML استفاده می شود ، برای ارائه سایتهای JS نیز کاربرد دارد.
• هیچ تضادی بین نسخه های HTML و JavaScript وب سایت وجود ندارد.

 

اصول توسعه وب سایت های JavaScript.

جاوا اسکریپت پیچیده تر از HTML است. برای درک مهمترین نکته برای سئو ، ابتدا باید سعی کنید نحوه کار JavaScript را درک کنید:

1. درخواست اولیه: مرورگر و ربات موتور جستجو درخواست GET را برای کد HTML وب سایت و دارایی های وابسته به آن شروع می کنند.

2. رندر DOM: سایت اسکریپت JS DOM (Document Object Model) را به مرورگر یا ربات تحویل می دهد. در این سند نحوه شکل گیری محتوا در وب سایت و ارتباطات بین عناصر منفرد موجود در سایت نشان داده شده است. مرورگر این اطلاعات را ارائه می دهد و آنها را برای کاربر قابل مشاهده و استفاده می کند.

3. بارگذاری IDOM: در حالی که سایت مورد نظر در حال پردازش است ، مرورگر رویدادهایی را که متعلق به DOMContentLoaded هستند ایجاد می کند. سپس سند HTML اولیه بارگیری و ذخیره می شود. مرورگر یا ربات اکنون آماده پیاده سازی عناصر JavaScript است.

4. اجرای جاوا اسکریپت: عناصر جاوا اسکریپت اکنون می توانند بدون تغییر ، حذف یا گسترش کد منبع HTML ، محتویات یا عملکردهای وب سایت را تغییر دهند.

5. بارگذاری رویداد: به محض بارگیری منابع و منابع JS وابسته به این موارد ، مرورگر بارگیری را شروع می کند و سایت به پایان می رسد.

6. رویدادهای ارسال بار: پس از بارگیری سایت JS ، محتوای بیشتر یا عناصر کاربردی می توانند توسط کاربر تغییر داده یا تغییر دهند.

 

موتورهای جستجو مانند Google برای شبیه سازی دسترسی به یک مرورگر سنتی از مرورگرهایی به اصطلاح بدون سر استفاده می کنند. بر خلاف مرورگر “عادی” ، مرورگر بدون سر کد را از طریق DOM فراخوانی می کند تا وب سایتی را از آن ارائه دهد. به این ترتیب ، Googlebot می تواند به عنوان مثال بررسی کند که کدام عناصر جاوا اسکریپت را برای اصلاح سایت HTML وارد می کند. پس از ارائه ، Googlebot می تواند عناصر ارائه شده را مانند یک منبع HTML تجزیه و تحلیل و نمایه سازی کند.

با جاوا اسکریپت ، دو نسخه برای خزنده ها وجود دارد ، کد HTML پیش از DOM و کد HTML ارائه شده پس از DOM.

رویدادهای مهم از JavaScript که در SEO تأثیر دارند

رویدادهای بارگیری و رویدادهای کاربر به وضوح می توانند در SEO شما تأثیر بگذارند. به این دلیل:

• بارگذاری رویداد: هنگام بارگیری کامل سایت ، رویداد بارگیری توسط مرورگر “شلیک” می شود. ربات های موتور جستجو هنگام ارائه JavaScript از مرورگرهای رایج تقلید می کنند. بنابراین رویداد بارگذاری برای آنها مهم است – این امکان را برای آنها فراهم می کند تا از محتوای ارائه شده عکس فوری بگیرند. رویدادهای بارگیری شده پس از آتش سوزی رویداد بارگیری توسط خزنده جاوا اسکریپت در نظر گرفته نمی شوند و بنابراین نمایه نمی شوند ، زیرا JavaScript می تواند به سرعت محتوای سایت را تغییر دهد. این امر خصوصاً در مورد سایتهای خبری یا فیدهای شبکه های اجتماعی مانند توییتر و فیس بوک اتفاق می افتد.

بازه زمانی DOMContentLoaded را می توان با ابزار توسعه Google اندازه گیری کرد:

• رویدادهای کاربر: پس از رویداد بارگیری ، رویدادهای بعدی را می توان از طریق JavaScript فعال کرد. به عنوان مثال ، در میان این موارد اصطلاحاً “onClick-Events” وجود دارد. اینها مواردی هستند که توسط کاربر ایجاد می شوند ، مانند محدود کردن محتوای سایت یا پیمایش تعاملی. با این حال ، این محتوا ، که توسط رویدادهای کاربر ایجاد یا تغییر می کند ، معمولاً توسط موتورهای جستجو نمایه نمی شود ، زیرا پس از رویداد بارگیری صورت می گیرد.

 

خطاهایی که باید با JavaScript از آنها اجتناب کنید

اگر از JavaScript در وب سایت خود استفاده می کنید ، Google اکنون می تواند عناصر پس از رویداد بارگیری را به خوبی ارائه دهد و در نهایت می تواند عکس فوری را مانند یک سایت HTML سنتی بخواند و ایندکس کند.

بیشتر مشکلات JavaScript و SEO ناشی از اجرای نادرست است. بنابراین بسیاری از بهترین روشهای معمول سئو می توانند برای سئو JavaScript نیز استفاده شوند. اینها تعدادی از رایج ترین خطاهایی است که می تواند رخ دهد:

1. URL های قابل فهرست گذاری: هر وب سایت به URL های منحصر به فرد و متمایزی نیاز دارد تا سایت ها بتوانند به طور کلی فهرست بندی شوند. pushState ، همانطور که با JavaScript ایجاد شده است ، یک URL تولید نمی کند. بنابراین ، سایت جاوا اسکریپت شما همچنین به سند وب خاص خود نیاز دارد که می تواند کد وضعیت 200 تأیید را به عنوان پاسخ سرور به مشتری یا درخواست ربات ارائه دهد. بنابراین هر محصولی که با JS ارائه می شود (یا هر دسته از وب سایت های شما با JS تحقق یافته است) باید به URL سمت سرور مجهز باشد تا سایت شما نمایه شود.

2. خطاهای pushState: با استفاده از روش pushState می توان URL های JavaScript را تغییر داد. بنابراین ، باید اطمینان حاصل کنید که URL اصلی با پشتیبانی از سمت سرور پخش می شود. در غیر این صورت ، محتوای تکراری را به خطر می اندازید.

3. Missing Metadata: با استفاده از JavaScript ، بسیاری از وب مسترها یا سئو اصول را فراموش کرده و داده های متا را به ربات منتقل نمی کنند. با این حال ، همان استانداردهای SEO برای محتوای JavaScript همانند سایت های HTML است. بنابراین ، در مورد عنوان و متا توضیحات برچسب های ALT برای تصاویر فکر کنید.

4. a href and img src: Googlebot به پیوندهایی نیاز دارد که بتواند آنها را دنبال کند تا بتواند سایتهای بیشتری پیدا کند. بنابراین ، شما همچنین باید در اسناد JS خود پیوندهایی با صفات href- یا src ارائه دهید.

5. ایجاد نسخه های یکپارچه: از طریق ارائه جاوا اسکریپت ، نسخه های preDOM و postDOM بوجود می آیند. اطمینان حاصل کنید که ، در صورت امکان ، هیچ تناقضی وجود ندارد و به عنوان مثال ، برچسب ها یا صفحه های متعارف را می توان به درستی تفسیر کرد. به این ترتیب از پوشاندن لباس جلوگیری خواهید کرد .

6. ایجاد دسترسی برای همه ربات ها: همه ربات ها مانند Googlebot نمی توانند با JavaScript برخورد کنند. بنابراین توصیه می شود عنوان ، اطلاعات متا و برچسب های اجتماعی را در کد HTML قرار دهید.

7. JS را روی robots.txt غیرفعال نکنید: اطمینان حاصل کنید که JavaScript شما توسط Googlebot نیز قابل خزیدن است. برای این منظور ، دایرکتوری ها نباید در robots.txt حذف شوند.

8. استفاده از نقشه سایت فعلی: برای نشان دادن هرگونه تغییر احتمالی در محتوای JS به Google ، باید همیشه ویژگی “lastmod” را در نقشه سایت XML خود حفظ کنید.

وب سایتهای JavaScript را بررسی کنید: در حسابرسی چه کاری باید انجام دهید

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

برای بررسی JavaScript خود ، می توانید از Google Developer Tools از Google Chrome و همچنین از Web Developer Expansion برای Chrome استفاده کنید .

1. بازرسی بصری

برای دریافت اینکه بازدیدکننده چگونه یک وب سایت را مشاهده می کند ، باید محتوای وب سایت را به موارد زیر تقسیم کنید:

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

به این ترتیب می توانید انتخاب را به عناصری که با JavaScript تحقق می یابند محدود کنید. شما باید در حال بررسی عناصر JavaScript باشید تا بتواند این عناصر را خزنده کند.

2. کد HTML را بررسی کنید

با ابزارهای توسعه دهنده وب می توانید CSS ، JavaScript و کوکی ها را خاموش کنید. می توانید موارد موجود در سایت را در کد باقیمانده مشاهده کنید. این عناصر توسط JavaScript کنترل می شوند.

سپس ، می توانید عناصر متا مانند عنوان و شرح وب سایت را کنترل کنید. بنابراین ربات ها می توانند این عناصر را فهرست بندی کنند ، باید از طریق رویداد load قابل دسترسی باشند. به طور کلی ، با این حال ، فقط Google در حال حاضر می تواند این عناصر را بخواند. بنابراین توصیه می شود حتی در سایت های JS برچسب های عنوان و متا را در کد HTMl بنویسید.

3. HTML ارائه شده را بررسی کنید

سایت را با JavaScript و CSS غیرفعال شده دوباره بارگیری کنید. در آخر ، روی سایت کلیک راست کرده و “Examine element” را در فهرست Chrome انتخاب کنید. در سمت راست ، پنجره دیگری ظاهر می شود. بر روی برچسب HTML کلیک کنید. با یک کلیک راست ، یک منوی گزینه ظاهر می شود. “کپی کردن HTML خارجی” را در اینجا انتخاب کنید. در آخر ، کد را وارد یک ویرایشگر کنید. سپس این کد توسط موتورهای جستجو مانند Google قابل نمایه سازی است.

همچنین می توانید با استفاده از ابزار بازرسی URL یا ابزار آزمایش دوستانه تلفن همراه ، JavaScript را با Google Search Console تست کنید.

 

موارد دیگری که باید در نظر گرفت

• URL های قابل فهرست گذاری: برای اینکه یک وب سایت به طور کامل فهرست بندی و رتبه بندی شود ، به یک URL قابل فهرست شدن نیاز دارد. اگر وب سایت شما از نسخه های JavaScript استفاده می کند که نمی توان از طریق URL خود آنها را فراخوانی کرد ، برای موتورهای جستجو امکان فهرست بندی این سایت وجود ندارد. اگر یک URL وجود دارد اما نمی تواند در کد JS پیوند داده شود ، سایت به طور مشابه نمی تواند رتبه بندی کند.
• pushState: اگر یک URL نامناسب توسط pushState تولید شود ، محتوای تکراری می تواند بوجود آید. بنابراین ، به خصوص حتماً پیوندهای داخلی ایجاد شده با JavaScript را بررسی کنید.
• ویژگی های داده: در سایت های JS ، منابع بیشتری مانند تصاویر می توانند در ویژگی های داده ذخیره شوند. با این حال ، به طور کلی ، این منابع نمی توانند توسط ربات ها بارگیری ، ارائه و نمایه سازی شوند. بنابراین توصیه می شود که از منابع ، مانند تصاویر ، به طور سنتی از طریق HTML استفاده کنید.

1. prerender.io

prerender.io یک نرم افزار منبع باز است که ارائه یک سایت JS را بهینه می کند. با این کار ، سایت پس از ارائه در حافظه پنهان است و در صورت دسترسی با ربات ، می توان با سرعت بیشتری آن را بالا برد.

2. Brombone

این برنامه وب سایت شما را بارگیری می کند و آن را در یک مرورگر وب ارائه می دهد ، به این معنی که شما به راحتی می توانید عملکرد صحیح بازیابی AJAX و JavaScript را بررسی کنید. تغییرات DOM را می توان به همان روش آزمایش کرد. اگر رندر کار کند ، این سایت ها به صورت HTML ذخیره می شوند. اگر یک خزنده به سایت شما دسترسی دارد ، می توانید اجازه دهید سایت های ارائه شده JS توسط پروکسی از Brombone صادر شوند. برای پیاده سازی صحیح ابزار ، به نقشه سایت XML نیز نیاز دارید.

3. JS ANGULAR

با استفاده از Angular JS ، می توان عکس های فوری HTML را از قبل ارائه داد تا Googlebot با سرعت بیشتری بتواند سایت های JS را درک و فهرست بندی کند.

4. SEO.JS

با استفاده از این برنامه ، کد JS نیز به صورت HTML ارائه می شود و توسط Google قابل خزیدن است. بدین وسیله کد برنامه به سرور شما منتقل می شود. داشتن داشبورد اختصاصی به شما در مدیریت عناصر JS و سایتهایی که باید ارائه شوند کمک می کند. علاوه بر این ، این ابزار با سایت های JS شما یک نقشه سایت XML ایجاد می کند.

5. کنسول جستجوی گوگل

با استفاده از نسخه قدیمی Search Console ، Google با ارائه سایت های منفرد به شما در بررسی عناصر JS کمک می کند. این ابزار همچنین مشکلات احتمالی خزیدن را نشان می دهد.

6. Isomorphes JavaScript

با جاوا اسکریپت هم شکل ، برنامه ها را می توان از طریق سرور یا مشتری انجام داد. Back-End و Front-End بنابراین کد مشابهی دارند. با اجرای رندر گمشده ، جاوا اسکریپت در رابطه با سئو سایت کمتر مستعد خطا است.

7. Ryte

اکنون بسیاری از ابزارهای جستجوگرها قادر به جستجوی جاوا اسکریپت هستند تا کاربران بتوانند تجزیه و تحلیل کامل تری از سایت خود داشته باشند. از فوریه 2019 ، خزنده Ryte همچنین می تواند JavaScript و CSS را با استفاده از یک مرورگر Chrome بهینه شده ارائه و خزنده کند. این جاوا اسکریپت را در هر صفحه تا 30 ثانیه اجرا می کند ، بنابراین تمام عناصری که هنگام بارگیری صفحه برای اولین بار بارگیری می شوند ، رندر و خزیده می شوند. می توانید در این مقاله اطلاعات بیشتری کسب کنید .

نتیجه

JavaScript می تواند عملکرد وب سایت شما را بسیار گسترش دهد. با این وجود ، موارد زیادی وجود دارد که باید برای اطمینان از جاوااسکریپت در استراتژی SEO خود در نظر بگیرید. بعضی اوقات استفاده از پیشرفت پیشرفته به جای ساختن سایت فقط با جاوا اسکریپت منطقی تر است ، خصوصاً وقتی AMP یا برنامه های وب پیشرو را در نظر می گیرید. همچنین باید از ابزارهای موجود برای کمک به ایجاد ، ویرایش یا بررسی عناصر JavaScript در سایت خود استفاده کنید.