18 متاتگ که باید در صفحات وب از آنها استفاده کنید.

متاتگ (Meta Tag) یک بخش از کد HTML یا XHTML است که اطلاعات اضافی در مورد محتوای یک صفحه وب را ارائه می‌دهد. این اطلاعات برای مرورگرها و موتورهای جستجو مفید هستند تا صفحه وب را بهتر درک کنند و نمایش دهند. متاتگ‌ها عمدتاً در سرآیند (Head) صفحه HTML قرار می‌گیرند. اگر بخواهم صادق باشم، در حال حاضر مهمترین توانایی متا تگ ها معرفی بهتر مطالب شما به موتورهای جستجو می باشد و می توان گفت تاثیر مستقیمی بر رتبه بندی صفحات در موتورهای جستجو ندارد.

سه شبکه اجتماعی بزرگ برای بازاریابان این اجازه را فراهم کرده­اند تا از توانایی های متاتگ ها که در آنها نهفته است استفاده کنند.

شاید برایتان سوال باشد پس چرا باید متاتگ ها استفاده کنیم؟ مهم ترین فاکتوری که بر رتبه بندی وب سایت شما در صفحه نتایج دارد، تجربه کاربری است که موتورهای جستجو از رفتار کاربر بازخورد می گیرد. از این رو اگر شما محتوای تولید نمایید که نیاز یا مشکل مخاطب را رفع نمایید و از طرف دیگر این محتوا را به خوبی به موتورهای جستجو معرفی نمایید باعث می شود کاربر از محتوای شما رضایت داشته باشد (موتورهای جستجو از روی رفتار مخاطب خود متوجه این بازخورد خوب می شود) و این فرآیند باعث بهبود جایگاه سایت شما در صفحه نتایج می شود.

البته ناگفته نماند تاثیر بک لینک ها در رتبه بندی صفحه نتایج موتورهای جستجو بسیار بالاست ولی تنها فاکتور نمی باشد.

اتخاذ متاتگ جدید

Common Crawl یکی از حداقل کار هایی است که باید در سئو به آن توجه داشت. وقتی شما از ساختار مناسبی برای هدایت بهتر صفحات استفاده می­کنید، ارزش لینک های شما در وبسایت­ باقی می­ماند. همچنین متا­تگ­های بسیار مهمی وجود دارند که باید برای SEO آماده­سازی شوند. واضح است که محتوای موجود در صفحه کلیدی است، اما اگر نتوانیم بر روی محتوا کلیک کنیم، تأکید بر روی چیست؟

Page Title

طول عنوان صفحه به عنوان مهم­ترین عامل در صفحات وب در نظر گرفته می­شود، به تازگی برسی هایی بر روی تگ عنوان انجام شده است. نتایج جدید مشخص کرده است که طول عنوان صفحه به 70 کاراکتر محدود نمی­شود، بلکه به اندازه عرض پیکسل مرتبط است. همچنین می­توانید آزمایش انجام شده بر روی تگ عنوان با بیش از 70 کاراکتر را مشاهده کنید.(لینک دارد) در بین مطالب نویسنده های تازه کار عناوین بسیار طولانی دیده­ام که در نتایج جستجو اغلب خرد شده و یا توسط الگوریتمی با توجه به بیشترین تطابق با متن برای نمایش، کوتاه شده است.

لازم نیست شما پهنای پیکسل موضوع خود را اندازه گیری کنید، بهترین کار این است که شما متنی که انتخاب می کنید کمتر از 70 کارکتر باشد و سعی کنید کلمات کلیدی را در آن استفاده کنید.

Format:

<title>Up to 70 Characters of Keyword-relevant text here</title>

 

 Meta Description

اگر وبسایت شما تجاری است از meta description به عنوان شعار وبسایت خود می توانید استفاده کنید. در تحقیقاتی که iacquire و SurveyMonkey انجام داده اند متوجه شده­اند که 43 درصد افراد با توجه به شرح meta description بر روی نتایج جست و جو کلیک کرده اند و وارد وبسایت شده اند. دورانی که در این متاتگ فقط کلمات کلیدی را لیست می­کردند و فقط عنوان «وب­سایت رسمی …» را داشتند گذشته است. در این متاتگ سعی کنید کلمه کلیدی در آن استفاده شود و هدف اصلی از این متاتگ این است که نظر کاربر را جلب کند. با استفاده از این متاتگ به کاربران این جازه را بدهید که آنچه را انتظار دارند در مورد وبسایت شما بدانند، و  متقاعد شوند که بر روی وبسایت شما کلیک کنند.

