Seo-mobile-seo-techniques

提供:Dev Guides
移動先:案内検索

モバイルSEOテクニック

最近では、数百万のユーザーがAndroid、iOS、またはWindowsで実行されているスマートフォンを使用してWebにアクセスしています。 したがって、ウェブサイトがこの変化する環境に適応し、より多くの視聴者を引き付けるためにウェブサイトのデザインを適切に変更することが不可欠になっています。

サイトのデスクトップバージョンは、モバイルデバイスで表示および使用するのが難しい場合があります。 モバイルフレンドリーではないバージョンでは、ユーザーがコンテンツを読むためにピンチまたはズームする必要があります。 ユーザーはこれをイライラさせ、サイトを放棄する可能性があります。 対照的に、モバイル対応バージョンは読みやすく、すぐに使用できます。

最近のGoogleの更新により、モバイル検索エンジンで効果を発揮するには、ウェブサイトをモバイルフレンドリーにする必要があります。 モバイルフレンドリーではないWebサイトは、通常の検索エンジンにも影響を与えないことに注意してください。

この章では、モバイルデバイスからWebサイトにアクセスする訪問者に最適なエクスペリエンスを提供するために、Webサイトをモバイルフレンドリーにする方法について説明します。

モバイルSEOとは何ですか?

モバイル検索エンジン最適化とは、帯域幅が狭いさまざまな画面サイズのモバイルデバイスでの表示に適したWebサイトを設計するプロセスです。 デスクトップWebサイトに適用されるすべてのSEOルールに従うこととは別に、モバイルデバイス用のWebサイトを設計する際にはさらに注意が必要です。 それは次の属性を持っている場合、ウェブサイトはモバイルフレンドリーです-

  • 優れたモバイルWebサイトのレスポンシブデザインは、デスクトップとモバイルデバイスの両方で優れたパフォーマンスを発揮します。 ウェブサイトのメンテナンスを削減するだけでなく、検索エンジンに対してコンテンツの一貫性を保ちます。
  • 優れたモバイルWebサイトのコンテンツは、画面をズームすることなくモバイルデバイスで簡単に読むことができます。 適切なフォント、色、およびレイアウトがあります。
  • 小さな画面で優れたモバイルWebサイトを簡単に移動できます。 指を使用して簡単に操作できるリンクとボタンを提供します。
  • 優れたモバイルWebサイトは軽量であるため、モバイルネットワークにロードするのに必要な帯域幅と時間が少なくなります。
  • モバイルWebサイトのホームページは、ユーザーを探しているコンテンツに結び付ける上で最も重要な役割を果たします。 したがって、優れたモバイルWebサイトでは、最も重要なリンクがホームページに表示され、十分な可視性が得られるようにします。

ウェブサイトのランキングは、それがユーザーフレンドリーであるかどうかに大きく依存します。 以下に示すガイドラインに従って、モバイル向けの優れたWebサイトを設計できます。

サイトをモバイル向けに最適化する

サイトが既に検索エンジン向けに最適化されている場合、モバイルデバイス向けに最適化するのはそれほど難しくないはずです。 まず、モバイル化に必要なものを理解しましょう。 私たちはステップを3つの大まかなカテゴリに分類できます-

  • ステップ1 *-モバイル構成を選択する
  • ステップ2 *-検索エンジンに通知する
  • ステップ3 *-よくある間違いを避ける

モバイル構成を選択する

あなたが選択できる3つの異なるモバイル構成があります-

  • ステップ1 *-レスポンシブWebデザイン
  • ステップ2 *-ダイナミックサービング
  • ステップ3 *-別のURL

それぞれに長所と短所があります。 Googleはレスポンシブデザインを推奨していますが、3つの構成すべてをサポートしています。 次の表は、モバイル構成がURLおよびHTMLコードにどのように影響するかを示しています-

Mobile Configuration URL HTML
Responsive Web Design Stays the same Stays the same
Dynamic Serving Stays the same Different HTMLs
Separate URLs Different URLs Different HTMLs

レスポンシブWebデザイン

Googleはレスポンシブウェブデザインを推奨しています。レスポンシブウェブデザインは最もシンプルなモバイル設定であり、実装が非常に簡単だからです。 同じURLで同じHTMLコードを提供しますが、モバイルデバイスの画面サイズに基づいて表示を調整します。

レスポンシブWebデザイン

ダイナミックサービング

ダイナミックサービングは、WebサイトのURLが変更されないモバイル構成の一種ですが、モバイルデバイスからアクセスされると異なるHTMLコンテンツを提供します。

ダイナミックサービング

コンテンツがサーバーから動的に提供される場合、クロールするコンテンツがモバイルデバイスで異なる可能性があることをGoogleに必ず通知してください。 このアプローチの主な欠点は、ユーザーにコンテンツを切断する前に、サーバーレベルでコンテンツの追加処理を行う必要があることです。 この方法では、サーバーに不要な負荷がかかり、処理が遅くなります。

別のURL

モバイルユーザー用とデスクトップユーザー用の2つの異なるURLを維持する場合、どのバージョンを提供するかをGoogleに明示的に通知してください。 Googleでは、モバイルページがデスクトップページと異なることを自動的に検出できるため、個別のURLはお勧めしません。

異なるURL

同じWebサイトの2つのバージョンを維持するには、2倍の労力とお金が必要になるため、大きなWebサイトがある場合、このアプローチは実用的ではありません。 同時に、2つのバージョンを維持しながら、コンテンツのさまざまな矛盾を回避することはできません。

