1657 更新日

レスポンシブWEBデザインとは?特徴・メリット・デメリット

レスポンシブWEBデザインとは?特徴・メリット・デメリット

レスポンシブWEBデザインの特徴

レスポンシブwebデザインの例

一言で言うと上記アニメーション画像の様に幅により可変するWEBページのことです。

がっくり青ざめるfoolfool

最初僕はレスポンシブルと読んでいました、「レスポンシブ」なんですね、最近では略してRWDなんて呼び方もあります。恥ずかしい〜

レスポンシブWEBデザインのメリット

  • 管理が楽
  • スマホ・PCどちらも1つのソースで対応
  • ディバイスが変わっても崩れない
  • 検索エンジン大手推奨

本当は複数呼び名があります。フレキシブル・リキッドWEBデザインとも似ていますが、最近は全ディバイスに向けた1ソースで管理するWEBデザインをレスポンシブと呼ぶ傾向があります。

スマートフォン対応の今と昔

レスポンシブが主流になる前はスマートフォン専用のソース、PC用のWEBページ用のソースの2つが必要でした。

レスポンシブと従来のWEBページのソースの違い
笑顔のfoolfool

つまり、何らかの更新があった場合は昔は2つのソースの変更が必要だったのですが、レスポンシブは1つの更新で良くなったのでミスも少なく楽になりました。

レスポンシブWEBデザインのデメリット

  • 工数がかかる
  • ソースが長くなる
  • cssの豊富な知識が必須

最近では本当に主流になり、昔は制限が結構ありましたが、通常サイトと同一の動作も可能になった分、高度なコーディング(WEBページ化)技術が求められます。CSS(WEBデザインのスタイルを指定する言語)のより深い知識が無いと膨大なソースになって読み込みスピードに影響を与えてしまいます。

なぜ、レスポンシブが主流になったのか?

レスポンシブが主流になった背景にはWEBサイトを見るほとんどの人がスマートフォンからのアクセスになったからの様です。

つまり、スマホが主流=効率よく管理できて崩れないデザインが必要になった。という経緯があるのかもしれません。

スマートフォンの画面の大きさは機種によって異なるし、ipadなど様々なディバイスがあるため、可変する1ソースで管理できる効率のいい、WEBページが必要になったのです。

超笑顔のfoolfool

僕のこのブログもレスポンシブデザインで作成しています。

今後の主流はAMPとRWDの複合WEBページ

AMP(Accelerated Mobile Pages )とは、googleが中心に開発しているモバイル環境でも高速にWEBページを読み込む仕組みです。

スマートフォンがなくならない限り、AMPページが主体になる可能性が高く、更に進化していくことでしょう。

今後プログラミングの知識もある程度有するWEBデザイナーが活躍すると感じています。

考えるfoolfool

僕が転職仕立ての頃はHTML5がで始めた時で、レスポンシブは流行っていなかったのですが、独学で習得しました。実を言うとチコデザもAMP対応済みです。
わずか数年の間にどんどん進化していますね〜

この記事をシェアする

foolfool

専業イラストレーターが
ご希望のイラスト描きます!

「こんなイラストが欲しい・・・」
お任せ下さい!
ご希望のイラスト描きます

似顔絵・キャラ制作・商品パッケージイラストやロゴ
ご要望に合わせたイラスト制作承ります。
クラウドソーシングで安心取引可能です。

  • おしゃれな線画のイラスト

    おしゃれな線画イラスト

    シンプルで細い線で描くしゃれなモチーフ。特別な記念品やプレゼント・ラベルデザイン・ブランドロゴ、観賞用にもおすすめ!

    細くておしゃれな線画のイラスト

    4000円〜

    パッケージを見る
  • シンプルな動物の線画描きます

    シンプルな動物の線画イラスト

    目を引く動物のイラスト、チームや企業のブランドロゴや商品のパッケージのシンボルに!シンプルで高級感あるイメージにも。

    商品ラベル・アイコンチームのロゴに

    4000円〜

    パッケージを見る
  • 墨絵イラストを依頼

    躍動感溢れる墨絵を描きます

    躍動感溢れる墨絵のキャラクター描きます。侍・戦国武将・筆のタッチのキャラクター制作が人気です。著作権譲渡・商用利用可能です。

    和風アートの墨絵

    12000円〜

    墨絵の例を見る
  • フリーイラストを商用利用依頼

    フリーイラストを商用利用

    すでに公開しているフリー素材を商用利用したい方へおすすめ!illust.NOを控えていただきお問い合わせフォームよりリクエスト可能。

    illust.NOからリクエスト

    3000円〜

    フリー素材を探す

受付中のパッケージを見る

イラスト制作一覧へ