レスポンシブウェブデザイン（Responsive Web Design）とは、1つのHTMLをCSSで制御してユーザーが閲覧するデバイスの画面サイズに併せてWEBページのレイアウト、デザインを最適化して表示させるウェブデザイン手法のことです。

主に「PC表示用」、「タブレット表示用」、「スマートフォン表示用」を始めとする3つのデザインがあります。同じWEBページであっても表示が大きく変わるという特長があります。

 

そんなレスポンシブウェブデザインには幾つかメリットがあります。以下の通りです。

・ユーザー間で共有されやすい。

・更新や修正などの管理が楽になる。

・検索エンジンの上位に表示されやすくなる。

 

逆にデメリットもあります。以下の通りです。

・デザインによって工程の数が増えてしまう。

・見せ方の変更に制限がある。

・スマホでの表示に時間がかかってしまう。

 

作り方の手順は以下の通りです。

①HTMLファイルのヘッダー部分にmeta viewportタグを追加する。

②CSSファイルにPC用とスマートフォン用での表示方法の違いを記述する。

 

最近ではPCよりもスマートフォンで情報を得ている人が増えてきています。

サイト運営者はレスポンシブウェブデザインを設計することで、WEBサイトをスマホ対応させるようにしましょう。