طول meta description باید کمتر از 155 کاراکتر باشد.

Format:

<meta name=”description” content=”155 characters of message matching text with a call to action goes here”>

 

Authorship Markup

همانطور که در سرچ Love NYC در نوامبر 2011 پیش­بینی کردم و این پیش­بینی توسط اریک اشمیت تأیید شد، گوگل در حال رتبه­بندی محتوایی است در رابطه با مولفانی که به نظر می­رسد دارای منابع قابل اطمینانی بر روی محتوای خود نسبت به سایر مولفان هستند. انگیزه­ی آشکار و قابل توجه این است که شما در صورتی که مولف باشید، نام و تصویر شکیل خود را در SERPها مشاهده خواهد کرد.

در صورتیکه ناشر باشید، پست­های شما در قسمت سمت راست  SERPها قرار خواهند گرفت.

 

اکنون اجازه بدهید به متاتگ­هایی نگاه بیندازیم که رخدادی جادویی را موجب می­شوند!

• Rel-Author–  این متاتگ می­تواند زمان پیاده­سازی تعیین کند چه کسی مولف  بخشی از محتوا است و از گوگل پلاس برای شناسایی افراد استفاده می­کند. گوگل در ابتدا این مورد را تنها به عنوان تگی تعیین کرد که در کد <head>  قرار می­دهیم،

فرمت:  در مورد نسخه­ای که در تگ <head> استفاده می­شود، در شکل زیر را می­بینید:

<link rel=”author” href=”https://plus.google.com/[YOUR PERSONAL G+ PROFILE HERE]“/>

 

در مورد کد بالا  ، می­توانید از XFN’s rel-me  تقلید کنید و لینک را به شکل مستقیم بر روی صفحه قرار دهید. من معتقدم می­توانیم این فرمت را به عنوان راهبرد ایجاد لینک معتبر بپذیریم.

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

• Rel-Me تنها نسخه­ی XFN از re-author است. بسادگی متاتگ را بر روی لینکی قرار دهید که به پروفایل گوگل پلاس شما اشاره می­کند.

Format:

<a href=”https://plus.google.com/[YOUR PERSONAL G+ PROFILE NUMBER]” rel=”me”>Me on Google+</a>

 

• Rel-Publisher مختص موجودیت­های کسب و کار است که ادعای مالکیت محتوای خود را دارند. این نوع می­تواند در زمینه­هایی که دارای rel-author هستند استفاده شود یا جایگزین آن شود، اما باید به پروفایل کسب و کار بر روی گوگل پلاس بجای پروفایل فردی اشاره شود.

Format:

<link rel=”publisher” href=”https://plus.google.com/[YOUR BUSINESS G+ PROFILE HERE]“/>

 

متاتگ­های شبکه های اجتماعی

رسانه­ اجتماعی بوضوح جایگاهی مطلوب برای کشف محتوا است، اما اغلب متادیتای ایجادشده­ی تحقیقاتی برای ایجاد انگیزه در افراد به منظور کلیک کردن آنها کافی نیست، بنابراین استفاده از متاتگ­ها ارائه­شده برای هر شبکه اجتماعی  بهترین روش هستند. این متاتگ­ها همیشه در مورد قراردادن کلمه­ی کلیدی نیستند، بلکه می­توانند در مورد جلب توجه افراد و ترغیب آن­ها به کلیک ­کردن باشند. همه­ی ما می­دانیم که کاربران گوگل پلاس عموماً افراد حرفه­ای هستند، کاربران فیس­بوک به دنبال پیداکردن دوستان پیشین خود هستند و کاربران توییتر با تایم لاین هایی مملو از طرز تفکر افراد روبرو هستند. اجازه بدهید در مورد گزینه­های متادیتای مختص کانال صحبت کنیم.

OpenGraph tags

