はじめに
本書の目的
この文書は、Webサイトの言語設定を確実に確認するための具体的な方法をわかりやすく解説します。開発者やサイト運営者、ローカライズ担当者が実務で使える手順を中心にまとめました。
対象読者
HTMLやブラウザの基本操作が分かる方を想定しています。専門知識が少なくても実行できるよう、手順と画面例の読み方を丁寧に説明します。
本書で扱う内容の概要
HTMLのlang属性確認、検索エンジンの言語フィルタ、ブラウザ設定の確認・変更、Wappalyzerなどの技術調査ツール、そしてGoogle翻訳を使った多言語確認まで、複数のアプローチを紹介します。
読み方のポイント
まず簡単な手順から試し、必要に応じて高度な方法に進んでください。各章は独立して使えますので、知りたい項目だけ参照しても問題ありません。
ソースコードから言語コードを確認する方法
概要
Webサイトの言語はHTMLに明示されることが多く、最も直接的に確認できます。代表的な記述はのような形式です。正しく設定されていると検索や音声読み上げ、表示で有利になります。
手順(簡単3ステップ)
- ブラウザで対象ページを開く。
- 右クリック→「ページのソースを表示」またはCtrl+Uでソースを表示する。開発者ツール(F12)でElementsタブを見る方法もあります。
- 検索(Ctrl+F)で “<html lang=””” を探すか、”hreflang”や”meta”も確認します。
具体例
・日本語:
・英語:
・中国語(簡体):
よく見る記述
- html要素のlang属性
- 個別要素のlang(pやdiv)
- のような多言語指示
注意点
言語コードがない、または誤っていると自動翻訳やアクセシビリティで問題が出ます。表示言語と実際の言語が一致するかも確認してください。
Google検索の言語フィルタを使用する方法
概要
Google検索で特定の言語だけを表示したいときは、言語フィルタを使うと便利です。パソコンの検索設定や検索結果画面のツールから対象言語を指定できます。フィルタは完全ではないため、補足の方法も併せてご紹介します。
パソコンでの手順(簡単)
- Googleにアクセスし、画面右下または歯車アイコンから「設定」→「検索設定」を開きます。
- 「検索結果の表示言語」や「検索結果の言語フィルタ」から表示したい言語を選びます。
- 設定を保存すると、その言語優先で結果が表示されます。
- 検索結果画面では「ツール」→「すべての言語」や言語名を選んで絞り込めます。
どのような要因が影響するか
- ユーザーのGoogle言語設定やブラウザの言語設定
- 検索時の位置情報(国や地域)
- サイト側の言語指定(例:ページ内の言語タグやhreflang)
- ページ本文の言語
これらが組み合わさって表示言語が決まります。
注意点と対処法
- フィルタを設定しても完全に除外できない場合があります。その際は検索語を目的言語に直すか、site:で対象ドメインを指定すると効果的です。
- 設定が反映されないと感じたら、ログアウトして試す、ブラウザのキャッシュを削除する、別のGoogleドメイン(例:google.co.jp)を使うと改善することがあります。
この方法を使えば、目的の言語の情報を効率よく集められます。必要に応じて他の確認手段と組み合わせてください。
ブラウザの言語設定を確認・変更する方法
各Webサイトは訪問者のブラウザ言語設定を参照して表示言語を決めます。ここではGoogle Chrome、Mozilla Firefox、Microsoft Edgeでの確認と変更手順をやさしく解説します。設定後はブラウザを再起動して変更を反映させてください。
Google Chrome
- 右上の三点メニュー→「設定」を開きます。
- 左側の「言語」または「詳細設定」→「言語」を選びます。
- 「言語を追加」で希望の言語を追加し、右の三点メニューで「この言語でChromeを表示」または上へ移動して優先順位を上げます。
- ブラウザを再起動して反映させます。
Mozilla Firefox
- 右上の三本線メニュー→「設定」を開きます。
- 「一般」→「言語と外観」欄の「言語」をクリックします。
- 言語を追加して優先順位を設定します。変更後はページを再読み込みするか、再起動すると確実です。
Microsoft Edge
- 右上の三点メニュー→「設定」→「言語」を開きます。
- 「言語の追加」で希望の言語を追加し、右の三点から「Microsoft Edgeをこの言語で表示」を選びます。
- 再起動して設定を反映させます。
確認のポイント
- ブラウザの言語順でサイトが表示言語を決めます。
- サイト側に独自の言語切替がある場合は、そちらが優先されます。
- 表示が変わらないときはキャッシュをクリアして再読み込みしてください。
Wappalyzerを使用した技術スタック調査
概要
Wappalyzerはブラウザ拡張で、訪問先サイトが使っているCMS、フレームワーク、CDN、言語関連ライブラリなどを一覧表示します。言語設定の手がかりを短時間で見つけられます。
インストールと基本操作
- ChromeやFirefoxの拡張機能ストアで「Wappalyzer」を検索し追加します。2. 調べたいページを開いて拡張アイコンをクリックします。3. 検出された技術スタックがドロップダウンで表示されます。
見るべきポイント(具体例付き)
- CMS(例: WordPress、Drupal):CMSが分かれば管理画面で言語設定を探せます。
- フレームワーク(例: Next.js、Nuxt.js):i18n機能や静的生成の有無が分かります。
- ライブラリ(例: react-intl、vue-i18n):多言語対応の実装が分かります。
- CDNやプロキシ(例: Cloudflare):キャッシュやヘッダで言語制御していることがあります。
注意点
Wappalyzerは検出情報の手がかりを与えますが、言語そのものを確定するツールではありません。動的に生成される要素やカスタム実装は見逃すことがあります。しかし、他の確認方法(ソース確認や翻訳ツール)と合わせると効率的です。
Google翻訳を利用した多言語確認
概要
Google翻訳のウェブサイト翻訳機能は、URLを入力するだけでそのページを別言語で表示できます。費用はかからず、さっと多言語表示を確認したいときに便利です。
手順(簡単)
- translate.google.com を開きます。
- 左側の入力欄に確認したいページのURLを貼り付けます。言語は「自動検出」のままで問題ありません。
- 右側で表示したい言語(例:English)を選びます。
- 右側に表示された翻訳後のリンク(青いURL)をクリックすると、翻訳されたページが開きます。
確認ポイント
- 表示されたテキストが適切に翻訳されているかを確認します。見出しやメニュー、ボタンの文言をチェックしてください。
- レイアウト崩れや文字化けがないか確認します。翻訳プロキシ経由のため、元ページと表示が異なることがあります。
- 動的に生成される部分(JavaScriptで読み込むコンテンツ)は翻訳されない場合があります。
利用上の利点と注意点
- 利点:無料で手早く複数言語の見た目を確認できます。言語ごとの文言差を直感的に把握できます。
- 注意点:サーバー側の言語判定(Accept-LanguageやIPベースの配信)やhreflangの挙動は検証できません。また、翻訳プロキシによって画像リンクや相対パスが変わることがあるため、本番の挙動と差が出る可能性があります。
実務的な使い方のコツ
- 原文と翻訳版をタブで並べて比較すると変化が分かりやすいです。
- 動的要素の確認が必要な場合は、別途開発者ツールや実機での確認を行ってください。
この方法は手軽な初期チェックに最適です。より厳密な検証は他の方法と組み合わせて行ってください。
多言語対応サイトの言語設定確認時の注意点
なぜ注意が必要か
複数言語を含むページでは、検索エンジンがページの主要言語を正確に判断できないことがあります。表示される言語とソースの言語情報が異なると、誤ったユーザーに表示される可能性があります。外から見て分かりにくい場合は、必ずソースコードで検証してください。
チェックする箇所(具体例付き)
- HTMLのlang属性:のようにページ全体の言語を指定します。断片に別言語がある場合はHelloのように明示します。
- rel=”alternate” hreflang:言語・地域ターゲティング用です。例:。各言語版を全て列挙し、自分自身への参照も忘れないでください。
- HTTPヘッダーのContent-Language:サーバーレベルで言語を送る場合に確認します。
運営側の注意点
- URL構造やサブドメインで言語を分け、ページごとに一貫した言語シグナルを出します。検索エンジンへの明示が最も重要です。
- 自動翻訳だけを掲載すると品質シグナルが低く評価されます。機械翻訳を使う場合は編集を加えてください。
実務上のポイント
- JavaScriptで言語を切り替えるサイトは、サーバー側やソースに言語情報を残してください。クローラーはJavaScriptを完全に実行しない場合があります。
- 右から左書字の言語ではdir=”rtl”を忘れないでください。
疑わしい場合は、まずソースコードのlang/hreflangを確認するのが確実です。
まとめ
ここまでで紹介した方法を簡潔に振り返ります。
-
最も確実な方法はソースコードのlang属性やhreflangを確認することです。HTMLのlangやリンク要素、サーバーのContent-Languageヘッダーを見ると正確な意図が分かります。
-
手早く調べたいときは、Google検索の言語フィルタやブラウザの言語設定を利用してください。表示結果や自分の環境での見え方を素早く確認できます。
-
Wappalyzerなどのツールは、サイトの技術スタックや多言語対応の仕組みを把握するのに便利です。Google翻訳は内容確認や簡易チェックに適しています。
-
注意点としては、JavaScriptで動的に言語を切り替えるサイトや、ページ毎に言語が混在するケースです。見た目だけで判断せず、ソースやヘッダーを必ず確認してください。
用途に応じて方法を使い分けると効率よく調査できます。ご自身の目的(正確な判定・表示確認・調査の速さ)を最初に決めると良いです。












