SEO优化方法百百种,今天再给你一个偷吃步的资讯!快来看看!

关于SEO优化~这篇,不藏私地直接分享Schema Markup范例给你照抄!让你不用像只无头苍蝇!

之前提过：前端工程师善用 Schema 语意标记，能帮忙 Google 搜寻引擎爬虫更快速地理解网页的内容，以提升网页的 SEO。这一篇，我们就来列举一些 Schema语意标记的范例，帮助所有 SEO优化师们、或是需要做SEO优化的前端工程师们更快上手！

以下的 Schema 语意标记，虽是取自某些特定网站的范例，但是同样的方法，也适用于各种网站：

适用于介绍公司/组织的 Schema Markup

这类的 Schema Markup 除了可以帮助 Google 爬虫可以透过你的网站而抓取贵公司/组织的资讯外，还可以增加在 Google 搜寻结果页面显示贵公司的「Google知识图谱 (Knowledge Graph)」的机率喔！

什么是知识图谱?

如下图的例子所示，当我们在 Google 输入关键字「Adobe」时， Google 右侧会出现简介，包含「Adobe」的标志、URL、客服专线、总部位置与社群网站的连结。
这是因为 Adobe 的官网有做公司/组织类的结构化资料标记，有助于 Google 搜寻引擎抓取，而在使用者在搜寻相关关键字时，资讯会在搜寻结果页右方显示其资讯卡。

当我们在搜寻引擎输入关键字后，有时知识图谱会出现在搜寻结果页的右方，非常醒目。

以下为此范例的业主「Adobe」在网页的 HTML 原始码中，所置入的原始码：

<script type="application/ld+json">
{
    <!--↓↓↓宣告要使用 schema.org 的 Organization(公司/组织)类来呈现资料↓↓↓-->
    "@context": "https://schema.org",
    "@type": "Organization",
    <!--↓↓↓标记公司网址↓↓↓-->
    "url": "https://www.adobe.com",
    <!--↓↓↓标记公司名称↓↓↓-->
    "name": "Adobe",
    <!--↓↓↓标记公司登记名称↓↓↓-->
    "legalName": "Adobe Systems Incorporated",
    <!--↓↓↓标记公司其他的名称↓↓↓-->
    "alternateName": "Adobe.com",
    <!--↓↓↓标记公司的LOGO↓↓↓-->
    "logo": "https://www.adobe.com/favicon.ico",
    <!--↓↓↓标记公司的其他官方网站或社群，如FB、推特、IG、linkdin等等↓↓↓-->
    "sameAs": [
        "https://www.facebook.com/Adobe/",
"https://twitter.com/Adobe/",
"https://www.linkedin.com/company/adobe/",
"https://www.instagram.com/adobe/"
    ],
    <!--↓↓↓标记公司的联络资讯，如电话、连络类型等等↓↓↓-->
    "contactPoint": [
        {
            "@type": "ContactPoint",
             <!--↓↓↓标记公司的联络电话↓↓↓-->
            "telephone": "+1-800-833-6687",
            <!--↓↓↓标记公司的联络类型为「客户服务」↓↓↓-->
            "contactType": "customer service",
            <!--↓↓↓标记公司的联络选项为「免付费」↓↓↓-->
            "contactOption": "TollFree",
            <!--↓↓↓标记公司的联络地区为「美国」↓↓↓-->
            "areaServed": "US",
            <!--↓↓↓标记公司的服务语言为「美式英文」↓↓↓-->
            "availableLanguage": "US"
        }
    ]
}
</script>

网站连结专用之 Schema Markup

如果你的网站中有「站内搜寻」的功能，你可以针对它做标记，使搜寻框出现在搜寻结果页中，如下图所示：

以下为此范例的业主「Apple」在网页的 HTML 原始码中，所置入的原始码：

<script type="application/ld+json">
{
    <!--↓↓↓宣告要使用 schema.org 的 WebSite (网站)类来呈现资料↓↓↓-->
    "@context": "https://schema.org",
    "@type": "WebSite",
    <!--↓↓↓蓝色字体可替换为贵公司网址↓↓↓-->
    "url": "https://www.apple.com",
    <!--↓↓↓蓝色字体可替换为贵公司名称↓↓↓-->
    "name": "Apple",
    "potentialAction": {
			"@type": "SearchAction", 			
			<!--↓↓↓蓝色字体部分为公司站内搜寻页面，而{search_term_string}的意思为搜寻字串↓↓↓-->
			"target": "https://www.apple.com/us/search?q={search_term_string}",
			"query-input": "required name=search_term_string" } 	
}
</script>

若贵公司的网站没有站内搜寻，则可以以 Google 搜寻引擎的方式取代之如下：

<script type="application/ld+json">
{
    <!--↓↓↓宣告要使用 schema.org 的 WebSite (网站)类来呈现资料↓↓↓-->
    "@context": "https://schema.org",
    "@type": "WebSite",
    <!--↓↓↓蓝色字体可替换为贵公司网址↓↓↓-->
    "url": "贵公司的网址",
    <!--↓↓↓蓝色字体可替换为贵公司名称↓↓↓-->
    "name": "贵公司名称",
    "potentialAction": {
			"@type": "SearchAction", 			
			<!--↓↓↓蓝色字体部分为公司站内搜寻页面，而{search_term_string}的意思为搜寻字串↓↓↓-->
			"target": "https://www.google.com/search?q={search_term_string}+site:贵公司的网址",
			"query-input": "required name=search_term_string" } 	
}
</script>