あなたのウェブ戦略を支える【WEBの味方】 produced by connecnect

WEBディレクターの本音ブログ

スマホ対応のWebサイト構築の考え方|スマホ対応のための2つの方法

   


pcandiphone

そろそろホームページをリニューアルしようか?と考えている企業のWeb担当者へアドバイス。

リニューアルするなら「スマホ最適化」を視野に入れて企画・制作を考えましょう!

昨今では、パソコンでホームページを閲覧するよりもスマホで閲覧するユーザーのほうが多くなっています。

スマホのみ利用が1.6倍、スマホのみ検索キーワードが7倍、ヤフーの調査にみる検索市場の将来
マルチデバイス化の傾向は変わらずも、スマホのみユーザーの急拡大によって検索のスマホシフトが加速
http://web-tan.forum.impressrd.jp/yahooads/2015/01/27/19061

スマホ最適化とは、スマホの小さな縦長画面でホームページを閲覧したときに、その画面特性に併せてレイアウトを観やすく最適化されるような技術を導入したサイトのことを指します。

 

まぁ、ここまでは日々の業界情報などでWeb担当者であればご理解いただいていることと思いますが、「スマホ最適化」には2つの方法があるということをお伝えしておきます。

ひとつは、パソコンとスマホでそれぞれにページ(HTML)を用意しておき、アクセスしたユーザーの環境(画面サイズ)を判断してどちらのHTMLを表示するかを判断させるタイプ。

2source

 

ふたつめは、ひとつのページ(HTML)をアクセスしたユーザーの環境(画面サイズ)を基に読み込ませるCSSを変え、最適化するタイプ。これは俗にワンソースマルチユース型とも言われています。

multi

 

昨今のスマホサイトは、上記のどちらかを採用していますが、それぞれにメリットデメリットが存在します。

 

それぞれにHTMLを準備する場合

最大のメリットは、それぞれの画面サイズに特化したサイト作りができるということで、パソコンとスマホでそれぞれにターゲットを設定し、構築することで成果を最大限に追及することができます。
デメリットとしては、運営管理の複雑化があげられるでしょう。パソコン版を更新したらスマホ版の修正も必要になり、単純に計算すると手間が2倍掛かるといえます。また双方のデータにアンマッチがあるとユーザーに混乱を与えることにもなり注意が必要になります。

 

ひとつのHTMLでCSSで切り替える場合

このメリットは、先のデメリットであった運営管理が容易であるということ。情報源のHTMLソースは1つのため、情報のアンマッチなどは起こりません
デメリットとしては、細かなデザインやレイアウト、仕掛けなどに制限がでてしまうことがあげられます。1つのHTMLをCSSによってレイアウトを変更しているの過ぎないので「スマホではAのように、パソコンではBのように」といった各々に特化したようなデザインは表現できません

 

このように「スマホ最適化」といっても、その表現方法には上記2つの方法があることをお伝えします。

アナタの管理するWebサイトがどちらのタイプを選択する方法がベストかは、そのサイトの運営管理体制やその運営費などによって変わってくると思われますが、どちらにしても、近々ホームページリニューアルを考えている場合は、スマホ対応を視野に入れるのは必要不可欠ですのでご検討あれ。

読了ありがとうございました。

 


 - SEO対策, デザイン, マネジメント, マーケティング・戦略

Message

メールアドレスが公開されることはありません。