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