レスポンシブWebデザインを採用しようか迷ってます。というお問い合わせをよくいただきます。
メリットとしては、1ソースで管理ができる、Googleが良いと評価してくれているなどありますが、
デメリットもしっかりと見極めた上で採用していただけるきっかけになればと思いまとめてみたいと思います。
レスポンシブWebデザインが採用できない３つのパターンについてまとめました。
コンテンツが豊富で明らかに転送量の多さが気になるサイト
情報を多く含んだWebサイト。写真、文字、イラスト素材などあります。
その中でも多くを占めるのが写真素材です。
大きな素材の場合は、画面に表示するのに時間がかかったりします。
現在のdisplayは高解像度でかつ大型化の傾向にあります。
AppleのRetina displayは、通常の画像のピクセルを縦横に２倍にした大きさとなります。
15インチMacBook Pro で横幅2,880px 縦幅1,800px です。
このような大型スクリーンはさも特別のような感覚ですが、
Appleユーザー数はうなぎのぼりに増えていっています。
現在、よく売れているdisplayサイズは、1920×1080のフルHDと呼ばれるサイズです。
パソコンモニターにも積極的に採用され、かなり浸透していると思われます。
一般には、2560×1600なんて大画面もありますし、４K displayと呼ばれるサイズ（4096×2160）も登場しています。
このような大画面モニターに対応させようとすると、素材のサイズが自然と大きくなるのが摂理です。
ブラウザでアクセスしてから、読み込みが行われて表示されるまでに相当な時間がかかってしまうことが想定できます。
レスポンシブWebデザインで作られたWebサイトは、スマートフォンからPCブラウザまで同一の素材を採用するのが通例となっており（一部除外もあります）、
あまりにも大きい素材をスマートフォンなどのモバイル端末で読み込もうとすると、大変な時間がかかってしまい、負荷も増えるばかりです。
外出先などのLTE通信圏内の場合、あっという間に転送量がいっぱいになってしまうという懸念もあります。
こうした事態を招かないためにも、
レスポンシブWebデザインでサイト構築の場合は、素材の重さの吟味をしっかりと行なわなければなりません。
高品質な画像素材が必要なサイト（アート作品やフォトグラファーの個展サイト）
PCのディスプレイサイズでははっきりと人の顔の表情や文字が認識できるのに、
モバイル端末で確認すると、小さすぎて見えない。
このようなケースが少なからずあります。
だったらスマホ表示用に素材を用意して、PC表示用は非表示でよいのでは？と思われる方もいますが、
HTMLに記述したソースは、すべてが読み込み対象となります。
したがって、display:none; で非表示にしたところで意味がないのです。
そうならないためにも素材内のコンテンツは、しっかりと練ることが必要です。
PCで閲覧できるのは当然のことですが、スマートフォンのような小さなdisplayでも認識できるように素材を作らなければなりません。
素材内のコンテンツの吟味を欠かしてはいけないのです。
ピンチイン、ピンチアウト、横スクロールしないと閲覧できないサイト
業務系システムと連携しているWebアプリケーションは、
入れ子状態になっている複雑なテーブルが構築されている場合が多く、
仮にレスポンシブ対応したとしても、
画面が小さすぎるスマホサイトではピンチイン、ピンチアウト、横スクロールする必要がでてきます。
このような場合、レスポンシブWebデザインにするメリットがなくなってしまいます。
以上のことが当てはまるWebサイトの場合は、レスポンシブWebデザインでの構築は見送った方がいいでしょう。
しかし、メリットの方が比率が大きいとお考えの方は、ぜひレスポンシブWebデザインでWebサイトを構築してみましょう。
レスポンシブWebデザインについてもっと知りたいという方はこちらからお問い合わせください。