モバイル フレンドリー テストツール
モバイル フレンドリーなウェブサイトは、オンラインでの存在感を高めるうえで欠かせないものです。現在では、多くの国でスマートフォンのトラフィックがパソコンのトラフィックを上回っています。お持ちのウェブサイトがまだモバイル フレンドリーでなければ、ぜひモバイル フレンドリー サイトにしましょう。Search Console のモバイル フレンドリー テストツールでは、サイト上のページがモバイル フレンドリーかどうかをすぐにテストできます。
ツールの使用
モバイル フレンドリー テストツールの使い方は簡単で、テストするウェブページの URL 全体を入力するだけです。ページで実装されたすべてのリダイレクトについて、リダイレクト先へのアクセスがテストされます。通常、テストは 1 分もかからずに実施できます。
テスト結果には、ページがモバイル端末でどのように表示されるかを確認できるスクリーンショットが含まれます。また、モバイル ユーザビリティの問題が検出された場合には、そうした問題の一覧も示されます。モバイル ユーザビリティの問題とは、モバイル端末の小さな画面でページにアクセスしたユーザーに影響を与える問題です。小さなフォントサイズ（小さな画面では読みにくい）や Flash（ほとんどのモバイル端末でサポートされていない）の使用などが含まれています。
ページにアクセスできない場合
なんらかの理由によりツールがページにアクセスできない場合は、その問題を説明するエラーが表示されます。アクセスの問題には、たとえば、ネットワーク接続に問題がある場合や、サイトがダウンしている場合などがあります。
ページの一部を読み込めない場合（読み込めないリソース）
ページで使用されているリソースの一部をテストツールが読み込めない場合、警告が表示されます。リソースとは、ページに追加される画像、CSS、スクリプト ファイルなどの外部要素のことです。こうした状況は、次のような理由で発生します。
- 妥当な時間内にリソースを読み込めなかったため。この場合は、再度テストしてみます。それでも問題が解決しない場合は、リソースを他の場所でホストするか、ホストからの応答がない原因を見つけて解決します。
- 指定された場所にリソースが存在しないため（404 エラー）。リソースの URL を修正します。
- ログインしていないとアクセスできないリソースであるため。テストツールは、匿名ユーザーとしてページにアクセスします。すべてのリソースを匿名ユーザーがアクセスできるようにします。
- robots.txt ファイルにより、そのリソースで Googlebot をブロックしているため。リソースが重要であり（下記を参照）、自分のサイト上にある場合、Googlebot のブロックをそのリソースで解除することをおすすめします。リソースが別のサイトにある場合、そのサイトのウェブマスターに連絡して、ブロックの解除を依頼することをおすすめします。
重要なリソースのブロックを解除する
ブロックされたリソースが重要な場合、Google がそのページを理解するのに大きな影響を与える可能性があります。たとえば、大きな画像がブロックされると、モバイル フレンドリーではないページがモバイル フレンドリー ページとみなされることがあります。また、CSS ファイルがブロックされると、不適切なフォント スタイル（小さすぎて端末で読めないフォントなど）が適用されることがあります。これは、モバイル ユーザビリティのスコアだけでなく、Google がページをクロールできるかどうかにも影響を及ぼします。重要なリソースで robots.txt による Googlebot のブロックを解除し、通常はアクセスできるようにしてください。
一貫性のないテスト結果や、ページの読み込みに関する問題
読み込めないリソースや、ページの読み込みに関する他の問題がある場合は、テストを実行するたびに若干異なる結果が表示されることがあります。これは、各テストの実行時に読み込まれるリソースが、異なる場合があるためです。何も変更していないにもかかわらず、テストを実行するたびにページの表示が異なる場合は、「ページの読み込みに関する問題」の警告を確認してください。警告が表示されている場合は、クリックして詳細情報を表示し、ページが一貫して正しく表示されない原因として何が考えられるかを確認してください。
モバイル ユーザビリティに関するエラー
モバイル フレンドリー テストツールでは、次のようなユーザビリティ エラーが検出されることがあります。
Flash が使用されています
ほとんどのモバイル用ブラウザでは Flash コンテンツが表示されません。したがって、モバイル ユーザーは、コンテンツ、アニメーション、またはナビゲーションを表示するために Flash に依存しているページを使用することはできません。最新のウェブ技術を利用して外観やページのアニメーションをデザインすることをおすすめします。詳しくは、ウェブの基礎ガイドのルック アンド フィールの説明をご覧ください。
ビューポートが設定されていません
サイトにアクセスするユーザーは、大きなデスクトップ モニター、またはタブレットや小型のスマートフォンなど、画面サイズの異なるさまざまな端末を使用しています。そのため、ページでは meta viewport タグを使用してビューポートを指定してください。このタグは、端末に合わせてページのサイズとスケーリングを調整する方法をブラウザに指示します。詳しくは、レスポンシブ ウェブデザインの基礎をご覧ください。
固定幅のビューポート
このレポートには、ビューポートが固定幅に設定されているページが示されます。ウェブ デベロッパーによっては、レスポンシブ以外のページを一般的な携帯端末の画面サイズに合わせて調整するために、ビューポートを固定のピクセルサイズに定義している場合があります。このエラーを修正するには、サイトのページにレスポンシブ デザインを導入し、デバイスの幅とスケーリングに合わせてビューポートを設定します。詳しくは、ウェブの基礎ガイドのビューポートを正しく設定する方法をご覧ください。
コンテンツのサイズがビューポートに対応していません
このレポートには、ページ上の語句や画像を表示するために水平スクロールを必要とするページが示されます。このエラーは、ページの CSS 宣言で絶対値を使用している場合や、ページの画像が特定のブラウザ幅（980px など）で最適に表示されるように設計されている場合に発生します。このエラーを修正するには、ページの CSS 要素に対して相対的な幅と位置の値を使用し、画像も同様にスケーリングできるようにします。詳しくは、コンテンツのサイズをビューポートに合わせるをご覧ください。
フォントサイズが小です
このレポートには、フォントサイズが小さすぎて読みにくく、読むためにはモバイル ユーザーがピンチ操作をして拡大する必要があるページが示されます。ウェブページのビューポートを指定した後にフォントサイズを設定して、ビューポート内で適切にスケーリングします。フォントサイズに関するベストプラクティスについて詳しくは、読みやすいフォントサイズを使用するをご覧ください。
タップ要素同士が近すぎます
このレポートには、ボタンやナビゲーション リンクなどのタップ要素同士が近すぎるために、モバイル ユーザーが隣接する要素をタップせずに指を使って目的の要素をタップすることが容易にできないサイトの URL が示されます。これらのエラーを修正するには、ボタンやナビゲーション リンクのサイズやスペースをモバイル ユーザーに適するように正しく設定します。詳しくは、タップ ターゲットのサイズを適切に調整するをご覧ください。
次のステップ
ページのテストが済んだら、モバイル ユーザビリティ レポートにアクセスして、サイト全体でどのようなモバイル ユーザビリティの問題が検出されたかを確認してください。モバイル ユーザビリティ レポートを利用するには、Search Console でサイトの所有権を確認する必要があります。
サイトのページをモバイル フレンドリーにする
サイトをモバイル フレンドリーにする方法については、次のようなリソースをご用意しています。
- CMS ウェブサイトをモバイル フレンドリーにする方法をご覧ください（WordPress、Joomla! などの CMS サービスにホストされているページの場合）。
- デベロッパーと協力してサイトを修正する方法をご覧ください。
- モバイル フレンドリーなページの設計方法をご覧ください。