روش استفاده از میکرو دیتا ها در طراحی سایت

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

 

میکرو دیتا در طراحی سایت

 

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

توجه *

تمام اطلاعا میکرو دیتا باید در بین تگی باشد که خاصیت itemscope را دارد.

<div itemscope ></div>

توجه کنید که این صفت داده ای را به خود نمی گیرد.

عنصر یا تگی که itemscope را به خود نسب داده است  . صفت  itemtype  را به خود نسبت می دهد که با استفاده از آن مشخص می کند که میکرو دیتا هایی که شما استفاده می کنید از چه نوعی هستند .

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

اما صفت دیگه ای وجود دارد که بیشترین کاربرد را دارد که کارش معرفی داده ها به گوگل می باشد. Itemprop  در مثال زیر دقت کنید :

<div itemscope itemtype =”http://schema.org/Movie”>
<h1 itemprop=”name”>Avatar</h1>
<span>Director: <span itemprop=”director”>James Cameron</span> (born August 16, 1954)</span>
<span itemprop=”genre”>Science fiction</span>
<a href=”/../movies/avatar-theatrical-trailer.html” itemprop=”trailer”>Trailer</a>
</div>

تگ ما دارای itemscope است و صفت  itemtype را به خود گرفته است که نشان می دهد داخل این تگ ما می خواهیم اطلاعات یک فیلم را برای موتورهای جستجو معرفی کنیم .( http://schema.org/Movie)

توجه داشته باشید  Avatar  نام برای فیلم است . چرا که itemprop=”name” می باشد. در اصل نوع داده در اینجا نام می باشد. تعداد مقادیری که صفت  itemprop به خود میگیرد بسیار زیاد است در زیر سه مورد از مهمترین ها رو برای شما نام می بریم .

Name
Description
Jobtitle
Author
Genre
Detail
….

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

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

<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>

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

توجه کنید استفاده از میکرو دیتا ها بسیار آسان است مثال زیر را ببینید :

استفاده از میکرو دیتا در طراحی سایت معرفی برای فیلم

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

</p>
<h1>Neil Patel</h1>

<h2>Video: Advanced SEO for Bloggers</h2>

<object …>

<param …>

<embed type=”application/x-shockwave-flash” …>

</object>

<p>An exclusive video with SEO and web marketing expert Neil Patel.

Drive ridiculous amounts of leads to your blog and learn the 7 secrets of conversion rate optimization.</p>
<p dir=”RTL”>

در ابتدا باید آنها را درون یک شی (عنصر div  )  قرار دهید . صفت itemscope را بهش اضافه کنید بعدش itemtype  را به آن نسبت دهید  لینک اسکیما ی مربوطه را برای آن بنویسید .

می توانید برای itemprop از خصوصیات زیر استفاده کنید

associatedArticle
bitrate
contentSize
contentURL
duration
embedURL
encodesCreativeWork
encodingFormat
expires
height
playerType
regionsAllowed
requiresSubscription
uploadDate
width

تا در نهایت کد پایانی شما بدین صورت می باشد :

</p>
<div itemprop=”video” itemscope itemtype=”http://schema.org/VideoObject”>

&nbsp;

<h2><span itemprop=”name”>Video: Advanced SEO for Bloggers</span></h2>

<meta itemprop=”duration” content=”T1M33S” />

<meta itemprop=”thumbnail” content=”neil-patel-video-thumbnail.jpg” />

<meta itemprop=”uploadDate” content=”2012-04-01T08:00:00-05:00″ />

<meta itemprop=”width” content=”640″ />

<meta itemprop=”height” content=”480″ />

<object …>

<param …>

<embed type=”application/x-shockwave-flash” …>

</object>

<p><span itemprop=”description”>An exclusive video with SEO expert Neil Patel.

Drive ridiculous amounts of leads to your blog and learn the 7 secrets

of conversion rate optimization.</span></p>

&nbsp;

</div>

با مقالات آموزش طراحی سایت وب نوش همراه باشید تا بهترین آموزش ها در زمینه طراحی سایت و سئو سایت برایتان ارائه نماییم .