Chrome+HTML5 Conference プログラム
今回のカンファレンスでは、2つのトラック（デザイナートラック/プログラマートラック）とハンズオンを開催します。
基調講演 (9:30-10:00) 会場：Yedo Cafe
| 基調講演 | ||
|---|---|---|
| 及川 卓也（グーグル株式会社)／白石 俊平（HTML5 Developers JP） | 資料 動画 | |
デザイナートラック (10:00-16:45) 会場：Hanabi
マークアップエンジニア/デザイナーの方を対象としたトラックです。HTML5の基礎知識からタグの使い方、CSS3によるデザイン、SVGなどに関するセッションがあります。
| HTML5/Web標準オーバービュー (10:00-10:45) | ||
|---|---|---|
| 深見 嘉明 (W3C/Keio) 白石 俊平 (HTML5 Developers JP) |
HTML5と関連APIにおける意義と概要を、ポイントを絞って紹介します。セッションの前半はW3C深見さんにお越しいただき、普段なかなか接することのない「W3Cの視点」から標準を語っていただきます。 | 資料 動画 |
| HTML5マークアップの心得と作法 (11:00-11:45) | ||
| 羽田野 太巳 (futomi) | HTML5のマークアップの特徴を一言で表すとすれば「セマンティクス」。それ故に、HTML5では文脈に合わせてマークアップしなければいけません。もはや、マークアップは単純作業ではなくクリエイティブなものになっているのです。マークアップにも心得と作法がよりいっそう重要になってきています。本セッションでは、HTML5仕様ではマークアップに何を求めているのか（心得）、そして、我々はどのようにマークアップをすべきか（作法）、について具体的に解説します。 | 資料 動画 |
| 実践CSS3デザイン (13:00-13:45) | ||
| 小久保 浩大郎 (グーグル株式会社) | CSS3を使うと、従来は組むのが大変だったデザインや、JSが必要だったアニメーションなどを簡単に実装することができます。モバイルデバイスなどのしかし一方でCSS3に対応してないブラウザのことを考えるとまだ使うのに尻込みしてしまうこともあるかと思います。このセッションでは、Graceful Degradationの考え方を導入しながら、ウェブデザインの中で実際にどんな風にCSS3を使っていけばいいかを紹介します。 | 動画 |
| スマートフォン向け開発 (14:00-14:45) | ||
| Yuji Sunouchi (グーグル株式会社) | スマートフォンのブラウザは小さなディスプレイ、ネットワークの遅さなど、ページを作るにあたり、色々考慮しなくてはいけないことがあります。このセッションでは綺麗で高速なスマートフォンに最適化されたサイトを作るためのノウハウやツールを紹介します。 | 動画 |
| Dive into SVG (15:00-15:45) | ||
| 外村 和仁 (株式会社ピクセルグリッド) 小山田 晃浩 (株式会社ピクセルグリッド) |
HTML5の注目ともに、ブラウザの対応状況などの効果も相まって、SVGも再注目されてきています。 基礎編と応用編に分け、基礎編ではSVGを全く知らない人でも一からSVGがわかるように、SVGの特徴や基本的な記述などについて解説します。 応用編ではSVGを使ったインタラクティブなコンテンツやUIを作るためのアニメーションやフィルターなど、少し高度なSVGの技術について紹介します。 |
資料 動画 デモ |
| 今から使える!? HTML5 (16:00-16:45) | ||
| 矢倉 眞隆 | HTML5の実装が進んでいる中、多様なブラウザに対しどのように対応していくかが課題となっています。このセッションでは、いくつかの対応指針を紹介したうえで、Modernizrとpolyfillsを使ったRegressive Enhancementという考え方について説明します。 | 資料 動画 |
プログラマートラック (10:00-16:45) 会場：Yedo Cafe
JavaScriptプログラマーの方を対象としたトラックです。Chrome Web Store、Chrome Developer Toolsの紹介に加え、HTML5を使ったウェブアプリ開発、高速化テクニックなどに関するセッションがあります。
| Chrome Web Store入門 (10:00-10:45) | ||
|---|---|---|
| あんどうやすし (mixi) | ウェブアプリはこれまで標準的な課金や周知の手段がなく、一部サイトを除き収入のほとんどを広告収入に依るしかないのが現実でした。Chrome Web Storeはそういった状況を一変させ、ウェブを受益者負担の健全なアプリケーションプラットフォームへと生まれ変わらせてくれる可能性があります。本セッションではChrome Web Storeについて、なにが新しいのか、なにができるのか、どうやればいいのか、などについて説明し、Googleの考える未来のウェブを第三者の視点から考察します。 | 資料 動画 解説 |
| Debugging on Chrome Developer Tools! (11:00-11:45) | ||
| 北村 英志 (グーグル株式会社) | フロント開発のデバッグツールは今のままで十分ですか？Chrome Developer Toolsも試してみてください！このセッションではChrome Developer Toolsのエッセンスをご紹介します。 | 動画 |
| WebSocketでリアルタイム通信 (13:00-13:45) | ||
| 小松 健作 (NTTコミュニケーションズ) | Webアプリの可能性を飛躍的に向上すると話題のWebSocket。Webでのリアルタイムサービスが可能になります。一方で、通信プロトコルという分かりづらい部分の新たなAPIのため、全体像を掴みづらいのも事実です。そんなWebSocketをメインに、HTML5のコミュニケーション系APIにより「何が変わるのか？」「どんなメリットが得られるのか？」具体的なWebアプリを用い紹介します。 | 資料 動画 |
| ウェブアプリの道も一歩から ～はてなブックマークの場合～ (14:00-14:45) | ||
| 長山 武史 (はてなブックマーク ディレクター) 外山 真 (はてなブックマーク エンジニア) |
5月リリースした、Chrome ウェブアプリ「はてなブックマーク」がどのようにHTML5のAPI活用し、どういったフローで開発したか担当ディレクターとエンジニアが解説します。 | 資料 動画 解説 |
| 実践・ウェブアプリ高速化テクニック (15:00-15:45) | ||
| 太田 昌吾 (クックパッド) | ユーザーは高機能で使いやすく、高速なウェブアプリを望んでいます。現実にそれらすべてを満たすことは極めて困難な課題といえるでしょう。しかし、高速化についてはいくつかのポイントを抑えるだけで劇的な改善が望めます。本セッションでは、ライブコーディングを行いながら、ウェブアプリの高速化テクニックをChrome Developer Toolsで実証しながら紹介していきます。 | 資料 動画 |
| HTML5パネルディスカッション (16:00-16:45) | ||
| 新野 淳一 (Publickey) 及川 卓也 (グーグル株式会社) 白石 俊平 (HTML5 Developers JP) 小久保 浩大郎 (グーグル株式会社) 深見 義明 (W3C/Keio) |
Publickeyの新野淳一さんを司会に、HTML5最前線の人たちによるパネルディスカッション。 | 動画 |
ハンズオン (13:00-16:45) 会場：Kabuki
「HTML5/CSS3/JavaScriptを用いたリッチUI Webサイト製作に興味はあるけど、詳しくは分からない」そんな方のために2つのハンズオンを開催します。
| JavaScript初心者のためのSVG／Canvasアニメーション入門 (13:00-14:45) | |
|---|---|
| 羽田野 太巳 (futomi) | CanvasとSVGを通してJavaScriptコーディングを体験する初心者向けハンズオンです。ひとつの題材を、Canvasで作るチームとSVGで作るチームに分かれて、時間内に作って頂きます。コーディングの前にはCanvasとRaphaelの使い方を簡単に説明します。SVGでは、XMLマークアップではなく、RaphaelというJSライブラリーを使ったJavaScriptコーディングを行って頂きます。このハンズオンを通して、それぞれのテクノロジーの違いについても理解することができるでしょう。 |
| CSS3のハンズオン (15:00-16:45) | |
| 一條 美和子 (産経デジタル) | CSS3+JavaScriptでユーザー入力フォーム画面を作成する、CSS3&JavaScript初心者向けハンズオンです。 コーディングは各個人のペースで進めていただきます。 前半：CSS3を使ってのUIパーツ作り、少量のJavaScriptで動きを出すコーディングの解説と練習 後半：UIパーツを組み合わせて、ユーザー入力フォーム画面コーディングにチャレンジ この内容を通して定番のデザイン、アニメーションなど体験します。合わせて、少しのJavaScript追加でスムーズなUIパーツができることを知っていただくことができるでしょう。 |
懇親会 (17:30-) 会場：Yedo Cafe
| ライトニングトーク大会 | |
|---|---|
| モデレータ： 河内 典子 (アイティメディア) | |