استفاده از ajax در طراحی سایت و تأثیر آن بر روی سئو

استفاده از AJAX در طراحی سایت و تأثیر آن بر روی سئو


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

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

AJAX چیست؟


AJAX مخفف کلمات Synchronous Javascript And Xml است. این تکنولوژی مجموعه ای از تکنیکهای توسعه وب و طراحی سایت می باشد که به مهندسان نرم افزار امکان ایجاد برنامه های کاربری تحت وب و طراحی سایت می دهد.

با استفاده از جاوا اسکریپت، مرورگر با کاربر در تعامل است ؛ درخواستها کاربر را به سرور می فرستد و پاسخ XML دریافت می کند (همچنین به صورت JSON ) و یا HTML.از AJAX معمولاً برای بروز رسانی بخش از صفحه HML بدون هیچ تغییر مسیر و یا رفرشی استفاده می شود. این روش از توان پاسخگوئی بسیار مطلوبی در سمت سرویس گیرنده متناسب با رویداد ایجاده شده، برخوردار می باشند. چراکه آنها از اسکریپت های سمت سرویس دهنده برای دستیابی و مدیریت عناصر بخش رابط کاربر استفاده می نمایند. علاوه بر این، با توجه به مبادله غیرهمزمان داده به منظور ارسال و دریافت داده، امکان انجام عملیات مورد نظر بر روی داده بدون وقفه و ازدست دادن state وجود خواهد داشت. در نتیجه زمان لود صفحه به صورت قابل توجهی کاهش می یابد و از طرفی به بهبود user experience کمک می کند.

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

http://www.w3schools.com/AJAX/default.asp


مشکلات خزیدن AJAX

یکی از مشکلاتی که اکثر برنامه نویسان در کدنویسی سایت و طراحی سایت خود با اسکریپت های AJAX دارند عدم بررسی صفحات سایت در موتور جستجو و بهینه نبودن آنها برای سئو است.
برای شرح بهتر این مشکل به نحوه عمکرد Crawler موتور جستجوهای یا نحوه خزیدن بر روی صفحات وب . طراحی سایت می پردازیم :
1. رباتهای موتورهای جستجو ابتدا سورس صفحه مورد نظر را بررسی می کند.
2. سپس متا تگ های صفحه را می خوانند.
3. بعد از بررسی متا تگ ها و یافتن آپشن مورد نظر، در بدنه صفحه یا تگ body به دنبال لینک ها می گردد و لینکهای داخل کد href را در می آورد تا صفحات جدید را Crawl کند.

در اینجا اگر برای صفحه AJAX لینکی در نظر نگرفته باشید و با On Click نمایش دهید موتور جستجو قادر به پیدا کردن چیزی نیست که آن را باز کند، در نتیجه محتوای آن صفحه Crawl و ایندکس نمی شود.

از طرفی مشکل اصلی خزیدن AJAX این است که مبتنی بر جاوا اسکریپت کار می کند. جاوا اسکریپت یک زبان برنامه نویسی سرویس گیرنده می باشد و در مروگرهای (فایرفاکس، کروم و غیره) اجرا می شود. مرورگرهای مختلف دارای ویژگی ها و توابع مختلفی هستند در نتیجه جاوا اسکریپت نیاز به منابع اضافی دارد که این برای رباتهای موتورهای جستجو هزینه بر است، در نتیجه روی سئوی سایت تأثیر منفی می گذارد. همانطور که در مقاله های قبلی بحث شد اگر یک روش خاص باعث افزایش هزینه عملیاتی موتورهای جستجو شود، وب مسترها باید بر روی روشهای با هزینه کمتر کار کنند.

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

راه حل های رفع مشکل سئو در AJAX

دو تا از پر طرفدارترین روشها برای رفع مشکل خزیدن AJAX، رویکرد Hijax و طرح AJAX خزنده گوگل می باشد.

تکنیک Hijax

بر اساس تکنیک Hijax اگر در لینکی در طراحی سایت ، از AJAX یا جاوا اسکریپت استفاده می کنید، کدتان نباید به صورت زیر باشد.
<a href=”javascript:someFunction(`somepage.html#par ameter=1`)”>Click Me</a>
یا شبیه این:
<a href=”#”>Click Me</a>


دو روش فوق برای طراحی سایت بسیار محبوب است اما متأسفانه آنها URL معنی داری که بتوان توسط موتورهای جستجو مورد استفاده قرار گیرند، ایجاد نمی کنند.

با استفاده روش Hijax کدهای فوق باید به صورت زیر بازنویسی شود.
<a href=”somepage.html?parameter=1″ onclick=”someFunction(`somepage.html#parameter=1 `); return false”>Click Me</a>


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

البته روش بالا دارای محدودیتهایی هم هست، به عنوان مثال محتوای داخل AJAX را نمی توان به صورت داینامیک ایجاد نمود.

طرح AJAX خزنده گوگل

در طرح AJAX خزنده گوگل URL تمام صفحات دارای محتوای AJAX با کاراکترهای خاص (!#) مشخص می شوند و هنگامی که گوگل یک لینک با AJAX URL ببیند به عنوان مثال
"http://example.com/page?query#!stat"
به طور اتوماتیک آن را به صورت زیر تفسیر می‌کند.
“http://example.com/page?query&_escaped_fragment_=state”


برای این منظور برنامه نویسان برای طراحی سایت باید ساختار برنامه نویسی خود را تغییر دهند زیرا هنگامی که گوگل یک درخواست برای این URL می فرستد، سرور باید قادر به بازگشت کدHTML هنگام فراخوانی تابع AJAX باشد.

هنگامی که گوگل AJAX URL را ببیند، پس از تفسیر آن محتواهای را Crawl و ایندکس می نماید. در نهایت زمانیکه صفحه ایندکس شده در نتایج موتورهای جستجو قرار گرفت، گوگل URL اصلی را به کاربر نمایش می دهد.

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