ブログでSEO対策に大切なJSON-LD
2021年9月27日
2021年9月27日
目次
JSON-LDとは
イメージとしては、HTMLのマークアップだけでは与えられない情報をJSON-LDを使って付与する。
というイメージかと思います。
これを入れておくことでSEO的に良いとされています。
下記のGoogleで詳しい仕組みが解説されているので、深く知りたい方は下記をみてください。
構造化データの仕組みについて | Google 検索セントラル | Google Developers
JSON-LDの書き方
<script type="application/ld+json">
{
'@context': 'http://schema.org/',
'@type': '####'
}
</script>このように<script type="application/ld+json"></script>で囲って記述していきます。
JSON-LDの確認方法
下記から、URL入力、コード入力の両方で確認できます。
リッチリザルト テスト - Google Search Console
このブログで記述しているJSON-LD
トップページ
{
"@context": "http://schema.org",
"@type": "Organization",
"logo": "https://kame.blog/icon-256x256.png",
"name": "かめ。ブログ",
"url": "https://kame.blog/",
"headline": "かめ。ブログ",
"description": "フロントエンドエンジニアが「Web」「Youtube」「3D」「お金」「お買い物情報」など、興味があることについて深堀っていくブログです。",
"author": {
"@type": "Person",
"name": "かめ"
}
}https://search.google.com/test/rich-results?hl=ja&id=UhNxqB_RhOdGU-swR1lzBg
記事ページ
[
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{
"@type": "ListItem",
"position": 1,
"name": "かめ。ブログ",
"item": "https://kame.blog/"
},
{
"@type": "ListItem",
"position": 2,
"name": "webのこと",
"item": "https://kame.blog/category/web"
},
{
"@type": "ListItem",
"position": 3,
"name": "フロントエンドやデザインを教えるメンター（Menta）はじめました。",
"item": "https://kame.blog/entry/menta"
}
]
},
{
"@context": "http://schema.org",
"@type": "Article",
"name": "フロントエンドやデザインを教えるメンター（Menta）はじめました。 - かめ。ブログ",
"headline": "フロントエンドやデザインを教えるメンター（Menta）はじめました。 - かめ。ブログ",
"datePublished": "2021-09-06T00:00:02.703Z",
"dateModified": "2021-09-21T04:16:16.612Z",
"url": "https://kame.blog/entry/menta",
"mainEntityOfPage": "https://kame.blog/entry/menta",
"image": [
"https://images.microcms-assets.io/assets/8d63ea55db89496cbf00ccb8c6bf8880/77d1b4678ce74e5889c234336b892507/menta.png"
],
"description": "Mentaを使って、Photoshop / Illustrator / Figma / HTML / CSS / Javascript / React / Vue / Nuxt / Next などのweb制作を教え始めました。",
"author": {
"@type": "Person",
"url": "https://kame.blog/profile/",
"name": "かめ"
},
"publisher": {
"@type": "Organization",
"name": "かめ",
"logo": {
"@type": "ImageObject",
"url": "https://kame.blog/image/abubu.png"
}
}
}
]https://search.google.com/test/rich-results?hl=ja&id=nvnH4aOZbiNU_OAJaHdowg
カテゴリー
[
{
"@context": "http://schema.org",
"@type": "Organization",
"logo": "https://kame.blog/icon-256x256.png",
"name": "かめ。ブログ",
"url": "https://kame.blog/",
"headline": "かめ。ブログ",
"description": "フロントエンドエンジニアが「Web」「Youtube」「3D」「お金」「お買い物情報」など、興味があることについて深堀っていくブログです。",
"author": {
"@type": "Person",
"name": "かめ"
}
},
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{
"@type": "ListItem",
"position": 1,
"name": "かめ。ブログ",
"item": "https://kame.blog/"
},
{
"@type": "ListItem",
"position": 2,
"name": "webのこと",
"item": "https://kame.blog/category/web"
}
]
}
]https://search.google.com/test/rich-results?hl=ja&id=FsYifecy4m4Gk7NKLBvH9Q
タグ
[
{
"@context": "http://schema.org",
"@type": "Organization",
"logo": "https://kame.blog/icon-256x256.png",
"name": "かめ。ブログ",
"url": "https://kame.blog/",
"headline": "かめ。ブログ",
"description": "フロントエンドエンジニアが「Web」「Youtube」「3D」「お金」「お買い物情報」など、興味があることについて深堀っていくブログです。",
"author": {
"@type": "Person",
"name": "かめ"
}
},
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{
"@type": "ListItem",
"position": 1,
"name": "かめ。ブログ",
"item": "https://kame.blog/"
},
{
"@type": "ListItem",
"position": 2,
"name": "Next.js",
"item": "https://kame.blog/tag/nextjs"
}
]
}
]https://search.google.com/test/rich-results?hl=ja&id=34ZVEzMCr41cOI06fgR5QQ
自己紹介
[
{
"@context": "http://schema.org",
"@type": "Organization",
"logo": "https://kame.blog/icon-256x256.png",
"name": "かめ。ブログ",
"url": "https://kame.blog/",
"headline": "かめ。ブログ",
"description": "フロントエンドエンジニアが「Web」「Youtube」「3D」「お金」「お買い物情報」など、興味があることについて深堀っていくブログです。",
"author": {
"@type": "Person",
"name": "かめ"
}
},
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{
"@type": "ListItem",
"position": 1,
"name": "かめ。ブログ",
"item": "https://kame.blog/"
},
{
"@type": "ListItem",
"position": 2,
"name": "自己紹介",
"item": "https://kame.blog/profile"
}
]
}
]https://search.google.com/test/rich-results?hl=ja&id=PBnrFNjpEnImFsuF129YZw
