ホームページ制作会社のスマホ対応についての考察

  • URLをコピーしました!

目次

時代はモバイルファーストへ

現在では、ホームページ制作の現場では「スマホファースト」と言われています。

スマホが流行する前には、Flashの技術を使用してテキストや写真を動かしたり、ページを華やかに装飾するような「リッチデザイン」が主流でした。

リッチデザインの場合は、華やかさと引きかえに、ページ自体の容量が大きくなってしまいます。

一般的には、光回線など固定通信よりも、通信速度の劣るスマホにとっては、読み込みに時間がかかるリッチデザインのページを苦手としています。

そして、読み込みに時間がかかるほど、ユーザーの利便性が悪くなり、検索エンジンからの評価も相応のものとなります。

つまり、検索時に上位に表示されなくなるのです。

フラットデザインが主流

デザインの主軸は「フラットデザイン」となっています。

平面的、シンプルで、分かりやすいのがフラットデザインです。下記に分かりやすい画像(イメージのつきやすい)を参考画像として掲載します。

ホームページ制作会社のスマホ対応についての考察
Source:http://www.remindnak.sakura.ne.jp/mus_prosite/t/

インターネットブラウザである「Google Chrome」のロゴマークです。

どちらも同じマークだという事はわかりますが、左側は「立体的」「光沢」など様々な効果をつけていることがわかります。情報の中に効果をたくさんつけるという事が「リッチデザイン」の本質です。

それとは対照的に、右側の「フラットデザイン」については、華美につくりこみすぎず、素材そのままの良さを活かすというイメージです。

なお、一見するとあまり手を施していない「フラットデザイン」は、工程をかけていない、悪い言い方をすると「手抜き」をしているのではないか?という言い方をされる場合がありますが、少ない情報で大切に伝えるという意味合いをフラットデザインで行うということは、リッチデザインよりも難しいと言われています。

分かりやすい例え話があるのですが、生け花などでも、よく見られますが素人が生け花を行う場合は次から次へと、花を生けていきがちですが、達人は本当に必要なポイント、必要な量だけで、素晴らしい作品を仕立てます。

こと「フラットデザイン」においても同様に、様々な装飾ができない分、要点をしっかりおさえて制作するというポイントが重要になります。

モバイルデザインから依頼されるケースも

通常ホームページ制作の場合は、パソコン画面で閲覧するデザインから制作を開始します。

そして、パソコン閲覧用のデザインが終了後に、スマホでの利便性をどの程度まで高めていくかという段階に入っていくのが一般的でした。

しかし、スマホが本格的に普及し始めてからは、一部クライアント様からは「スマホからのアクセスを集めたいので、まずはスマホ用の画面から制作してほしい」という依頼が寄せられるようになりました。

実際、弊社で運営している各種サイトのアクセス分析を行ってみても、アクセスの半数はスマホからだという事が分かります。

スマホ対応にはメディアクエリが必須!

ホームページ制作の現場においては、スマホからも見やすいページを意識して制作する必要があります。

特に、3段カラムといわれるデザインをスマホでそのまま表示させた場合には、ユーザビリティは改善の余地があります。

ページ閲覧者にとっては、細かい文字を見るために、常に拡大作業を行いながらページ閲覧をする必要性があるためです。

スマホからのアクセスを考えた場合、CSSのメディアクエリなどを活用して、スマホからのアクセス時のみ、2段カラム、ないしは1段での構成にするのが理想的だと言えるでしょう。

本当に効果が出るWEBマーケティングなら、現場最前線で実績を出し続けている弊社におまかせください。

ホームページ制作、SNS運用、リストマーケティングなど、

市場分析、綿密な競合調査を実施し、御社に合わせて的確な戦略を構築、戦略策定→実装→効果検証まで、一気通貫でサポートいたします。

無料相談は下記からどうぞ!!

問い合わせフォーム、もしくはLINE公式からお声がけくださいませ。

よかったらシェアしてね!
  • URLをコピーしました!

この記事を書いた人

舘口 知弘のアバター 舘口 知弘 メディアワークス株式会社 -代表取締役

私たちは「WEBマーケティングのかかりつけ医」として、中小企業・個人事業主・医療機関・地方自治体などのWEB活用を支援しています。 ホームページ制作、SNS運用、SEO対策などWEB活用した事業成長に向け包括的に支援。「 売上・求人・集客」といった根本的な課題を解決、ビジネスを新たなステージに引き上げます

目次