SEOの観点からは、各URLは個別に実行されます。 したがって、デスクトップランキングはモバイルランキングに追加されることはなく、常に個別のWebサイトと見なされます。 SEOのメリットを引き出したい場合は、モバイルバージョンとデスクトップバージョンで異なるURLを維持することはお勧めしません。

検索エンジンに通知する

Googleや他の検索エンジンがモバイル設定を理解していることを確認してください。 何よりも重要なことは、Googleがあなたのページを正しく理解して、ウェブサイトを適切にランク付けできるようにすることです。 Googleへの通知方法は、選択したモバイル構成(レスポンシブWebデザイン、動的配信、または個別のURL)によって異なります。

サイトに*レスポンシブデザイン*がある場合、Googleに通知することなく、Googleのアルゴリズムがサイトを自動的に理解できます。 レスポンシブデザインの場合は、Webページのヘッダーに次のメタタグがあることを確認してください-

<meta name="viewport" content="width=device-width, initial-scale=1.0">

ビューポートは、Webページをデバイスに表示する方法を決定します。 レスポンシブデザインのサイトは、デバイスの画面サイズに基づいてサイズが異なります。 Webページがどのデバイスでも正しく表示されるように、ビューポートを宣言します。

あなたのウェブサイトが*動的に提供されている*場合、GoogleがVary HTTPヘッダーを使用して設定を検出できるようにしてください-

Vary: User-Agent
*Vary* ヘッダーは、さまざまなコンテンツがデスクトップとモバイルデバイスで提供されることを検索エンジンに伝えるために重要です。 このヘッダーは、 *Content Delivery Network* などのキャッシュシステムによってコンテンツが提供され、これらのシステムが異なるデバイスでコンテンツを提供する際にこのヘッダーを使用する場合に非常に重要です。
*example.com* と *m.example.com* などの*別個のURL *を維持する場合は、デスクトップバージョンに特別な *link rel = alternate* タグを追加することでGoogleに通知できます。 。
Desktop page should have following in its header:
&ltlink rel="alternate" media="only screen and (max-width: 640px)"
href="http://m.example.com" >
Mobile page should have following in its header:
<link rel="canonical" href="http://www.example.com" >

よくある間違いを避ける

モバイルデバイス用にウェブサイトを最適化するために、次の間違いを犯さないようにしてください-

  • 低速のモバイルページ-モバイルネットワークは有線インターネットネットワークと比較して低速であるため、モバイルページの読み込み速度に注意することが重要です。 これはGoogleの重要なランキング要素です。 モバイルページの速度を調べるには、モバイルSEOツールを使用します。 Googleは、使用できる優れたツールを数多く提供しています。 次のリンクを参照- https://www.google.com/webmasters/tools/mobile-friendly/
  • * CSSとJavaScriptをブロックしないでください-コンテンツに合わせてダウンロードできるように、モバイルフレンドリーなWebサイトにはインラインCSSとJavaScriptを使用することをお勧めします。 したがって、CSSがあまりない場合は、タグ内で調整してみてください。ただし、別のファイルで多くのCSSを使用している場合は、ダウンロードする他のコンテンツのブロックを停止するために下部に含めるようにしてください。 同じ規則がJavascriptにも適用されます。Javascriptはページ自体の内部に保持するか、ページの下部に含めることができます。 ページの上部にファイルを含めることを回避できる場合は、それらを含めるときに async 属性を使用します。
<script async type="text/javascript" src="jquery.js"></script>
  • モバイルリダイレクト-通常、モバイルネットワークは低速であるため、リダイレクトが多すぎるとページの速度が低下する可能性があります。 複数のURLを保持している場合は、すべてのリンクが関連するページを指していることを確認してください。 複数のURLを維持し、ユーザーがモバイルデバイスからデスクトップページにアクセスしており、別のURLに同等のモバイルページがある場合、404エラーを表示する代わりにそのURLにユーザーをリダイレクトします。
  • 重い画像-重い画像はロード時間を増やしますが、有用で効果的であるため、完全に取り除くことはできません。 したがって、テキストと重い画像のバランスをよく保つ必要があります。 優れたツールを使用して画像を最適化し、低解像度で保存して、大量のダウンロードを防ぎます。
  • プラグインとポップアップを避ける-FlashやJavaなどのプラグインは、ユーザーのモバイルデバイスでは使用できない場合があります。 モバイルページに再生できないコンテンツがないことを常に確認してください。 モバイルページでポップアップを使用することは避けてください。モバイルデバイスでこれらのポップアップを閉じるのは非常に面倒になるからです。

モバイルページを作成するときは、ユーザーの作業スペースが限られていることに常に注意してください。 そのため、タイトル、URL、メタ記述を作成する際には、もちろん情報の本質や品質を損なうことなく、できるだけ簡潔にする必要があります。

便利なツール

以下は、サイトがモバイルフレンドリーであるかどうかを調べるために使用できる便利なツールのリストです。

  • * Googleウェブマスターツール*-利用可能なGoogleツールとテクニックを使用して、デスクトップWebサイトとモバイルWebサイトを設計する際に、何を使用し、何を避けるべきかを理解します。
  • モバイルエミュレータ-さまざまなモバイルデバイスでサイトがどのように表示されるかを確認できます。
  • Moz Local -このツールを使用して、ローカルSEOが正常であることを確認します。
  • レスポンシブWebデザインテストツール-このツールを使用して、標準画面サイズが異なるさまざまなモバイルデバイスでレスポンシブサイトがどのように見えるかを確認します。
  • Screaming Frog -これは、サイトを分析し、すべてのリダイレクトを再確認できる便利なツールです。
  • User Agent Switcher -これはFirefoxのアドオンで、別のユーザーエージェントからアクセスしたときのサイトの外観を確認するために使用できます。