OpenGraph فیس­بوک به شما اجازه می­دهد متادیتا را به منظور بهینه ­سازی نحوه ­ی نمایش محتوای خود در تایم لاین بکار بگیرید. ارزش استفاده از این داده­ها این است که  با ایجاد «لبه» در فیس­بوک، می­توانید داده­های خارق­العاده­ای را در مورد کاربرانی که محتوای شما را از طریق گزینه ­های مشاهده  فیس­بوک کنترل می ­کنند، بدست بیاورید. اگر از تگ­های گراف باز استفاده نمی­کنید، فیس­بوک از متادیتا­های استاندارد پیش­فرض استفاده خواهد کرد.

• og:title – این تگ، عنوان بخشی از محتوا است. از این تگ باید به عنوان سرخطی استفاده شود که برای کاربران فیس­بوک جذاب باشد. استفاده از عنوانی متفاوت با سایت حقیقی تا زمانیکه پیام نهایی مشابه است، بلامانع است. برای اینکار 95 کاراکتر در اختیار دارید.

Format:

<meta property=”og:title” content=”iAcquire’s awesome blog”/>

 

• og:type –  این تگ عنوان شی است که بخشی از محتوای شما است.  برای آنچه مد نظر شما است این تگ می­تواند وبلاگ، وب­سایت یا مقاله باشد، اما اگر قصد مطالعه­ی بیشتر دارید، فیس­بوک لیست کاملی را ارائه می­دهد. 

Format:

<meta property=”og:type” content=”article”/>

 

• og:image – این تگ تصویری است که فیس­بوک در تصویر لحظه­ای محتوا نشان خواهد داد. از تخصیص تصویری مربع­شکل به منظور اطمینان از بهترین دیدگاه در خط زمانی کاربر مطمئن شوید. در صورتیکه تصویری اختصاص­داده­شده به مشتری منطبق با محتوای موجود نباشد، بر آن اساس فیس­بوک می­تواند آن را پاک کند. این تگ تنها روش برای اطمینان از بهترین و اولین اثر نیست.

Format:

<meta property=”og:image” content=”http://www.iacquire.com/some-thumbnail.jpg”/>

 

• Og: url – این تگ به بیان ساده URL (یا لبه­ی) صفحه است. این تگ را باید بخصوص زمانی تعیین کنید که محتوایی رونوشت برای اطمینان از اینکه مقدار لبه در فیس­بوک در URL یکپارچه شده است، وجود دارد.

Format:

<meta property=”og:url” content=”http://blog.iacquire.com”/>

 

• og:description – این تگ توصیفی است که فیس­بوک در تصویر لحظه­ای قسمتی از محتوا نشان خواهد داد. دقیقاً مانند توصیف متای استاندارد، این تگ باید جذاب و شامل درخواست اقدام باشد. اما در این مورد تقریباً دو برابر تعداد کاراکترها را برای کار در اختیار دارید. اطمینان حاصل کنید که این دو در اختیار کاربران فیس­بوک هستند. برای انجام اینکار 297 کاراکتر در اختیار دارید.

Format:

<meta property=”og:description” content=”Stop hitting refresh on your ex-girlfriend’s Facebook page? You should check out the iAcquire blog and learn something instead”/>

 

• Fb: admins – این متاتگ برای دسترسی به ارزش واقعی داده­های در دسترس از طریق ابزارهای مشاهده­ی فیس­بوک ضروری است. بسادگی باید شناسه­ی کاربری فیس­بوک را در متادیتای کاربرانی قرار دهید که قصد دسترسی دارند. برای کسب اطلاعات بیشتر در مورد ابزارهای مشاهده­ی فیس­بوک این مستند را ببینید.

Format:

<meta property=”fb:admins” content=”USER_ID”/>

به علت پذیرش عمومی فیس­بوک، سایر شبکه­های اجتماعی نسبت به متاتگ­های Open Graph به صورت پیش­فرض عمل می­کنند، در صورتیکه هیچ متاتگ دیگری وجود نداشته باشد. با وجود این، همانطور که پیشتر در این بحث بیان کردم، به منظور آماده­سازی مجموعه­ای از متادیتاها، باید قابلیت صحبت افراد مختلف در کانال­های متنوع نادیده گرفته شود. با درک این موضوع که گوگل پلاس غالباً توسط افراد حرفه­ای استفاده می­شود، کاربران فیس­بوک دارای تنوع بیشتری هستند و کاربران توییتر اغلب با محتوایی سر و کار دارند که به سرعت از اذهان می­گذرند، چرا نباید متادیتای شما را در نظر گرفت؟

