オフィス匠株式会社

モバイルファースト

Webサイトを運営していると、最近モバイルファーストをいうキーワードをよく耳にします。当社もモバイルファーストを重要なWeb要素と捉え、本ページでモバイルファーストに関する記事を公開します。

モバイルファーストとは

そもそもモバイルファーストとは、どのような事をサうのでしょうか?

モバイルの普及

スマートフォン普及率推移図 デスクトップ用
スマートフォン普及率推移図 モバイル用

総務省の白書では、2010年以降スマートフォンの普及率が激増し、2021年時点9割を超えようとしていると発表しています。
近年スマートフォンは、生活の基盤ツールとして重要な役割を担っていると言えます。

当然ホームページの利用もスマートフォンからのアクセスが増え続け、コンテンツを配信する際モバイルに対応した内容が求められています。

モバイルファーストインデックス

モバイル ファースト インデックスを開始します

2018年3月27日火曜日Googleウェブマスター向け公式ブログで、これまで、Googleのクロール、インデックス、ランキングシステムでは、デスクトップ版のコンテンツが使われてきたが、内容がモバイル版と大きく異なる場合、モバイル検索ユーザーに問題が発生する可能性が有った。
そこで、モバイル版ページをインデックス、ランキングに使用し、モバイルユーザーが探しているものを見つけやすくする、モバイル ファースト インデックスを始めると公式に書かれています。
これからも、検索結果に使用するインデックスは、1つのままで、「モバイル専用のインデックスは無い」、今後はモバイル版コンテンツをインデックスする。

また、AMP及び非AMPページの両方を公開している場合、非AMPページ(canonicalページ)をインデックスするそうです。

このことから、非AMPページ(キャノニカルページ)は、レスポンシブルでモバイル(スマートフォンやタブレット)でちゃんと読めるページを公開する必要があると言えます。

検索もモバイルファースト

Googleのサイトのアクセス管理ツール(Google Search Console)でも、検索のアクセス数をPC、モバイル、タブレットのデバイス別で見ることが出来きます。

また、Googleは、このツールでがホームページを公開している側に、デバイスを意識した様々なコンテンツ内容をチェックし通知してくれる仕組みを提供してくれています。

このことから、Googleはスマートフォンの普及に伴い、検索結果の効果的なサービスに基づくモバイルファーストという指針を出したと考えられます。

そのことが、冒頭Googleの「モバイル ファースト インデックスを開始します」の中からも読み取れます。

なぜモバイルファーストなのか

では、なぜモバイルファーストが必要なのか、現状どのような課題が有るのかを整理しましょう

レスポンシブルのレイアウト比較

レスポンシブルのレイアウト比較 デスクトップ用画像
レスポンシブルのレイアウト比較 モバイル用画像

PCとモバイルで同一のコンテンツを配信する際、PCは幅を生かしたマルチカラムのレイアウトですが、モバイルは1カラムの縦長のレイアウトとなってしまします。
実際、スマートフォンの場合、指先で画面をスクロールしコンテンツを読んでいます。
従来横長のコンテンツレイアウトを縦長に対応させる際様々な課題が生じます。まず、画像です。PCとモバイルに同じ画像を使うと画像が小さすぎてモバイルでは認識し辛く指先で拡大をしながら見ることに成ります。
しかし、モバイルファーストではモバイルの標準的な表示で認識可能なできる画像を使う必要が有るんです。文字のサイズもPCのままでは大きすぎたり、長いタイトルは折れ曲がった表示になります。

モバイルファーストの必要性

「スマートフォンで最適なホームページを作る」そして、PCなどのデバイスでも問題なく閲覧できるホームページを作らなければいけないということです。

これらの課題を解決するために、レスポンシブルページという方法を採用するサイトが増えています。

レスポンシブルは、CSSのメディアクエリー機能を生かした画面幅で表示を切り替えるスタイルシートを使い表示幅に合わせたページを実現しています。

画面幅も、モバイルのスマートフォンからからデスクトップなどのFullHDサイズを意識したレイアウトの切り替えが可能なスタイルシートを定義する必要があるます。

また、メディアクエリーを実現するためHTMLにも各表示幅に対応したコンテンツの記述が必要となり、画像なども縦長から横長等、メディア別で定義したり、上記レイアウトのように複数のカラムを使った手法が主流に成っています。

モバイルファーストにすると

モバイルファーストに対応することでどの様な効果があり、どのような事に注意して対応すべきかを考えてみます

モバイルユーザーの利便性向上

これほどモバイルでの検索が増える中、せっかくサイトに訪問して頂いた方に、見やすいコンテンツで情報をご提供することが、本体サイトを公開し情報を発信するサイト運営者の最終目的です。
Webマーケティングとしてサイトを使うならモバイルファーストが最も効果を生み出す方法と考えてもおかしくありません。

Google検索への最適化

2021年時点、GoogleとYahooでの検索シェアは90%を超えます

実際には、YahooもGoogleの検索エンジンを使っています。ということは、Google検索の親和性を追求することが、検索結果に必須な条件だと言えます。

Googleとの親和性とは、Googleが求める仕様に基づくコンテンツを作る必要が有り、モバイルファーストもその重要な要素になったということです。

モバイルファーストのまとめ

全てはモバイルユーザーのため

Googleの動きからも、モバイルユーザーファーストの重要性が伺えます。モバイルデバイスでのWeb使用率が90%を超えようとしている時、サイト公開者がモバイル対応することもモバイルユーザーへの必要な対応だと言えます。
可能な限り、モバイル端末で完結するWebインターフェースを公開することが必要な時代です。本来ビジネスサイトはWebマーケティングやEC等顧客接点を創出し、ネットでビジネスのフローを作り出すためのツールです。
そんなツールが今、モバイルファーストの時代になったと言えるでしょう。

モバイルファーストは小手先では対応できない

従来、デスクトップファーストで作っていたサイトの大半は、モバイルファーストでそのまま使えるケースは少なく、モバイルファーストの言葉通り、まず、モバイル優先でサイト設計し作成する必要があります。は

通信環境を意識した画像サイズや次世代フォーマットの採用、モバイルに最適化したテキストサイズや文字間隔、クリック可能なリンク要素も、指でタッチした際誤って近くの要素をクリックしない工夫も必要です。

また、最近省電力化に対応するダークモードなども今後重要視される要素です。

このようにデスクトップをターゲットにしたコンテンツとモバイルをターゲットにしたコンテンツでは、これまで意識しなかった多くの要素が求められます。

だからこそ「モバイルファースト」とあえて定義し、この先のWebニーズ、顧客ニーズを満たすコンテンツ及びコンテンツ配信環境を含むすべての要件をモバイル優先で考え作る行為をモバイルファーストと考えるべきです。

お問合せフォーム

は、入力が必須となっております。