<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>ページタイトル - サイト名</title>
<meta name="description" content="ページの説明文（120文字程度）" />
<link rel="canonical" href="https://example.com/page" />
</head>
OGPタグ
<meta property="og:title" content="ページタイトル" />
<meta property="og:description" content="説明文" />
<meta property="og:url" content="https://example.com/page" />
<meta property="og:type" content="article" />
レイアウトコンポーネントで共通化する
---
const { title, description } = Astro.props;
---
<html>
<head>
<title>{title}</title>
<meta name="description" content={description} />
</head>
<body><slot /></body>
</html>
ハマったポイント
description は120〜160文字程度が推奨canonical タグを設定しないと重複コンテンツとみなされることがある
関連記事