レスポンシブデザインとは

なぜ重要か

Webサイトへの訪問は、スマートフォンからのものが大きな割合を占めるようになっています。パソコン向けに作られたページをスマートフォンで見ると、文字が小さく、ボタンが押しにくく、離脱の原因になります。レスポンシブデザインは、一つのページで両方の端末に対応するため、更新のたびに二つのページを直す手間がなく、情報の食い違いも起こりません。検索エンジンもモバイルでの表示を重視しており、集客の面でも欠かせない対応です。

発注・開発の実務での意味

ホームページ制作やモバイルサイト制作の見積では、「レスポンシブ対応を含むか」「どの画面幅を想定するか」を確認します。デザイン作業では、パソコン向けとスマートフォン向けのレイアウトをそれぞれ検討する必要があるため、パソコンだけの制作より手間が増えます。表やグラフ、複雑なフォームなど、狭い画面での見せ方に工夫が必要な要素は事前に洗い出しておくと、後の調整が減ります。

業務システムの管理画面でも、外出先からスマートフォンで使う場面があるなら、レスポンシブ対応を要件に含めます。ただし、すべての画面を対応させるのではなく、現場で使う画面だけをスマートフォン向けに設計する、という絞り込みも合理的です。

既存サイトを後からレスポンシブ化する場合、HTMLの構造によっては作り直しに近い作業になることがあります。既存サイトの状態を確認したうえで、部分的な対応か全面改修かを判断します。

関連する用語

• CMS — テンプレートにレスポンシブ対応が求められる
• ステージング環境 — 複数端末での表示確認に使う環境
• 検収 — 端末ごとの表示確認を検収条件に含める