- 編集部の見解や意向と異なる内容の場合があります
- 編集部は内容について正確性を保証できません
- 画像が表示されない場合、編集部では対応できません
- 内容の追加・修正も編集部では対応できません
前回のコラム「スマートフォン対応するということ」では、Webサイトをスマートフォン対応する上で考慮すべき点や、部分最適を行うのか全体最適を行うのかについて、初心者の方でも分かり易いように解説させていただきました。本コラムでは更にそこからテーマを掘り下げ、スマートフォン用サイトへの対応とマルチデバイスCMSの導入におけるキーポイントをご紹介していきます。
スマートフォン対応の最適化におけるポイントは?
スマートフォン用に最適化されたサイトを構築する上で配慮すべきポイントは以下の4つがあげられます。
- 情報
・ 全ての情報を掲載する訳ではなく、掲載すべき情報を吟味して必要に応じて絞り込む - ユーザビリティ
・ 直感的な視覚操作性に配慮する
・ ページ容量を軽くする (文字などもなるべく画像化しない)
・ ソフトウェアキーボードを意識したレイアウトを行う - デザイン
・ 各機種の解像度を意識し、標準化した状態でVI設計を行う
・ リキッド(可変幅)でデザインする (複数機種への対応の為)
・ 機種により異なる画像形式を考慮し、なるべくPNGを採用する
・ 重要な情報や情報の種別をわかりやすく
・ 外出先の利用を想定した色味を利用する (太陽光には反転色を)
※VI=Visual Identityの略: - 技術
・ html5、CSS3での記述を基本とする
スマートフォン対応の事例
また、今はまだ慎重にスマートフォン対応の時期を検討している企業も多いことから、全てのページを対応すべきか、重要コンテンツにのみ絞って対応すべきかを悩まれている担当者の方も多いのではないでしょうか?実際企業がどのような状況なのか、いくつかの具体例を見ていきたいと思います。
■ ソフトバンク株式会社
会社やサービス情報だけでなくIR向けコンテンツも含めた全ページをスマートフォン用に最適化しています。
■ 本田技研工業株式会社
TOPページおよび主要ページ(カテゴリTOP)のみをスマートフォン用に対応し、下位階層へはPCサイトへリンクさせるといった手法を取り、上手く効率的に対応をしている事例です。
■ 伊藤ハム株式会社
上記2例とは異なり特殊なやり方をしています。自社サイトの対応ではなく、レシピの紹介に特化して、スマートフォン用のサイトを設けています。主婦の方でスマートフォンユーザーの方であれば、レシピに関してはガラケーよりもスマートフォンの方がニーズが高いと想定されていることが予想されます。
特にECや資料請求などをゴールとしたWebサイトにおいては、フォームまで到達したユーザーをいかに離脱させないかがキーポイントになると思います。次はフォームでユーザビリティの高いスマートフォン対応をしている事例をご紹介します。
■ Nike+
- 一つ一つの入力フォームのエリアを広くとられており、タップしやすい設計にしている
- 自由入力を極力なくし極力プルダウンなどで選択できるようにしている
- 未入力項目がリアルタイムで表示される
スマートフォンで対応すべきページの選定にもいくつかポイントがあります。
- ユーザーニーズの高いページを最適化する
- 目的達成まで導線上のページを最適化する
- 最適化することで運用の手間やコストが増えないようにする
上記の3点をサイトの目的や役割を踏まえた上で検討し、現時点であるべきWebサイトのあり方を検討されると良いかと思います。
スマートフォン対応可能なCMS
昨今、PCサイト・モバイルサイト・スマートフォンサイト・タブレットPC・デジタルサイネージ・・と、対応を考えなくてはならないデバイスが非常に多くなり、これに対応して、品質を向上しながら成果を出していく為にはやはりCMS(コンテンツマネジメントシステム)がキーとなってくると考えています。CMSに関しては以下のような仕組みとなっており、インターフェイスはテンプレート次第でどんな表現でも実現可能です。ですのでデバイスが多様化しても基本的には一つの管理画面から各種デバイスを構築したり管理したりすることが可能です。
CMSを選定する際の重要ポイント
重要なのは、Webサイトの目的や運用体制、業務フローに基づいて一体どのようなCMSを導入するべきか?です。簡単にいくつかのポイントをまとめてみると下記のような形でしょうか。
- 多機能=良いCMSではなく、必要な機能を備えているかどうか
- 要件に合わせてカスタマイズを行える汎用性を備えている
・ 一定の仕様しか実現できないCMSはいつか限界がきてしまいます - 管理画面が使いやすい
・ 操作が難しいCMSは、利用する方を選んでしまいます。結果、導入しても活用できないという状態が起こり得ます - 費用
・ 費用対効果ももちろんですが買い切りかランニングが発生するものなのか、導入後のコスト運用も踏まえて初期検討を行う必要があります。どのCMSを選定しても組込みに発生する費用は、さほど違いはありません
以上、簡単ですがスマートフォン対応やそれに伴うCMSの検討におけるポイントをいくつかご紹介させていただきました。今後ますます増加していくスマートフォンユーザーとのコミュニケーション機会や商機を逃さぬよう、今のうちからノウハウを蓄積しユーザビリティの向上を行っていけるよう検討することをお勧めします。
■本コラムの元記事はこちら
スマートフォン最適化+マルチデバイスCMS導入のポイント
Webやアプリに関するコラムを配信しています!
■株式会社マイクロウェーブ
株式会社マイクロウェーブは、Webを活用した事業戦略立案、マーケティング、
Webサイト構築、Webシステム開発から、スマートフォン/タブレット用アプリ
ケーションの開発等を行っています。
ソーシャルもやってます!