ON HTML5 FIELD 第5回（後編）
ON HTML5 FIELD 【第5回】（後編）Webデザイナーの現場とHTML5
2011年12月08日
TEXT：村岡正和
HTML5によって表現の幅が広がると同時に、クライアントからの要求水準も高くなるだろう。Webデザイナーは馴染みが薄かったタイポグラフィや、際立ったアプリケーションUIデザインを実装するために、インダストリアルデザインを学ぶ必要があるかもしれない。今、Webデザイナーは新たなスキルを習得する必要がありそうだ。
>>> 全記事目次はこちら（HTML5関連求人情報も掲載）
■Webデザイナーが押さえておきたい制作ノウハウ
次に、Webデザインの勘所とも言える制作ノウハウについて考えてみよう。前編でも触れたが、今後タイポグラフィについての高度な知識が求められてくるのではないかと思う。WebFontsの活用によって、Webデザイナーはページの文字装飾に配慮しやすくなる。配慮するからにはそれなりの知識が前提になければならない。
Webデザインでは、紙面のデザインに比べて行間、文字間の調整をあまり気にしなかった。WebFontsの登場まではフォントを選択する自由がなかったのと、ページの表示サイズが固定できない、一行あたりの文字数が固定できないなど、紙面にはない条件があるのが一因と考えられる。一昔前のWebページではフォントは表示するPCで既定のもの、行間や文字間はWebブラウザの規定値を使うのが主だった。
現在ではCSSの普及により、line-heightやletter-spacingを使ってある程度厳密な文字組が実現できるようになった。しかし、相変わらずPC規定のフォントを利用する環境下では、文字組に時間を費やすことに必要性を感じていないWebデザイナーも多いのではないだろうか。
WebFontsが普及してページに合ったフォントを自由に選択できるようになると、文字組の重要性が増してくる。それに伴い、クライアントからのタイポグラフィに関するハイレベルな要求も増加するだろう。これに応えるためには、今まであまり馴染みのなかったタイポグラフィについての知識も必要になってくるかもしれない。HTMLエンジニアやプログラマーからWebデザイナーになった方々は、特に注目してよいところだろう。
今日のWebコンテンツには、大きく2つに分けられると思う。ひとつは平たく「ホームページ」と呼ばれる企業紹介や広告、ニュースなどのWebサイト。もうひとつは「Webアプリケーション」だ。HTML5はWebアプリケーション・プラットフォームと言われるようにWebアプリケーション開発に強力な機能を備えている。HTML5制作がWebアプリケーションに寄ってくるのに従って、WebデザインにおいてもアプリケーションUIデザインの側面が際立ってくる可能性が高い。
Webアプリケーションデザインは、エディトリアルデザインよりインダストリアルデザイン（工業製品デザイン）に近いと筆者は考えている。エディトリアルデザインでは見た目の美しさはもちろんのこと、使い勝手の良さ（ユーザビリティ）を重視する。HTML5が普及し、同じような機能をもつWebアプリケーションが乱立するようになると、カッコよくて使いやすいものだけが生き残るようになるだろう。
現在でもiPhoneアプリやAndroidアプリの開発者から「売れるか売れないかはUIで決まる」という話をよく聞く。モバイルアプリの世界では、ダサいアプリは売れないそうだ。モバイルアプリがHTML5化していくに従って、Web業界でも同じことを聞くようになるだろう。Webアプリケーションの売上は、Webデザイナーの腕で決まる。そんな時代になるかもしれない。それに備えてインダストリアルデザイン等を学習し、Webアプリケーションのデザインを研究することもまた、スキルアップに繋がるのではないだろうか。
まだまだ語り尽くせないことがあるが、誌面に限りがあるので残りは次回以降折々触れていきたいと思う。結論として、HTML5制作でWebデザインの可能性は広がった。その分それを十分に実現するために、Webデザイナーは新たなスキルを身につける必要がありそうだ。
次回は、Webプログラマーがおさえておきたいポイントを考えてみることにする。
［筆者プロフィール］
村岡正和（むらおかまざかず）●神戸でITシステム開発、コンサルティングを手掛けている。HTML5-WEST.jpの代表として関西でHTML5関連の話題を盛り上げる活動を行っているほか、さまざまなコミュニティ活動に関わっている。
HTML5-WEST.jp：http://www.html5-west.jp/
Twitter：http://twitter.com/#!/bathtimefish
HTML5の最新情報が学べるセミナー
「For Web Designer and Web Developer HTML5 Work Up Seminar」
主催：株式会社パソナテック 費用：無料 場所：東京都千代田区大手町2-6-4
詳細はこちら http://www.pasonatech.co.jp/ca/html5/
MULTIMEDIA編 12月13日（火）19:00-21:00
【内容】音声、動画、メディアの再生と操作
【詳細および申し込み】http://www.pasonatech.co.jp/event/index.jsp?mode=2&d=on&no=3238
OFFLINE & STORAGE編 12月20日（火）19:00-21:00
【内容】Webアプリケーションにおけるデータ蓄積
【詳細および申し込み】http://www.pasonatech.co.jp/event/index.jsp?mode=2&d=on&no=3239
>>> 全記事目次はこちら（HTML5関連求人情報も掲載）