レスポンシブ対応とは

複数の端末に最適なデザイン表示が可能

レスポンシブのメリットは、1つのデザインで、PCやスマートフォン、タブレットなど複数の端末に最適化できることです。
レスポンシブ対応していないWebページは、PC向け、スマートフォン向け…など端末によって複数のデザインを作る必要があります。
レスポンシブなら、画面のサイズに合わせて最適なデザインを表示させるので、どの端末からアクセスしても見やすくなります。

Webページ更新の手間を削減

レスポンシブは、Webページの更新を行う際も手間が少なく済みます。レスポンシブ対応していないと、端末ごとに最適化したWebページデザインを複数管理することもあります。
たとえば、PC向けとスマートフォン向けの2つのWebページを管理している場合、どちらのWebページも同じタイミングで更新する必要
があるでしょう。レスポンシブデザインは、1つのWebページで複数端末に最適化されるため、Webページの更新も1つで済みます。

同一URLで管理するためSEOに有利

レスポンシブのWebページは、SEOにも有利と言えるでしょう。
レスポンシブなら、1つのWebページでPCやスマートフォンなど複数の端末に最適化できます。
レスポンシブは1つのWebページにつきURLも1つです。
レスポンシブ対応していないと、同じ内容のWebページでもPC向け、スマートフォン向けなど複数のWebページを管理する必要があり、URLもそれぞれ異なります。URLが異なるとSEO評価が分散される可能性も。

たとえば、スマートフォン向けのWebページで50の被リンクを獲得し、PC向けのWebページで40の被リンクを獲得した場合、Webページの内容は同じでもSEO評価はURLごとに分散してしまいます。レスポンシブのWebページならURLが1つなので、合計した90の被リンク分のSEO評価を得られることになるのです。レスポンシブは、同一のURLで管理できるため、SEO評価の分散を防げる点もメリットです。

コストが削減できる

レスポンシブは、Webページの制作コスト削減にもつながります。
レスポンシブ対応していないWebページは、PC向け、スマートフォン向けとそれぞれ作成する必要があります。
PC向けとスマートフォン向けの2つのWebページを作成する場合は、2つのファイルを作成する必要があるのです。レスポンシブは1つのWebページで管理するため、1つのファイル作成で済みます。
自社でWebページのデザインをする場合は、工数削減につながります。Webページのデザインを外部に委託する場合は、制作費の削減も可能です。

レスポンシブ用のCSS記述が必要

レスポンシブは、PC専用やスマートフォン専用Webページの作り方と少し異なります。
WebページのデザインはCSSという言語で指定されます。たとえば、Webページの文字サイズや背景の色などの見た目部分は、CSSの記述により設定されているのです。
レスポンシブは、1つのファイルで、さまざまな端末からのアクセスに最適化されるように作成します。レスポンシブ対応していないスマートフォン専用のWebページを作る際は、スマートフォンの画面サイズに最適化したデザインを作ればいいため、文字サイズやデザインの幅なども調整しやすいです。
レスポンシブでは、複数の端末に最適化されるよう、文字サイズやデザインの幅などを指定する必要があります。
デザインのサイズ指定を行う単位も、pxではなく%やemなどを使った方がいい場合もあるでしょう。
レスポンシブ用の記述に慣れていないと、作業工数がかかってしまう点はデメリットと言えます。

デザインの自由度が下がる

レスポンシブは、デザインの自由度が低い点がデメリットです。
レスポンシブ対応していないWebページであれば、PC向けとスマートフォン向けのデザインを大きく変えることができます。
たとえば、PC向けのWebページを作る場合、PC用のレイアウトにすることも可能です。
しかし、レスポンシブは1つのデザインで、端末によって幅などが変わることくらいしかできません。
レスポンシブは、端末によって見た目を大きく変えることはできないのです。

端末サイズによってデザインが崩れることも

レスポンシブのWebページでも、アクセスする端末によってデザインが崩れて見えることがあります。
レスポンシブは、PCやスマートフォンなどの端末サイズを想定してデザインを構成します。
レスポンシブではブレイクポイントが重要です。ブレイクポイントとは、Webページにアクセスする端末の画面サイズによってデザインを切り替えるポイントのことです。
レスポンシブでは、ブレイクポイントで指定するサイズに該当しない端末からアクセスがあった場合、デザインが崩れてしまうのです。