多言語ページの設定
生成された hreflang タグ
📝 設置方法と注意点
コピーしたコードは、今回設定した言語に該当する「すべて」のページの <head>
タグ内に共通して記述してください。(AのページにはAとBへのリンク、BのページにもAとBへのリンクというように、相互にリンクし合う必要があります)
- Googleに正しい言語バージョンを伝える役割
-
hreflang(エイチレフラング)属性を持ったリンクタグをHTMLの<head>内に記述することで、検索エンジンに対して「日本語版はこのURL、英語版はこのURL」とサイトの多言語構造を正確に知らせることができます。
これにより、日本のユーザーがGoogleで検索した際には日本語ページが、アメリカのユーザーが検索した際には英語ページが優先して検索結果に表示されるようになります。 - 「重複コンテンツ」によるペナルティを回避する(最重要)
-
例えば、アメリカ向けの英語ページ(example.com/en-us/)と、イギリス向けの英語ページ(example.com/en-gb/)のように言語が同じで地域のみが違うサイトの場合、Googleは「内容がまるごとコピーされたスパムサイト(重複コンテンツ)」と誤解し、検索順位を大きく下げるペナルティを与えてしまうリスクがあります。
この時hreflang="en-US"とhreflang="en-GB"を正しく設定しておくことで、Googleに対して「これはスパムのコピーではなく、国・地域ごとの正しい別バージョンである」と認識させ、ペナルティを回避することができます。
- どの言語設定にも合致しないユーザーの「着地点」
-
世界中には多数の言語があります。サイトが「日本語」と「英語」しか用意していない場合、例えばフランスからフランス語設定のブラウザでアクセスしてきたユーザーにはどちらを見せるべきでしょうか?
こうした「該当する言語ページが存在しないユーザー」に対して、デフォルトで表示させるフォールバックページを指定するのがhreflang="x-default"です。一般的には、アクセス数が一番多いグローバル言語(英語)のトップページや、ユーザー自身に言語を選択させるポータルサイトのURLを指定します。(※必須ではありませんが、Googleは設定を強く推奨しています)
- 「言語」のみを指定する場合(基本)
-
ターゲットが特定の国ではなく、単に言語である場合は、2文字の言語コード(ISO 639-1)のみを使用します。
例:hreflang="ja"(日本のユーザー全体)、hreflang="en"(世界中の英語ユーザー全体) - 「言語」と「地域」を組み合わせる場合
-
言語だけでなく、特定の「国・地域」までも絞り込む場合に使用します。必ず「言語コード」-「地域コード(国コード)」の順番で、ハイフンで繋ぎます。地域コード(ISO 3166-1
alpha-2形式)単独での指定はできません。
例:hreflang="en-US"(アメリカ向けの英語)、hreflang="en-GB"(イギリス向けの英語)、hreflang="zh-TW"(台湾向けの繁体字中国語)
- CSS Flexbox/Grid レイアウトジェネレーター
- HTTPヘッダー確認
- 最適なECプラットフォーム診断ツール|Shopify・makeshop・EC-CUBE・モール型
- Markdown ⇔ HTML 相互変換ツール|リアルタイムプレビュー付き
- 最適なCMS診断ツール|WordPress・MovableType・ノーコード・ヘッドレスCMS等
- モダンUI CSSジェネレーター|グラスモーフィズム対応
- ホームページ制作/サイトリニューアル費用相場概算シミュレーション
- CSSアニメーションジェネレーター|@keyframes コード出力
- 現在のOS・ブラウザ・IP・画面解像度を一括取得|クライアント環境情報チェッカー
- JSON整形・バリデーター|ツリービュー&YAML変換
- Cron式ジェネレーター&実行スケジュール確認ツール|日本語翻訳・作成
- Webフォントプレビューア|Google Fonts日本語・英語フォント比較
- 構造化データ(JSON-LD)作成ジェネレーター【FAQ・パンくずリスト対応】
- CSSグラデーション&背景パターンジェネレーター|コード出力&プレビュー
- レスポンシブプレビューアー|複数デバイス幅を同時プレビュー
- SEO対策
- ネットワーク
- セキュリティ
- パスワード自動生成(ランダム作成)
- プライバシーポリシー&利用規約ジェネレーター|改正個人情報保護法対応の雛形を無料で自動生成
- WCAG対応 カラーコントラストチェッカー|文字色と背景色の比率計算
- セキュリティヘッダーチェッカー – A〜Fスコア+設定例付き
- パスワード強度チェッカー&解読時間シミュレーター|安全性を即診断
- PDFパスワード設定・解除ツール|サーバー送信なしで安全・登録不要
- パスワード付きZIP 作成ツール|Mac・Windows対応(無料・登録不要)
- 動画・音声ファイルサイズ計算ツール|ビットレートから即算出
- Basic認証作成(ベーシックにんしょう)|.htaccess&.htpasswd生成
- 画像処理・テキスト解析
- アスペクト比・画面比率の自動計算ツール|ピクセルサイズを算出
- 文章校正・校正チェッカー|サーバー送信なし・無制限・登録不要
- テキスト差分チェッカー|2つの文章・文字の比較ツール
- 正規表現チェッカー&テスター|電話番号・郵便番号|日本語スニペット・置換対応
- Base64 エンコード&デコード|画像・テキストの双方向変換ツール
- 読む時間・スピーチ所要時間 計算機 プロンプター|文字数から話す時間を算出
- Macの濁点分離を即修復!Unicode正規化ツール(NFC変換)
- 文末重複&漢字比率チェッカー|ライター向け文章校正ツール
- SVG波線&ブロブ(不定形)ジェネレーター|CSSコードも自動生成
- ファビコン作成ツール|favicon変換ジェネレーター
- アプリ不要|インスタ画像サイズ変換(9:16対応)|余白・背景ぼかし
- PDFまとめツール| 結合・分割・抽出|サーバー送信なし
- 全角半角変換|ひらがな・カタカナ/半角カナも一括整形(差分表示)
- ExcelでCSVが文字化けする時の対策|UTF-8 BOM付与・削除&改行変換
- URL解析ツール|クエリ分解・編集+UTM生成(エンコード/デコード対応)
- ダミーテキスト自動生成ツール|Lorem ipsum・日本語対応
- ダミー画像ジェネレーター|プレースホルダー画像作成
- 画像カラーピッカー|写真から色コード抽出・パレット自動生成
- 画像圧縮&WebP一括変換ツール(登録不要・無制限・アップロード不要)
- URL・WifiのQRコード作成・生成・変換ツール(無料・登録不要)
- 無料・会員登録不要の履歴書・職務経歴書PDF作成ツール|スマホ対応
- 文字数カウント・単語数カウント・テキスト解析
- テキスト読み上げ・音声読み上げ(テキストリーダー)|TTS無料ツール(無制限・登録不要)
- SNS・エンタメ
- トーナメント表作成ツール|対戦表&リーグ表を自動生成・自動保存
- 無料ビンゴマシーン|音声読み上げ・カード印刷対応|アプリ不要
- インスタ画像分割ツール|9分割・3分割のプロフィールグリッド投稿に
- ライブ参戦用 うちわ文字&応援ボードメーカー|アプリ不要で即作成
- SNS・EC向け画像リサイズツール|Instagram・Amazon・楽天の推奨サイズに一括変換
- OGP・X(Twitter)カード確認シミュレーター&タグ生成ツール
- アプリ不要!ルーレットメーカー|重み付け・演出付きカスタムルーレット作成
- アプリ不要!BPM測定ツール|タップでテンポ計測・ディレイ計算・メトロノーム
- チーム分けジェネレーター|スキル均等化・制約付きランダムグループ分け