【コラム】

クリエイター業界最前線

11 HTML5で変わるWebデザイン

栗谷幸助
 
  • >
  • >>

11/11

デジタルハリウッド専任講師の栗谷幸助です。7月から始めさせていただいたワタクシ担当のコラムも最終回を迎えました。今回は「Web制作において現在使われている技術、そしてこれから使われていく技術」について紹介をしていきたいと思います。

Web制作において現在使われている技術

第8回コラム「Webデザインの流れを料理番組風にわかりやすく紹介!」では、Webデザインの一連の流れと、使用をする材料・道具などについてお話をいたしました。また その中で、Webページはページの土台となる「HTML」と見た目やレイアウトを整える雛形文書である「CSS」で構成されていることもお話いたしました。

では、HTMLとCSSさえ使用すればWebサイトを作成することが出来るのか? 答えは「△」です。もちろん、HTMLとCSSのみでWebページを作成し公開することは出来ます。ただ、昨今のWebサイトは画像や文字のみならず、動画やアニメーションで見た目の動きを持ったページも多くなってきています。それにはFlashというアニメーション技術やWindows mediaやQuicktimeといったストリーミング技術が使われ、これらを使用する機会も多いのが現状だと思います。

また、Webページに「動きを持たせる」という意味では、「静的なサイト・動的なサイト」というキーワードも思い起こされます。現在 ワタシたちが目にするWebサイトの多くは「動的なサイト」として構築されています。勘違いをされている方も多いのですが、「動的なサイト」とは前述をした「見た目の動きを持ったページ」を指すものではありません。

動的とは「Dynamic」であり、Webページにユーザーがアクセスをした際に、ユーザーのアクセス状況に合わせて"ダイナミック"にWebページを生成する、と言った意味を持っています。例えば、検索サイトでユーザーが入力をした検索ワードをもとに、それぞれのユーザーに対して検索結果のページを表示する、というようなことです。Webサイトにこのような動きを持たせるためには、PHPやPerlなどのWebプログラミング言語、JavaScriptとXMLを組み合わせて使用する技術であるAjaxといったものを使用していくことになります。

また、Webプログラミング言語などを使用して、望んでいる動きの全てを構築するのではなく、ある一定の動きを持った機能をライブラリとして共通で利用できるようにしたものであるAPIを組み込んでいくことで、動的なサイトを構築していくこともあります。そのほか、Webサイトの構築・管理自体にMovable TypeやWordPressといったブログツールを使用することもあります。

このように、現在のWebサイトは様々な技術の集積によって構成されています。表現の幅を拡げていくためには、これらの技術をひとつひとつしっかりと身につけていく必要があるでしょう。

ちなみに、静的なサイトとは「静的=Static」、つまりは主にHTMLとCSS使用し、こちらで用意をした情報を整然と表示するWebページを指すことを付け加えておきます。

これから使われていく技術とは

それでは、Web制作においてこれから使われていく技術とは何なのでしょうか。いま、各メディアなどで取り上げられているものとしてはHTML5が熱いのではないでしょうか。

HTML5とは、HTMLの5回目の改訂版にあたるものです。これまでのように情報をマークアップし、文書構造化していくことと合わせて、これまではFlashやSilverlightなどのようにプラグインを必要としていたようなWeb表現を、プラットフォームとしての機能やマルチメディア要素をHTML自体に実装することで置き換えていくことを想定したものになります。すでにW3Cによりドラフト(草案)が発表されており、2012年には正式に勧告される予定です。様々なWebブラウザも段階的に対応してきていることもあって、注目を集めています。

では、HTML5がすぐさま制作現場で使用されていくような状況になるのでしょうか? そして、Flashの使用はなくなってしまうのでしょうか?

前半にも述べた、いまでは当たり前のように使用されるようになったCSSですが、この技術は2000年代半ばくらいから本格的にWeb制作に使用されるようになりました。ところがCSSという技術自体は1990年代後半にはW3Cより勧告がなされていました。

