چگونه سایت های تولیدی خود را از لحاظ جستجو در موتورهای جستجو با دیگر فریم ورک ها متمایز کنیم؟

هروقت این سوال مطرح می شود حجم عظیمی از مفاهیم قرار دادن داده درست در سایت ، کپی نکردن اطلاعات ، بولد کردن داده های مهم ، استفاده از تگ های هدینگ مناسب در جای مناسب و .... به ذهن می رسد. اما این موارد تنها مواردی نیست که باید به آن ها توجه کنیم. توجه به نحوه تگ بندی صفحه (درواقع کدهایی که ماژول ها برای ما تولید می کنند) بسیار با اهمیت می باشد.

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

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

چگونه محتوای خود را با استفاده از microdata ، mark up کنیم؟

الف – چرا باید از microdata استفاده کنیم؟

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

صفحات وب شما یک سری معانی اساسی دارند که توسط کاربران متناسب با تخصص آن ها برایشان قابل درک و فهم می باشد.اما موتورهای جستجو سطح محدودی از درک دارند و قادر به تشخیص محتوا مطابق انسان نمی باشند.با اضافه کردن تگ های اضافی به HTML صفحه مورد نظرتان در واقع تگ ها به موتورهای جستجو می گویند "هی موتور جستجو این صفحه داره یه ویدیو نمایش می ده ..." در واقع شما به موتورهای جستجو و برنامه ها می فهمانید که اطلاعات شما حاوی کدام دسته است : فیلم ، فایل صوتی ، PDF ، یک متن ساده و ....

ب - itemscope and itemtype

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

<div>

<h1>Avatar</h1>

<span>Director: James Cameron (born August 16, 1954)</span>

<span>Science fiction</span>

<a href="../movies/avatar-theatrical-trailer.html">Trailer</a>

</div>

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

بیان کردن محدوده با itemscope :

<div itemscope>

<h1>Avatar</h1>

<span>Director: James Cameron (born August 16, 1954) </span>

<span>Science fiction</span>

<a href="../movies/avatar-theatrical-trailer.html">Trailer</a>

</div>

محدوده اطلاعات <div> مشخص شده می باشد.

مشخص کردن نوع داده itemtype:

< "div itemscope itemtype="http://schema.org/Movie>

<h1>Avatar</h1>

<span>Director: James Cameron (born August 16, 1954)</span>

<span>Science fiction</span>

  <a href="../movies/avatar-theatrical-trailer.html">Trailer</a>

</div>

نوع اطلاعات فیلم می باشد.

ج- itemprop

چه اطلاعات اضافه ای می توانیم در مورد یک فیلم ارائه کنیم؟فیلم ها اطلاعاتی مانند : نام ، کارگردان ، ژانر و ... را به دنبال خود دارند.ما باید برچسب هایی که داده ما را دقیق تر می کند به محتوای خود اضافه کنیم . این کار با استفاده از itemprob انجام می شود.

<div itemscope itemtype ="http://schema.org/Movie">

  <h1 itemprop="name">Avatar</h1>

  <div itemprop="director" itemscope itemtype="http://schema.org/Person">

  Director: <span itemprop="name">James Cameron</span> (born <span itemprop="birthDate">August 16, 1954</span>)

  </div>

  <span itemprop="genre">Science fiction</span>

  <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">Trailer</a>

</div>

همانگونه که در مثال فوق مشاهده می نمایید نام فیلم ، کارگردان فیلم ، ژانر فیلم مشخص شده است.

د-Embedded items

گاهی اوقات یک attribute خودش شامل اطلاعات گسترده تری هست.برای مثال در مثال بالا attribute ، director خودش زیر مجموعه person هست و person دارای name و birthday و ... می باشد.

برای ست کردن مقادیر property های یک پارامتر شما باید فورا بعد از آن محدوده (itemscope) یک محدوده جدید را باز نموده و توضیح دهید.