PCサイトとスマートフォンサイトをどのように扱うか?国内のレスポンシブウェブサイトをまとめました

海外の企業サイトではレスポンシブウェブサイトもだんだんと浸透しております。

Responsive Web Design を利用している企業サイトリスト

毎日更新したり、記事コンテンツの多いサイトでは、全デバイスのソース管理や更新が1ソースでできるレスポンシブウェブサイトの導入は一つの選択肢として魅力的です。

また共通のURLを使用することでSEOに強い面もあります。

Webフォントを使用すれば、デザインのズレもあまり考えることがなく海外サイトでは多くのレスポンシブウェブサイトを見かけます。

ですが、日本国内ではどうなのでしょうか?

今回は国内企業のレスポンシブウェブサイトをまとめてみました。

日本の企業サイトのように情報量が多く、かっちりしたデザインをはレスポンシブウェブサイト化する際の参考になればと思います。

国内企業のレスポンシブウェブサイト

カヤック

http://www.kayac.com/

IMJインベストメントパートナーズ

http://www.imj-ip.co.jp/

ミツエーリンクス

http://www.mitsue.co.jp/

カネボウ化粧品

http://www.kanebo-cosmetics.co.jp/

FANCL ファンケル

http://www.fancl.jp/

NHKスタジオパーク

http://www.nhk.or.jp/studiopark/

マウリッツハイス美術館展

http://www.asahi.com/mauritshuis2012/

株式会社アバランチ ホームページ制作実績サイト

http://web.avalanche.co.jp/

The Share – ヒトにフォーカスするライフスタイルウェブマガジン –

http://theshare.jp/

株式会社インサイト

http://www.ppi.jp/

株式会社太平社

http://www.taiheisha.co.jp/

アイデアマンズ株式会社

http://www.ideamans.com/

iRobotロボット掃除機ルンバ

http://www.irobot-jp.com/

パナソニック新卒採用サイト

http://panasonic.co.jp/jobs/new_gra/

Adobe HTML5 特設サイト

http://adobe-html5.jp/

tsunagu-日本の手仕事から生まれる生活道具の店-

http://www.tsunagu-life.com/

おまけ

BizVektor

日本のビジネスサイト向けのWordPressテンプレート

http://bizvektor.com/

まとめ

基本的に制作会社のサイトや、短期的なキャンペーンサイトやページ数の少ないサイトに多く使われはじめている印象でした。

また、ここでは紹介しませんでしたが、ブログのテンプレートなどにも有効に使用されていると思います。

個人的にはレスポンシブウェブサイトもスマートフォンサイトの最適化も、どちらにしても一長一短があり、企画・提案・構成・デザインを通して制作して行かなければいけないと思います。

企業サイトをレスポンシブウェブサイトにするにあたり気をつけなければならないと感じたことを以下にまとめます。

  • 画像やCSSのスマートフォンでの読み込みの容量を考える
  • ただレイアウトを変えるだけでなく、それぞれのデバイスで見せたい情報を考えて整理する
  • ユーザー・クライアントの要望の優先事項に合っているのかを考える

この記事を書いた人

著者 : ハヤシユタカ

2001年、有限会社ムーニーワークスを設立。WEB制作の他、書籍執筆、セミナー講演、企業研修などを行う。また、クリエイター育成機関デジタルハリウッドでは1999年より講師として本科WEBデザイナーコースやデジタルデザインコースを担当。 詳しいプロフィールはこちら

最近書いた記事

この記事に関連する記事