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

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

異なる画面サイズを持つデバイスに対して、自動的に最適化されるデザイン手法のことです。

レスポンシブで有名なものとして、Media Query(メディアクエリー)があります。 メディアクエリーを使うと、画面の幅や高さに応じて、デザインを切り替えることができます。

詳しく

近年、PC やタブレット、スマホと、Web にサイトにアクセスする端末は多様化してきてます。 そんな中、Web サイトを作成するに当たって、レスポンシブデザインの考え方は重要になってきます。

スマホのシェアが少なかった時代は、パソコンで Web サイトを閲覧することが主流でした。 そのため、PC サイトとスマホサイトをそれぞれ別の URL（例: example.com と sp.example.com）で別々に構築することが一般的でした。

しかし、この方法は 2 つのサイトを構築・管理するため、コストが 2 倍かかり、メンテナンスや更新作業も煩雑になります。また、スマホやタブレットの普及が進むにつれて、パソコン向けの固定レイアウトでは表示が崩れたり、文字が小さくて読みにくくなるといった問題も生じました。

2015 年に Google がモバイル対応済みページの検索順位を上げる「モバイルフレンドリーアップデート」を実施しました。これにより、スマホ対応は SEO の観点からも重要視されるようになり、レスポンシブデザインが急速に普及しました。