正規URLとrobots meta
metaタグでクロールを制御し、重複コンテンツを避けます
「正規URLとrobots meta」はCoddyKit上の無料HTML Academyレッスンです。 これはレッスン3/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはHTML Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 HTML Academyコースには全4レッスンが含まれています。
重複コンテンツの問題
検索エンジンは、ページを複数のURLで見つけることがあります。
http://example.com/pagehttps://example.com/pagehttps://www.example.com/pagehttps://example.com/page/(末尾のスラッシュ)https://example.com/page?utm_source=newsletter
Googleはインデックスに登録するURLを決める必要があり、重複コンテンツとしてペナルティを受ける可能性もあります。
canonical link タグ
rel="canonical" を使って、優先するURLを検索エンジンに伝えます。
<head>
<!-- This is the canonical URL for this content: -->
<link rel="canonical" href="https://example.com/blog/html5-guide">
</head>
<!-- No matter which URL the page is accessed from,
this tag signals to Google which URL to index -->
<!-- Link equity is consolidated at the canonical URL -->canonical URL のルール
canonical URL のベストプラクティス:
- 完全な絶対URL(プロトコルを含む)を使用します
- サイトが対応している場合はHTTPSを使用します
- 一貫性を保ちます。末尾のスラッシュを付けるかどうかを統一します
- 各ページにcanonicalタグを設定します。URL自身を指定する場合も同様です
<link rel="canonical" href="https://example.com/blog/html5-guide">
<!-- NOT: -->
<!-- <link rel="canonical" href="/blog/html5-guide"> relative = bad -->
<!-- <link rel="canonical" href="http://..."> HTTP on HTTPS site = bad -->ページネーションと canonical
ページ分割されたコンテンツでは、canonical は最初のページまたはそのページ自身を指す場合があります。
<!-- Page 2 of a blog listing: -->
<link rel="canonical" href="https://example.com/blog?page=2">
<!-- Or: consolidate all pages to the first -->
<link rel="canonical" href="https://example.com/blog">
<!-- Also useful: rel="prev" and rel="next" for paginated series -->meta robots の値
ページごとに検索エンジンの動作を制御します。
<meta name="robots" content="index, follow">
<!-- Default: include in index and follow links -->
<meta name="robots" content="noindex">
<!-- Don't index this page -->
<meta name="robots" content="nofollow">
<!-- Don't follow links on this page -->
<meta name="robots" content="noindex, nofollow">
<!-- Don't index AND don't follow -->
<meta name="robots" content="noarchive">
<!-- Don't show cached version in search results -->Googlebot 固有のディレクティブ
特定のディレクティブで、特定のクローラーを対象にします。
<meta name="googlebot" content="noindex">
<!-- Only affects Google's crawler -->
<meta name="bingbot" content="noindex">
<!-- Only affects Bing's crawler -->
<!-- Other values: -->
<meta name="robots" content="max-snippet:50">
<!-- Limit snippet length in search results to 50 characters -->
<meta name="robots" content="max-image-preview:large">
<!-- Allow full-size image previews in Google results -->X-Robots-Tag HTTPヘッダー
canonical と robots は、HTTPヘッダー(サーバーレベル)で設定することもできます。
# Apache .htaccess:
Header add Link "<https://example.com/page>; rel=canonical"
Header add X-Robots-Tag "noindex"
# This is more powerful because it applies to non-HTML files too
# (PDFs, images, etc.) which can't have meta tagsrobots.txt と meta robots
クローラーを制御する2つのツールです。それぞれ目的が異なります。
- robots.txt — クローラーがアクセスできるページを制御します(アクセス制御)
- meta robots — クローラーがアクセスしたページに対して行う処理を制御します(インデックス登録の制御)
robots.txt でアクセスを拒否したページでも、別の場所からリンクされているとインデックスに登録されることがあります。noindex を指定したページは、確実にインデックスに登録されません。
サイトマップと canonical
サイトマップにはcanonical URLだけを記載します。
<!-- sitemap.xml should list canonical URLs only: -->
<!-- https://example.com/blog/html5-guide (canonical) -->
<!-- NOT: https://www.example.com/blog/html5-guide -->
<!-- NOT: https://example.com/blog/html5-guide/ (trailing slash variant) -->自己参照 canonical
メインページを含むすべてのページに、自己参照する canonical を設定します。
<!-- On https://example.com/about (the canonical URL itself): -->
<link rel="canonical" href="https://example.com/about">
<!-- This confirms: this IS the canonical URL -->
<!-- Prevents issues if the page is embedded in an iframe or scraped -->Eコマースにおける canonical
バリエーションのある商品に対する、Eコマースの canonical のパターン:
<!-- Product page with color filter: -->
<!-- URL: /products/widget?color=blue -->
<link rel="canonical" href="https://example.com/products/widget">
<!-- All color variants point to the main product page -->
<!-- Avoids duplicate content penalty for parameter variants -->クイックチェック
canonical link タグの href 値には何を指定すべきでしょうか。
復習:canonical と robots
canonical と robots の要点:
<link rel="canonical" href="full-url">— 優先するURLを宣言します- canonical には絶対URLを使用し、常にHTTPSにします
meta robots noindex— 検索インデックスから除外しますmeta robots nofollow— リンクをたどらないようにします- robots.txt = アクセス制御、meta robots = インデックス登録の制御
よくある質問
「正規URLとrobots meta」レッスンは無料ですか?
はい。「正規URLとrobots meta」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、HTML Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 HTML Academyコースには全4レッスンが含まれています。
「正規URLとrobots meta」で何を学びますか?
metaタグでクロールを制御し、重複コンテンツを避けます ブラウザで直接実行するハンズオンコードでHTML Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
HTML Academyを始めるのに経験は必要ですか?
事前経験は必要ありません。CoddyKitのHTML Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン3/4です。
「正規URLとrobots meta」レッスンにはどのくらい時間がかかりますか?
ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このHTML Academyレッスンでコードを書いて実行できますか?
はい。すべてのHTML Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。