モバイルデバイスは、ビジネス情報の検索から外出先での音楽鑑賞まで、あらゆる場面で頼りになるプラットフォームになりつつあります。この傾向は今後ますます強まるため、市場シェアを競うには、Webデザインをモバイル対応かつレスポンシブなものにする必要があります。
しかし、「モバイル対応」とはどういう意味でしょうか?
モバイル対応とモバイルインデックスを混同しないでください。ウェブサイトがモバイル対応であるということは、レスポンシブデザインを使用して作成されていることを意味します。レスポンシブデザインとは、どのデバイスでアクセスしても、アプリの各ページの見た目と動作が同じように表示されるデザインです。ウェブサイトがGoogleによって適切に評価され、ランキングされるためには、ウェブクローラーが各ページをスマートフォンやタブレットに表示されるのと同じように読み取ることができる必要があります。
Google は、SERP のウェブサイトを評価する際に準備を優先事項としており、ほとんどの開発者はモバイルファーストのアプローチで設計を行っています。
多くの人が見落としがちな点の一つが、パフォーマンス重視のテーマ選びです。ホスティングレビューサイトAussie Hostingの創設者は、最近のSmashing Magazineのインタビューで次のように述べています。「モバイル向けの優れたテーマを選ぶ際に重要なのは、パフォーマンスです。CSSコンポーネントを縮小した軽量テーマを選ぶことで、モバイルウェブサイトの読み込み時間と速度が大幅に向上します。」
モバイル使用統計
モバイルデバイスの普及と重要性の高まりは、使用統計データからも明らかであり、最適化の必要性を浮き彫りにしています。セキュリティも重要な懸念事項です。
– モバイルデバイスの使用量は、2022 年までに 2 億 7,500 万台に達すると予想されています。
– 平均的な人は、1 日に約 5 時間をスマートフォンに費やしており、16% の人はスマートフォンのみを使用してオンラインにアクセスしています。
– 2017 年だけで 1,780 億個のアプリがダウンロードされました。この数は今後 3 年以内に 2,580 億個に増加すると予想されています。
– モバイル アプリからの収益は 2020 年までに 1,889 億ドルに増加すると予想されています。
[画像: https://mindsea.com/wp-content/uploads/2018/09/Screen-Shot-2018-09-13-at-1.17.45-PM.png]
– 2018 年の全デジタル広告収入の 63% はモバイル使用によって生み出されました。
– Google によって生成される検索トラフィックの 56% はモバイル デバイスからのものになります。
これらの問題を回避して、ウェブサイトをモバイル対応に最適化しましょう
モバイルの利用と普及は、開発者とウェブホスト向けの信頼できるベストプラクティスが確立されるレベルに達しています。以下は、ウェブサイト構築時に避けるべき最も一般的なエラーです。
1. ウェブサイトのモバイル最適化テストを実施していない
経験豊富な開発者やサイト管理者は、設計段階と運用段階におけるテストが、セキュリティやパフォーマンスの問題を確認する上でいかに重要であるかを知っています。ウェブサイトのモバイル対応状況をテストすることも同様に重要です。
これを怠ると、次のような結果になります。
- 文字が小さすぎて読めず、ボタンもほとんどの指には小さすぎる
- リンクが近すぎてタップできない
- モバイルビューポートが設定されていません
この最後の点は、スマートフォンがデフォルトでページをどのように表示するかに関係しています。初期デザインがレスポンシブでない限り、結果として表示されるページはデスクトップコンテンツの縮小版のようになり、拡大しないと判読できません。ブラウザは、メタビューポートを次のように構築することで、より読みやすいページを表示するように設定できます。
meta name=”viewport” content=”width=デバイス幅, initial-scale=1″
モバイルウェブサイトの準備状況は、さまざまな方法で確認できます。Google のモバイルテストツールを使えば、モバイルフレンドリーかどうかを効率的かつ正確に評価できます。
2. 情報を見つけにくくする
ユーザーは外出先で情報を入手することが多く、迅速な情報を必要としています。モバイルページで必要な情報が見つけにくいと、ユーザーはフラストレーションを感じ、直帰率が高くなります。
3. Flashの使用
Flashなどのライセンスが必要なプレーヤーは、モバイル向けに設計されていません。Flashやモバイル以外のプレーヤーで再生する必要があるコンテンツの使用は避けてください。
4. ファイルや画像を圧縮しない
これはあらゆるウェブサイトデザインにおけるベストプラクティスです。JSコーディングとCSSを圧縮し、画像を最適化することで、読み込み時間とコンテンツの品質の低下を防ぐことができます。
5. JavaScript、CSS、画像ファイルのブロック
これらの要素はウェブサイトの速度を低下させる可能性がありますが、だからといって完全に削除する必要はありません。完全に削除するとパフォーマンスが低下するだけでなく、Googleからペナルティを受ける可能性があります。このツールを使えば、これらの要素がブロックされているかどうかを確認できます。
6. リダイレクトを適切に設定していない
これは、レスポンシブデザインを優先しなかった結果です。不適切なリダイレクトとは、デスクトップやノートパソコンでは通常問題なく表示されるURLが、モバイルユーザーを不適切または誤ったURLに誘導するものです。Googleウェブマスターツールを使えば、こうしたリダイレクトの有無を確認できます。
7. モバイル専用の404エラーを許可する
繰り返しになりますが、レスポンシブでモバイルファーストなデザインを採用することで、この問題を回避できます。この問題は、デスクトップやノートパソコンでは問題なく表示されるウェブページをモバイルデバイスでアクセスしようとすると、404「ページが見つかりません」というエラーが表示される場合に発生します。
モバイルフレンドリーを実現するためのヒントとベストプラクティス
デザイン、マーケティング、パフォーマンスにおけるよくある間違いを避けることに加えて、Web サイトやアプリがモバイル フレンドリーであり、最高のパフォーマンスと高度なセキュリティが実現されるように最適化されていることを確認するための手順があります。
テスト
1. ウェブサイトのモバイル対応状況をテストします。
2. 電子商取引とモバイル アプリのホスティング用に別の Web サイトを作成したり、動的サーバーやレスポンシブ デザインを使用したりなど、自分に最適なモバイル フレンドリーなオプションを選択します。
モバイルSEOのベストプラクティス
3. モバイル SEO のベストプラクティスを使用します。
ツール
4. 最適化、パフォーマンスとセキュリティの監視、モバイル SEO に役立つ適切なツールを使用します。
最後に
速度とパフォーマンスは、モバイル対応だけに影響を及ぼすわけではありません。これらの要因は、人々の印象を損なう可能性があります。あるレポートによると、訪問者やアプリユーザーに良い印象を与えられる時間はわずか55ミリ秒しかありません。人々がモバイルプラットフォームに依存するようになるにつれて、満足させることはますます難しくなるでしょう。
上記の提案を活用することで、よくある問題を回避し、安定したパフォーマンスと高い可用性を確保できます。これらの提案がどのように役立ったか、ぜひコメント欄でお知らせください。
