-本日のアジェンダ-
1限目
学科 CSS基礎②
マルチデバイスについて
2限目
学科 CSS基礎②
レスポンシブWEBデザインの現状
3限目
学科 CSS基礎②
Viewportについて
4限目
学科 CSS基礎②
実践トレーニング
5限目
学科 CSS基礎②
実践トレーニング
本日のテーマ
マルチデバイスの知識を深め、身につけましょう
マルチデバイスとは?
マルチデバイスとは、英語の「Multi Device」から来ています。その名のとおり、サービスやコンテンツ、ソフトウェアなどを共通して、等しく利用できる「さまざまなデバイス」のことを言います。
最近は、スマートフォン、タブレット、携帯ゲーム機、テレビなど、さまざまな情報デバイスが身近に使えるようになってきています。しかし、ひとつのコンテンツを、ひとつのデバイスでしか使えないのは不便です。
そこで、ネットワーク上のサーバーを利用して、複数のデバイス間でコンテンツを同期し、ユーザーが使いたい時や場所に応じて、利用するデバイスを変えても利用できるようにすることを「マルチデバイス化」「マルチデバイス対応」などと言います。
現在、通信事業者や、コンテンツプロバイダーはこぞって提供サービスやコンテンツのマルチデバイス化を進めています。
レスポンシブWEBデザインとは?
レスポンシブ(responsive)という用語には、敏感に反応するという意味があります。またレスポンスの言葉より派生しています。
できればコストをかけPCとスマホを別々のデザインで制作するのが、利用者には理想的です。ただこれではWebサイトの制作者にとって、Webサイト更新時のコストが2倍になり、運用を継続するのは難しくなりがちです。
そういった場合に、レスポンシブの考え方が役立ちます。PCなのかスマホなのか、Webサイトを利用する機器によってディスプレイの大きさが変わるため、どんな画面サイズでもわかりやすい画面表示が必要です。このように効率的に「切り替え」をする考え方や具体時な手法を、レスポンシブWebデザインといいます。
HTML 4からHTML5へ
1990年代初頭に、文字や写真のような動きのない情報をインターネットを介して交換するための手段として登場したのがWebです。しかし現在では、動画再生やビデオ会議、ゲームなど動きのある対話型のアプリケーションが動作するプラットフォームとして利用されています。
この仕組みを実現しているのが、情報を送り出すWebサーバと、その情報を表示するブラウザ、そして情報をやりとりする手順である通信プロトコルです。この組合せは1つではありません。例えば、ブラウザだけでも、MicrosoftのInternet Explorer、MozillaのFirefox、AppleのSafari、GoogleのChromeなどがあります。Webサーバや通信プロトコルにもいろいろなものがあります。
このような異なるソフトウェアを使ってもお互いに情報のやりとりができ、同様の表現ができるのは、情報の構造やブラウザへ表示方法を指定するHTMLが標準化され、共通に利用できるからです。
ところがこのHTMLは、1997年にバージョン4の「HTML 4」が定められ、1999年に「4.01」にマイナーバージョンアップされて以降、大きな改訂もないままに最近まで使われてきました。
その間、ネットワークの高速化やコンピュータの性能向上、GPSやセンサーが組み込まれたスマートフォンの出現など、当時とは利用環境が、大きく変わってしまいました。
この状況に対応するために、HTML 4はそのままに、動画や音声を再生するといったHTML 4に含まれない機能をプラグイン(Flashなど)といわれるソフトウェアを追加して補完してきたのです。
しかし、このような対処ではもはや限界が見えてきました。そこで、時代にふさわしい改訂が求められるようになり、次代を担う「HTML5」を定める取り組みが生まれたのです。
2014年10月、HTML5は、15年の歳月を経て新しいバージョンとして、W3Cより正式に勧告されました。
W3Cとは
W3Cとは「World Wide Web Consortium」の略称で、Web技術の標準化を行う非営利団体の名称です。W3Cはティム・バーナーズ=リーによって1994年に創設され、Webで使用される技術を標準化し、よりスムーズな開発や品質向上を目標に活動が続けられています。 現在はHTMLやXHTML、CSS、DOM(Document Object Model)やXML(Extensible Markup Language)など多くの仕様が公開されており、IT関連企業を中心として400近くの団体が会員として加入するほど大規模な団体へと成長しています。
W3Cの勧告
W3Cで行われる、Webの仕様を標準化させるために行われる審議・検討が「勧告プロセス」です。仕様決定の最終段階が「W3C勧告」とされ、そこに至るまでには「作業草案、最終草案、勧告候補、勧告案」とステップが存在し、段階的な審議を経てようやくW3C勧告へと至ります。
仕様標準化の最終ステップである「W3C勧告」では、W3Cが認める諮問委員会やチーム、ワーキンググループといった組織全体から十分な支持が得られたものとして、仕様・指針・要件から構成された文書がWeb標準として一般公開されます。
Webの制作現場を支えるWeb標準は、W3Cで綿密な勧告プロセスを経ることで生み出されたWeb制作における共通の指針です。W3CのWeb標準・仕様書は日本語化された内容も公開されていますので、一度目を通しておきましょう。
HTML4とHTML5の違い!修正箇所を理解してHTML5に移行しよう
https://haniwaman.com/html5/