
時代はモバイルファーストへ
現在では、ホームページ制作の現場では「スマホファースト」と言われています。
スマホが流行する前には、Flashの技術を使用してテキストや写真を動かしたり、ページを華やかに装飾するような「リッチデザイン」が主流でした。
リッチデザインの場合は、華やかさと引きかえに、ページ自体の容量が大きくなってしまいます。
一般的には、光回線など固定通信よりも、通信速度の劣るスマホにとっては、読み込みに時間がかかるリッチデザインのページを苦手としています。
そして、読み込みに時間がかかるほど、ユーザーの利便性が悪くなり、検索エンジンからの評価も相応のものとなります。
つまり、検索時に上位に表示されなくなるのです。
フラットデザインが主流
デザインの主軸は「フラットデザイン」となっています。
平面的、シンプルで、分かりやすいのがフラットデザインです。下記に分かりやすい画像(イメージのつきやすい)を参考画像として掲載します。
Source:http://www.remindnak.sakura.ne.jp/mus_prosite/t/
インターネットブラウザである「Google Chrome」のロゴマークです。
どちらも同じマークだという事はわかりますが、左側は「立体的」「光沢」など様々な効果をつけていることがわかります。情報の中に効果をたくさんつけるという事が「リッチデザイン」の本質です。
それとは対照的に、右側の「フラットデザイン」については、華美につくりこみすぎず、素材そのままの良さを活かすというイメージです。
なお、一見するとあまり手を施していない「フラットデザイン」は、工程をかけていない、悪い言い方をすると「手抜き」をしているのではないか?という言い方をされる場合がありますが、少ない情報で大切に伝えるという意味合いをフラットデザインで行うということは、リッチデザインよりも難しいと言われています。
分かりやすい例え話があるのですが、生け花などでも、よく見られますが素人が生け花を行う場合は次から次へと、花を生けていきがちですが、達人は本当に必要なポイント、必要な量だけで、素晴らしい作品を仕立てます。
こと「フラットデザイン」においても同様に、様々な装飾ができない分、要点をしっかりおさえて制作するというポイントが重要になります。
モバイルデザインから依頼されるケースも
通常ホームページ制作の場合は、パソコン画面で閲覧するデザインから制作を開始します。
そして、パソコン閲覧用のデザインが終了後に、スマホでの利便性をどの程度まで高めていくかという段階に入っていくのが一般的でした。
しかし、スマホが本格的に普及し始めてからは、一部クライアント様からは「スマホからのアクセスを集めたいので、まずはスマホ用の画面から制作してほしい」という依頼が寄せられるようになりました。
実際、弊社で運営している各種サイトのアクセス分析を行ってみても、アクセスの半数はスマホからだという事が分かります。
スマホ対応にはメディアクエリが必須!
ホームページ制作の現場においては、スマホからも見やすいページを意識して制作する必要があります。
特に、3段カラムといわれるデザインをスマホでそのまま表示させた場合には、ユーザビリティは改善の余地があります。
ページ閲覧者にとっては、細かい文字を見るために、常に拡大作業を行いながらページ閲覧をする必要性があるためです。
スマホからのアクセスを考えた場合、CSSのメディアクエリなどを活用して、スマホからのアクセス時のみ、2段カラム、ないしは1段での構成にするのが理想的だと言えるでしょう。