スマートフォン対応ホームページ制作のススメ

スマートフォン(スマホ)は主に、移動時間・休憩時間などの“スキマ時間”で利用されています。
そのため、スマートフォンを利用している一般消費者(コンシューマ)を対象とした企業・事業主さまより、スマートフォン対応のホームページ制作の需要が年々高まってきています。
オフィス山家では、スマートフォン対応のホームページ制作も承っております。

スマートフォン対応サイト作成をススメる業種業態。

  • 飲食店
  • 雑貨店
  • 美容室
  • 診療所
  • 習い事

など。一般消費者(コンシューマ)を対象とした企業・事業主さま全てに当てはまります。

既存ホームページのスマートフォン版を作成

現在すでに運用されているホームページとは別に、スマートフォン用にデザイン・レイアウトを行ったホームページを作成します。

スマホ対応サイト
作成前(PCサイトのみ)

  • スマートフォンの画面サイズに、PCサイト全体が縮小されて表示される。
  • ピンチ(2本指で拡大縮小)、たてよこスクロール作業を繰り返し行う必要。
  • データ量が大きい。すぐに表示されない。
  • ボタンが押しにくい。電話がかけにくい。

スマホ対応サイト
作成・公開後

  • スマートフォンの画面サイズに適したレイアウト、文字・画像の大きさで見やすい。
  • たてスクロールのみで、作業負担を軽減する。
  • 軽容量で待たせない。サクサクと動作する。ストレスをあたえない。
  • ボタンが押しやすい。電話が簡単にかけられる。

PCサイトとは別立てで、スマートフォン対応サイトを作成する場合、両サイトの共通性を持たせるために、デザインイメージはPCサイトに合わせて作成するのが基本です。
例えば、同一ユーザーが、外出先ではスマートフォンでサイトを見て、自宅に帰宅後、PCでサイトを見るといった行動が考えられるからです。
(目的・テーマによっては、あえてPCサイトとは異なるデザインで作成する場合もあります。)

スマートフォンサイトとPCサイトを新しく作成

これから新しくホームページを作成される場合。または、スマートフォン用のサイト作成と合わせて、PCサイトも新しく作りなおされたい場合。

PCとスマートフォン、両方に対応した「レスポンシブWEBデザイン」という方法でホームページを作成することができます。

レスポンシブWEBデザインとは

PCとスマートフォン、別々にホームページを作るのではなく、まとめて作成することができます。
画面サイズ(横幅)にあわせて、自動的にレイアウトを調整してホームページを表示させることができる仕組み。ホームページ公開後の更新が行いやすいという利点があります。

GoogleもレスポンシブWEBデザインを推奨しています。

当サイト『オフィス山家』の公式サイトもレスポンシブWEBデザインで作成しています。ブラウザの横幅を縮めてみてください。

スマートフォン対応サイトを作成して「モバイルフレンドリー」に

ひとことで言うと、モバイルフレンドリーとは、

スマートフォンを使う人にとって
「使いやすく」「読みやすく」「解りやすく」
作られているホームページ

を指します。

ユーザーのことをどれだけ思いやってホームページが作られているか、一つの基準になってきます。

モバイルフレンドリーはGoogleモバイル検索結果で優遇されます。

Googleの検索ランキングの評価基準の一つとして、モバイルフレンドリーテストの合否があります。

主な評価ポイント

  • テキストが小さすぎて読みにくくないか。
  • PCサイトがそのままスマホの画面上で小さく縮小されて表示されていないか。
  • ボタン同士が近すぎて押しにくくないか。

当然、スマートフォン対応サイトを作成するからには、モバイルフレンドリーテストに合格することも視野にいれて作成していきます。

『モバイルフレンドリーテスト』の利用はこちら。

スマートフォン対応サイト作成のポイント

縦スクロール重視のレイアウト

スマートフォンは、PCとは違って画面サイズが小さく、基本的には縦長で使われます。
縦方向のスクロールのみで使用できるように、重要度の高い情報を上から順番にレイアウトしていきます。

サクサク動く軽いデータ量(HTML5・CSS3コーディング)

近年、LTEによるデータ通信高速化により、写真や動画の読み込み速度は格段と速くなりました。しかし、ムダなデータ量を消費させる作りは、ユーザーに対し優しい作りとは言えません。また、スマートフォンの機種によっては、動作が重くなってしまうことも考えられます。
そこで、データ量の大きすぎる画像は極力使用せずに、HTML5とCSS3を有効活用して軽い容量でサイトをデザインしていきます。

指で操作しやすいユーザービリティ

スマートフォンは指で操作するものです。間違って他のボタン(リンク)を押し間違えないように、一つ一つのボタンの大きさや形について
デザインしていきます。電話番号をワンタッチすることで簡単に電話をかけることができるのも、スマートフォン対応サイトの利点です。

iPhone・Androidなど、様々なデバイスに対応

現在、スマートフォンは大きく別けて2種類。Apple社製の「iPhone(iOS)」とGoogleが開発したOSを搭載した「Android」があります。Androidは多くのメーカーから発売され、メーカーごとにスマホの画面サイズが異なります。様々なスマートフォンに対応できるホームページを作成することが求められます。

地図アプリ機能との連動

外出先でも利用されるスマホ。スマホ片手に地図アプリを使って目的地を目指して歩いている人を、よく見かけるようになりました。ホームページ内に地図を掲載するだけでなく、地図アプリと連動することが、常識になりつつあります。

高解像度ディスプレイ(Retina)にも対応

最近のスマートフォンは、画面サイズは狭い分、高解像度のディスプレイを使っているケースが多くなってきました。(一般的なディスプレイ解像度よりも1/4のきめ細やかさ。)
高解像度のディスプレイでもキレイに写真や文字が表示されるように、様々な仕様を想定してホームページを作成していきます。

Copyright(c) Office Yamaya. All Rights Reserved.