サービス

レスポンシブウェブデザイン

スマートフォンやタブレットPCの普及にともなって、ユーザーがウェブサイトを閲覧するデバイスは多岐にわたっています。デスクトップPC、スマートフォン、タブレットそれぞれに各社から多様な画面解像度の端末が発売されている状況下で、どのデバイスのユーザーにも最適化されたレイアウトでサイトを閲覧してもらうための手法の一つとして、“レスポンシブウェブデザイン”という方法が使われています。

レスポンシブウェブデザインとは、CSS3で導入された「メディアクエリー」というモジュールでディスプレイの解像度やウィンドウサイズを取得し、ウィンドウ幅に合わせてレイアウトを切り替える、というものです。
※このTAMオフィシャルサイトもレスポンシブウェブデザインを導入しております。ブラウザの横幅を縮めたり広げたりしてレイアウトが変わることをご確認ください。

レスポンシブウェブデザインの導入に際しては、

  1. フレキシブルなグリッドベースの画面設計
  2. データ容量への細心の配慮
  3. 画面内の要素の優先順位の明確化
  4. 切り替える画面幅の定義

などを考慮に入れる必要があり、PCサイトを作ってそれをレスポンシブ対応させる、という考えでは実現できません。どちらかと言えば、モバイルユーザーを軸にしたコンテンツ・画面設計をベースとし、PCユーザー向けにはそれを拡張させていく、という考え方の方が親和性が高いと言えます。

レスポンシブウェブデザインに関するTAMのノウハウ >

レスポンシブウェブデザイン制作事例

スマイルゼミ

事例1 スマイルゼミ

パソナテックのエンジニア仕事情報

事例2 パソナテックのエンジニア仕事情報

コープ化粧品

事例3 コープ化粧品

ソレキア株式会社

事例4 ソレキア株式会社

シャープの総合電子書籍ストア「GALAPAGOS STORE」

事例5 GALAPAGOS STORE

リンクシェア・ジャパン公式サイト

事例6 リンクシェア・ジャパン公式サイト