برای کسب اطلاعات بیشتر مستند پروتکل Open Graph را ببینید.

 Twitter Cards

 Twitter Cards به بیان ساده پاسخ توییتر به پروتکل Open Graph هستند و می­توانید آن­ها را جداگانه بررسی کنید، اما اینجا فقط تصویری لحظه­ای از مستندسازی توییتر را می­بینیم.

 ارزش برجسته­کردن محتوا در تایم لاین آشفته­ ی توییتر و در نهایت بازگرداندن افراد بیشتر است. گرچه با گذشت زمان نشان داده شده که بسیاری از کاربران برخی مطالب را بدون خواندن دقیق آن­ها و با استفاده از Twitter Cards مانند تبلیغاتی که به بازنشر آسان محتوا کمک می­کنند نیز بازتوییت می­کنند. بیشتر این تگ­ها مانند آنچه فقط در مورد Open Graph فیس­بوک خوانده­اید، است، بنابراین فقط خلاصه­ای از آن را بیان می­کنم.

• twitter:card –  این تگ نوع Card است. گزینه­های شما خلاصه، عکس یا پلیر هستند. در صورتیکه این تگ تعیین نشود، توییتر به شکل پیش­فرض به «خلاصه» تغییر شکل خواهد داد.

Format:

<meta name=”twitter:card” content=”summary”>

 

• twitter:url – این تگ URL محتوا است.

Format:

<meta name=”twitter:url” content=”http://www.nytimes.com/2012/02/19/arts/music/amid-police-presence-fans-congregate-for-whitney-houstons-funeral-in-newark.html”>

 

• twitter:title – این تگ عنوان محتوای به ­اشتراک­ گذاشته ­شده است و باید به 70 کاراکتر محدود شود و بیش از این مقدار را توییتر کوتاه خواهد کرد.

Format:

<meta name=”twitter:title” content=”Parade of Fans for Houston’s Funeral”>

 

• twitter:description – این تگ توصیف محتوای به­اشتراک­گذاشته­شده است و باید به 200 کاراکتر محدود شود و بیش از این مقدار را توییتر کوتاه خواهد کرد. باز هم با داشتن متنی جذاب­تر فرصت­های بیشتری را در مقایسه با حالت عادی توییتر در اختیار خواهید داشت.

Format:

<meta name=”twitter:description” content=”NEWARK – The guest list and parade of limousines with celebrities emerging from them seemed more suited to a red carpet event in Hollywood or New York than than a gritty stretch of Sussex Avenue near the former site of the James M. Baxter Terrace public housing project here.”>

 

• twitter:image – این تگ تصویری است که بر روی کارت توییتر نمایش داده خواهد شد و باید تصویری مربعی با ابعادی باشد که کمتر از 60 * 60 پیکسل نباشد.

<meta name=”twitter:image” content=”http://graphics8.nytimes.com/images/2012/02/19/us/19whitney-span/19whitney-span-articleLarge.jpg”><b>&nbsp;</b>

متاتگ­های twitter card با گزینه­های بیشتری به عنوان سایت و ایجادکننده وجود دارد که ابزارهای توییتر سایت و مولف مسئول محتوا را تعیین می­کند، اما لازم نیست محتوا در ابتدا دارای برداشت اولیه­ی مطلوبی باشد، بنابراین آن­ها را نادیده گرفتم. برای کسب اطلاعات بیشتر مستندسازی کارت توییتر را ببینید.

اسکیما یا زبان نشانه گذاری سایت

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

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

کدهای ذکر شده برای هر مورد به زبان json-ld می باشد و باید در تگ script قرا بگیرد. به عبارت دیگر با تگ <script type=”application/ld+json”> شروع و در انتها با </script> بسته می شود.

Person: برای توصیف افراد، از جمله نام، نام خانوادگی، آدرس ایمیل و سایر مشخصات.

"@context": "http://schema.org",
"@type": "Person",
"name": "John Doe",
"jobTitle": "Software Engineer",
"email": "johndoe@example.com",
"telephone": "+1-123-456-7890",
"url": "http://www.example.com/johndoe"

