レスポンシブWebデザイン入門セミナーに参加しました

最近社内でUX推進活動なるものをやっております。その関係で先週金曜日(6/15)にミツエーリンクスさんが主催する「レスポンシブWebデザイン入門セミナー」という無料のセミナーを紹介してもらいましたので参加してきました。

入門ですので、具体的な設計・実装方法には触れられなかったものの、長所と短所がまとめられ、大変わかり易い講座でした。ミツエーリンクスの自社サイトをリニューアルするにあたりレスポンシブデザインを採用しているのですが、その際にどのような考え方で現在のサイトが出来上がったか、という具体事例を踏まえてお話がありましたので、参考になりました。


まだ7月の講座に空きがあるようですので(6/18現在)、ご興味のある方は参加してみると良いと思います。

レスポンシブWebデザイン入門セミナー | セミナー | ミツエーリンクス


講座の内容です。

■ レスポンシブWebデザインの3要件

  • スクリーン幅に応じて変化するグリッドベースのレイアウト
  • 伸縮しフィットする画像/メディア
  • メディア特性に応じてスタイルをスイッチ


■ 気をつけること

  • モバイルファーストの考え方で進めていくということ
    • モバイル市場の成長は新たなビジネス機会を生み出し、モバイルデバイスの能力が革新的なサービスやUXを生み出す


■ 長所と短所


■ 受け入れられている理由

  • 多様化するデバイス、スクリーンサイズ、コンテキストへの対応が可能


ミツエーリンクスのサイトリニューアル(方針)

  • 特定のデバイスにフォーカスしない
  • 画像の差し替えで速度が速くなるが、管理・運用コストがかかるので差し替えはしない
  • マルチカラムレイアウトの維持にはこだわらない


ミツエーリンクスのサイトリニューアル(表示高速化対応)

などなど


ミツエーリンクスのサイトリニューアル(デザイン上のポイント)

  • 拡縮時のレイアウト遷移のブレイクポイントをどこに置くか
    • 実際に色々実験した結果、最適な値を見つける
  • レイアウトを過度に変更させ過ぎない
  • 古いブラウザへの対応はある程度表示が保てればOKと割り切り


「モバイルファースト」を何度も強調されておりました。ミツエーリンクスさんのサイト改修の始めはそういう概念がまだなかったらしく、後から考えをモバイルファーストにしていったため大変だったというお話をされておりました。時代はスマフォだなあとつくづく実感したセミナーでした。

最後に、この経験をミツエーリンクスさんの商品として提供するという紹介を受けました。無料のセミナーですから、それぐらいの広告はあってしかるべきですよね。


自社サイトを改修した経験を即ネタとして提供できるというその対応の速さ、ノウハウの切り出し方、そういったところのビジネスのやり方にも大変感心したセミナーでした。