連載  /  

Dreamweaverで学べるBootstrapの超基本!第0回 「レスポンシブデザインを始める理由」

BY 公開

1. インターネット利用の約半分がスマートフォン

最近は手元のスマホでWebにアクセスという人を良く見かけますね。ニールセン社の調査によると、2014年の日本におけるインターネット平均月間利用者数は、PCが約5210万人、スマートフォンが4260万人となっています。昨年は、インターネットユーザーの約45%がスマートフォンユーザーでした。

2013年からの伸び率を比べると、PCはー8%と微減、一方スマートフォンは+34%と一年間で急速に増加しています。この勢いなら、2015年は逆転の年になるでしょう。サイトのモバイル対応が訪問者の満足度に与える影響はますます大きくなりそうです。

2. 採用実績の増加と便利なフレームワーク

q5アドビの調査「モバイル対応企業の82%がレスポンシブを採用」 によると、モバイル対応したサイトを運用中または製作中の企業の8割以上がレスポンシブデザインのサイトを採用しています。登場から5年が経過して、レスポンシブデザインは既にモバイル対応の現実的な選択肢のひとつとなったようです。

その理由としては、BootstrapやFoundationといったフレームワーク、あるいはSass/Lessの存在が挙げられるでしょう。これらの技術が成熟するにつれ、レスポンシブデザインは効率的に、かつ安心して採用できるテクニックになりました。

3. モバイルSEOへの対策が必要に

2015年4月21日からグーグル検索に変更が行われました。これにより、SEOの観点からも、サイトのモバイル対応が無視できなくなっています。

新しい検索結果では、スマートフォンから検索すると、モバイル対応しているページがより上位に表示されます(参考記事「Rolling out the mobile-friendly update」)。モバイルユーザーの総合的な利便性向上が期待される更新です。

検索ランキングに影響するということで、新規サイトはもちろん、既存サイトについてもモバイル対応は急務になったと考えられます。レスポンシブデザインのサイトならはひとつのページがPCにもモバイルにも対応するためSEO対策の手間がかかりません。

4. 充実する開発環境

2015年6月公開のDreamweaver CCはBootstrapをサポート、レスポンシブなWebサイトの制作に対応しました。

dw-responsive_websites

ビジュアル開発環境とフレームワークの相性は抜群です。ブロックを組み上げる感覚でレスポンシブデザインのレイアウトを配置できます。使い方を紹介するビデオが公開されていますのでご覧ください。 [Dreamweaver CCでレスポンシブなWebサイトを構築する]

 

  AUTHOR

akihiro kamijo

アドビのコンサルティングチームでリードアーキテクトとして主にUIデザインプロジェクトに関わる。現在は独立してWeb・アプリのデザイン/開発に関連する情報発信やプロジェクト支援を行っている。