Product: برای توصیف محصولات، از جمله نام محصول، قیمت، موجودی، تصاویر و ویژگی‌ها.

"@context": "http://schema.org",
"@type": "Product",
"name": "Smartphone",
"description": "A high-end smartphone with advanced features.",
"brand": "Example Brand",
"sku": "12345",
"offers": {
"@type": "Offer",
"price": "599.99",
"priceCurrency": "USD",
"availability": "InStock"
}

Organization: برای توصیف سازمان‌ها و شرکت‌ها، از جمله نام شرکت، آدرس، شماره تماس و لوگو.

"@context": "http://schema.org",
"@type": "Organization",
"name": "Example Company",
"description": "A leading technology company.",
"url": "http://www.example.com",
"logo": "http://www.example.com/logo.png",
"contactPoint": {
"@type": "ContactPoint",
"telephone": "+1-123-456-7890",
"contactType": "customer service"
}

Event: برای توصیف رویدادها و فعالیت‌ها، از جمله تاریخ، زمان، مکان و توضیحات.

"@context": "http://schema.org",
"@type": "Event",
"name": "Tech Conference 2023",
"startDate": "2023-10-15T09:00",
"endDate": "2023-10-17T18:00",
"location": {
"@type": "Place",
"name": "Convention Center",
"address": "123 Main St, City, Country"
},
"description": "A three-day technology conference."

Review: برای توصیف نقدها و بررسی‌های مشتریان، از جمله امتیاز، متن نقد و اطلاعات نویسنده.

{
"@context": "http://schema.org",
"@type": "Review",
"itemReviewed": {
"@type": "Product",
"name": "Laptop",
"url": "http://www.example.com/laptop123"
},
"author": {
"@type": "Person",
"name": "Alice Smith"
},
"reviewRating": {
"@type": "Rating",
"ratingValue": "4.5",
"bestRating": "5",
"worstRating": "1"
},
"reviewBody": "This laptop is fast and reliable. Highly recommended!"
}

Recipe: برای توصیف دستورالعمل‌های آشپزی، از جمله مواد لازم، مراحل تهیه و زمان پخت.

"@context": "http://schema.org",
"@type": "Recipe",
"name": "Spaghetti Carbonara",
"author": {
"@type": "Person",
"name": "Chef John"
},
"image": "http://www.example.com/spaghetti.jpg",
"recipeIngredient": [
"200g spaghetti",
"2 eggs",
"100g grated Parmesan cheese",
"100g pancetta",
"Salt and pepper to taste"
],
"recipeInstructions": "..."

Article: برای توصیف مقالات و مطالب وب، از جمله عنوان، توضیحات و نویسنده.

"@context": "http://schema.org",
"@type": "Article",
"headline": "How to Create Schema Markup for Your Website",
"datePublished": "2023-10-01",
"dateModified": "2023-10-02",
"author": {
"@type": "Person",
"name": "Jane Doe"
},
"mainEntityOfPage": {
"@type": "WebPage",
"@id": "http://www.example.com/article123"
}

FAQPage: برای توصیف صفحات پرسش‌های متداول، از جمله سوالات و پاسخ‌ها.

"@context": "http://schema.org",
"@type": "FAQPage",
"mainEntity": [
{
"@type": "Question",
"name": "What is Schema Markup?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Schema Markup is a structured data format used to provide information about the content on web pages."
}
},
{
"@type": "Question",
"name": "Why is Schema Markup important?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Schema Markup helps search engines understand and display content more effectively in search results."
}
}
]

با استفاده از اسکیما، موتورهای جستجو می‌توانند محتوای وب را به دقت ترجمه و تفسیر کنند و از اطلاعات بهتری برای نمایش در نتایج جستجو استفاده کنند. این کار به بهبود SEO (بهینه‌سازی موتورهای جستجو) کمک می‌کند و می‌تواند به افزایش ترافیک وب‌سایت شما منجر شود. برای کسب اطلاعات و مثال های بیشتر و ایجاد اسکیما می توانید به سایت schema.org مراجعه نمایید.

با من در میان بگذارید که آیا صفحه­ای بدون متاتگ­ها می­تواند وجود داشته باشد؟