では、なぜ実際の現場での使用に数年のタイムラグが生まれてしまうのか? それはWebブラウザの対応の状況もあるかと思います。また これまでの慣れ親しんだ制作方法から無理をして変更をする必要がないという意識の問題もあったかと思います。

2000年代半ばくらいにブログツールが登場してきました。ブログを使用すると、Webサイトを運営する側はWeb制作に関する細かな知識を持つ必要がなく、掲載をしたい情報を入力しさえすれば、あとはブログ側で処理をし、Webページとして公開をしていくことが出来るようになりました。手軽にWebサイトの更新が出来ること、検索サイトとの親和性が高いことなどのさまざまな理由もあり、個人サイトのみならず企業サイトなどにもブログが幅広く使用されるようになっていきます。

そして、徐々にブログツールによるWebサイトの制作案件が増えてくる中で、ブログはその見た目やレイアウトの制御にCSSを使用していました。制作者にCSSを使用しなければならない状況が生まれ、そして使用することでメリットを実感できるようになったことで、CSSは普及していきました。

このように、ひとつの技術が一般化するためには、環境の整備と使用を促すような利用方法が揃わなければなりません。HTML5については、Webブラウザの対応など環境が整ってくる中で、その使用を促すような利用方法やコンテンツがいかに登場してくるのかで、現場に浸透してくる時期が変わってくるでしょう。それが来年なのか、3年後なのか、5年後なのか? 興味を持って見守っていきたいですね。

そして、今までの技術と同様、ワタシたちはそれを身につけていかなければなりません。いつでも勉強ですね。古いものには敬意を払い、新しいものに対しては大いなる好奇心を持って、共にクリエイティブな活動をしていこうではありませんか!

  • >
  • >>

11/11

インデックス

連載目次
第11回 HTML5で変わるWebデザイン
第10回 Webクリエイターのホントの年収を大公開!!
第9回 Web業界の職種とその役割とは
第8回 Webデザインの流れを料理番組風にわかりやすく紹介!
第7回 3D立体映像を専用メガネなしで観る方法とは?
第6回 ついに家庭でも3D立体映像が視聴できる環境に -3Dテレビの仕組みとは
第5回 映画『アバター』などで好評な3D技術、映像が立体的に見える仕組みとは?
第4回 海外で成功した日本人CG・VFXクリエイターの事例を紹介
第3回 CG・VFXクリエイターは儲かるの? -CG・VFX業界の雇用形態と平均給与
第2回 "CG・VFXクリエイターになるのは難しい"というのは、本当なのか?
第1回 映像クリエイターで生きていく、そのために習得すべき技術CG・VFXってなに?

もっと見る

転職ノウハウ

あなたが本領発揮できる仕事を診断
あなたの仕事適性診断

シゴト性格・弱点が20の質問でサクッと分かる!

「仕事辞めたい……」その理由は?
「仕事辞めたい……」その理由は?

71%の人が仕事を辞めたいと思った経験あり。その理由と対処法は?

3年後の年収どうなる? 年収予報
3年後の年収どうなる? 年収予報

今の年収は適正? 3年後は? あなたの年収をデータに基づき予報します。

激務な職場を辞めたいが、美女が邪魔して辞められない
激務な職場を辞めたいが、美女が邪魔して辞められない

美人上司と可愛い過ぎる後輩に挟まれるエンジニアの悩み

人気記事

一覧

イチオシ記事

新着記事

マツダ、タイのパワートレイン工場に221億円投資 - 生産能力を増強
[18:01 8/30] テクノロジー
洋楽人気対決 - ブラックモアズ・レインボー 40歳以上限定
[18:00 8/30] エンタメ
佐々木希、連続殺人鬼として再登場 - 波瑠と横山裕は警戒してホテル生活へ
[18:00 8/30] エンタメ
理研と産総研、包括的連携に関する基本協定を締結 - 2050年の課題解決に挑む
[17:57 8/30] テクノロジー
デノンの新作イヤホン3機種を聴いてきた - 新たな最上位ヘッドホンやBluetoothイヤホンの参考展示も
[17:47 8/30] スマホとデジタル家電

求人情報