Web関連

最新のトレンド?!アダプティブWebデザインについてあれこれ

0

こんにちは!すっかり寒くなりましたね。デザイナーの角田です。

さて、そろそろ2015年も終わりに近づいてきましたが、
皆さんはこちらの言葉を聞いたことがありますか?
最近知名度を上げてきた「アダプティブWebデザイン」です。
「アダプティブWebデザインとは何ぞや?」という方はさっくりとこちらの
コラムに書かれていますので、是非ご覧ください。

とはいえ、私も名前は聞いたことはあれど、
恥ずかしながら詳しくは知らなかったので色々と調べてみました。

まだまだ謎の多い?アダプティブwebデザイン

 

色々と記事を読んでみると、レスポンシブwebデザインとアダプティブwebデザイン、
この双方の定義の仕方について未だにネット上では議論されているようですね・・・。
似て非なるものではありますが、レスポンシブwebデザインもアダプティブwebデザインも
一緒くたにして「レスポンシブwebデザイン」と表現されているのが現状です。
ちなみに私のアダプティブWebデザインについての解釈は、
「画面の幅や端末・ユーザーの環境ごとに最適化されたHTML・CSSが用意されている」
です。
レスポンシブWebデザインは、「1つのソースで画面の幅に合わせてレイアウトを最適化する」ものですが
大きな違いとしては「複数のソースを用意する必要がある」という所でしょうか。

「じゃあ実際アダプティブwebデザインってどんなものなのよ?」
っていう人が多いのではないでしょうか。私もです。
まずそもそもの話をしましょうか。

そもそもアダプティブデザインとは

まずレスポンシブwebデザインとアダプティブwebデザインより上位の概念に、
「アダプティブデザイン」というものが存在します。
この概念の中に、レスポンシブwebデザインとアダプティブwebデザインが属されている、と考えた方が良さそうです。

「アダプティブwebデザイン」は、前述の通り
「画面の幅や端末・ユーザーの環境ごとに最適化されたHTML・CSSが用意されている」webサイトのことですね。
「アダプティブデザイン」の場合は、「web以外のコンテンツ」も関連してくるわけです。

実際の例を挙げると、「GoogleNow」というアプリが一番わかりやすそうです。
このアプリは名前の通り、GoogleからAndroidに向けて配信されているアプリです。
どういうアプリかというと、
「ユーザーの毎日、毎時間の行動を学習して、自動的にユーザーが欲しいと思われる情報を提供する」ものなのです。
ユーザーの起床時間には現在地の天気を知らせ、通勤時にはルートや混雑状況・次の電車がいつ来るのかを知らせ、
次の予定はどこで何をするのか、を知らせてくれる。
まさに「ユーザーの行動・環境ごとに最適化されたコンテンツを提供」しているわけです。
す、すごいなこのアプリ・・・!iOSに向けて配信はされないのでしょうか・・・待ってます、Googleさん。

具体的に

ということで、レスポンシブwebデザインもアダプティブwebデザインも、
ユーザーや環境に合わせてwebのコンテンツを提供する手法の1つなのです。
結論としては、「ユーザーの画面の幅」を優先するか、「ユーザーの環境」を優先するか、でしょうか。
奥が深そうです・・・。

今は圧倒的にレスポンシブwebデザインの方が認知度も高く、理解している人も多いですが
今後アダプティブwebデザインの理解が広まっていけば、用途によって使い分ける場合も増えるのでしょうね~。

例えば、「制限を設けないレイアウトにしたい」「1ページの情報量が多くなりそう」「更新頻度が少ない」等といった場合はアダプティブwebデザイン。
「色んなデバイスでキレイに見せたい」「更新頻度が多い」「管理を楽にしたい」等といった場合はレスポンシブwebデザイン。

ですね。

まとめ

いかがでしょうか。私もまだ探り探りのアダプティブwebデザイン、
これからもっと調べていく必要がありそうだなとひしひしと感じています・・・。

小さな脳みそをフル回転させて書き上げた角田がお送りいたしました。

ホームページ制作でお困りの方はホームページ制作会社ティファナにご相談ください!

お問い合わせはこちらから

関連するサービス

Webデザイン

デザインガイドライン作成

レスポンシブWebデザイン

UI/UXデザイン

0

料理レシピサイトでおなじみの「クックパッド」が結構すごかった前のページ

サイトを持つなら考えよう!UI/UXについて次のページ

ピックアップ記事

  1. AIに求められているものは、実は意外な物だった
  2. 新しい販売形態であるDtoCについて考えてみる
  3. 新型コロナウイルスで日本の働き方改革が起こる
  4. 大手企業も注目するMaaS(Mobility as a Service)とは何か…

関連記事

  1. Web関連

    【人工知能・AI×観光】迷子は人工知能で解決できる!

    観光地や街中で迷子を見かけたり、自分が迷子になった経験はありますでしょ…

  2. Web関連

    ユーザーの希望に応える応えるECサイト

    市場規模の広がるEC市場皆さんはECサイトを利用したことはありますか…

  3. Web関連

    インバウンド需要を囲め!多言語音声サービスを事例で紹介!

    訪日外国人観光客が増加の一途を辿る中で、とても大きな注目を浴びているの…

  4. SEO関連

    「とりあえずコンテンツを増やす」は危険!?パンダに負けないSEO対策とは?

    「パンダアップデート」という言葉を見聞きされること…

  5. Web関連

    関係あるのは映像業界だけじゃない!押し寄せる超・高解像度「4K解像度」の波!

    みなさんは「4K解像度」という言葉はもうご存知ですか?テレビなどの画面…

  6. SEO関連

    グーグルアルゴリズムとSEO

    先日、「Japan IT Week春」の展示会に参加しました。昨年…

おすすめ記事

最近の記事

  1. 人間拡張×AIで非接触なデジタル化を推進する
  2. ヘルスケアはAI先生にみてもらう時代
  3. withコロナは非接触技術で生活しよう!
  4. デジタル接客+AIで非接触を推進する
  5. 遠隔診療や遠隔医療普及のポイントはAIと5G

アーカイブ

  1. Web関連

    納期遅延しない!仕事の集中力を持続させるオススメお菓子
  2. AIさくらさん

    アフターコロナのニューノーマルはAI×非接触か?
  3. Web関連

    M2Mの加速化で運転手が居なくなる?
  4. Web関連

    ホームページ制作会社も注目するLINE公式アカウントがおもしろい!
  5. Web関連

    いまさら聞けないスマートフォンの基礎知識
PAGE TOP