レスポンシブウェブサイトとは何?

アダプティブウェブサイトと何が違う?

 

ウェブサイトを作る時反応型、適応型がありますが、

一体何が違ってどれがもっといいのですか?

ウェブサイトはもはやデスクトップブラウザだけの領域ではありません! 

最近はモバイル、タブレット、ノートパソコン、

デスクトップなど様々な機器からアクセスできます。 

これらのさまざまな機器でユーザーに同じ経験を提供することは非常に重要です!

このため、

ウェブ開発者は反応型ウェブと適応型ウェブを

適切に使用してウェブサイトを制作しています。

 

さて、こんなに重要なことがわかりました!
では、何が違うのでしょうか?

 

レスポンシブウェブサイトとは?

 

 

機器のサイズと解像度に応じてレイアウトが自動的に調整されるウェブ

 

ウェブサイトのデザインが流動的に変化し、
ユーザーにどのデバイスでも最適な経験を提供します。
このため、反応型ウェブはメディアキュリー(Media Query)と

流動型グリッドシステム(Fluid Grid System)
などの技術を用いて、ユーザが接続した機器の大きさや解像度に応じて

ウェブサイトのレイアウトを最適化します。

 

解像度別に画面を細かく定義しなければならないため
初期企画段階で多くの時間がかかり、
マークアップ作業時、固定されたpx値ではなくem、rem、%のように
パーセンテージ値で作業する必要があります。

 

 

アダプティブウェブサイトとは?

 

 

モバイル、デスクトップなど各デバイス別に独立したテンプレートを作成し、
各デバイスに合ったページを別途制作してランディングされるウェブ

 

PCとモバイルのリンクが独立して作られているため、ブラウザがサーバに
要求した情報を分析し、機器の画面サイズや解像度、

ユーザーの位置などを考慮して適切なレイアウトを提供します。

 

適応型ウェブはサーバ側で制御されるため
ブラウザのサポートが必要なく、
適応型デザインを適用するためには、サーバ側で
ユーザーのリクエストに対する処理を行う必要があります。

 

 

反応型と適応型の違いとは?

 

反応型

1.ウェブサイトで使われるすべてのコンテンツをダウンロードした後
現在の解像度に合わせて画面がランディングされる。

2.モバイルで接続してもパソコンとモバイルのリソースを

すべてダウンロードするため、ロード速度が遅い。

3.すべての機器で1つのテンプレートとして適用される。

 

適用型

 

1.感知されたデバイスに合う必要なコンテンツだけをダウンロードした後、

画面がランディングされる。

2.必要なコンテンツだけダウンロードするためローディング速度が速い。

3.提供するデバイスに適した数だけの独立したテンプレートを適用する。

 

 

結論

デザインの目的と開発者の技術水準によって選択が変わらなければならないため、

二つのうちどれがより良くて悪いとは言えません。

 二つのシステムをよく比較してみてどれがもっと合うか選択した方が良いでしょう。