『CSS, JavaScript, HTML を利用したiPhone & Android アプリケーションの構築』：11月13日（土）9：30～17：30

ジョナサン・スターク：Jonathan Stark

携帯電話の普及により、情報へのアクセスが容易になりました。モバイルテクノロジーは私たちの世代が成し遂げた大きな業績と呼べることができますが、未だにモバイルWebは発展途上期といえます。テクノロジー、経済、世相のうつりかわりなどから、今まで以上に混沌としたプラットフォームの乱列を生み出しているのは事実です。これから数年間に渡り、モバイルの世界はより混沌としたものになるでしょう。

しかし、こうした中、企業は「限らせた予算でより多くのユーザーにどのようにリーチするか」という難しい課題に立ち向かわなければなりません。この応えになるのが Web の技術を利用することです。HTML5とモバイルデバイスが実装している機能やソフトウェアを組み合わせることで、経験が浅い開発者でも世界規模で利用してもらえるようなアプリケーションを構築することが出来ます。

Webの未来はモバイルです。そして未来のモバイルは Web です。Web の技術に長く携わっている私たちだからこそすぐに初めてみるべきとは思いませんか？

学習できること

• モバイル機器のインターフェイスガイドライン
• 上級者向け CSS3 スタイリング
• CSS3 transforms, transitions, animations
• HTML5 を利用したオフライン iPhone & Android Web アプリ開発
• PhoneGap を利用した iPhone & Android Web アプリ開発

対象

Web デザイナーや Web 開発者モバイルアプリケーションの構築に興味のある方向けです。 HTML, CSS, JavaScript の基本を知っているとより深く理解出来ますが、必須ではありません。

リンク

• ジョナサン・スタークのスピーカープロフィールとセッション情報
• WDE2010ブログ：スピーカー紹介: ジョナサン・スターク (Jonathan Stark)

『セマンティックと構造を意識したHTML5サイトの構築』：11月13日（土）9：30～17：30

ブルース・ローソン：Bruce Lawson

Webサイトはコンテンツの意味を定義するマークアップによって構成されています。魅力的な見た目も、スクリプトを利用したインタラクションもすべてマークアップが基礎となり構築されているわけです。Webのオープンスタンダードを意識したコーディングは、限りなくたくさんの人に、そしてより多くのデバイスを通して Webサイトへアクセスしてもらうことを可能にします。古いブラウザはダウングレードしたデザインになったとしても情報にはアクセス出来るような工夫は必要ですし、何よりもこれから登場する未来のブラウザで壊れないようにしなければいけません。オープンスタンダードは検索エンジンへの対策には不可欠ですし、PC, iPad そして冷蔵庫のような家電にまで広がる Web アクセスへの対応に繋がります。もちろん、JIS X 8341-3 への対応を含めたアクセシブルなサイト構築には不可欠です。

HTML5では新たに28の要素が追加されましたが、これらは一体どのような意味をもっているのでしょうか？どのように最適な要素を選び出し、組み合わせて行けば良いのでしょうか。ブルースはこれらの疑問に応えてくれるだけでなく、今からでも活用出来るノウハウを教えてくれます。HTML4 から変更されたものの中には仕事に大きな影響を及ぼす違いもあります。Web 上で公開されている HTML5 を利用した様々な試みをみながら、未来に何が待ち受けているのかを解説していきます。

学習できること

• HTML5要素の基本と使い方
• HTML5の構造要素のセマンティックについて
• HTML5アウトラインアルゴリズム
• ARIA と HTML5 を組み合わせたアクセシビリティ向上
• HTML5 フォームの使い方
• ビデオとオーディオの扱い方
• 古いブラウザ、モバイル機器などへの対応
• 今 HTML5 を利用するためのノウハウ

対象

アクセシブルで使いやすい Web サイトの制作を仕事にし、HTML5 に興味があるWebデザイナー。HTML4 か XHTML1 でのコーディングが出来る方で、コンテンツと見た目とインタラクションを分離して構築するという考え方が理解出来ること。HTML5 の知識は必要ありません。

リンク

• ブルース・ローソンのスピーカープロフィールとセッション情報
• WDE2010ブログ：スピーカー紹介: ブルース・ローソン (Bruce Lawson)

『jQuery と jQuery UI の講座』：11月14日（日）9：30～17：30

ジョン・レシグ：John Resig

世界中の多くの開発者が利用している JavaScript ライブラリ「jQuery」のコンセプトからコアな使い方までしっかり学ぶことが出来るワークショップです。ページの機能をコンテンツ (HTML) と見た目 (CSS) から切り離し、他のページレイヤーを触れずに jQuery と jQuery UI の特性を活かして記述する方法を解説します。

jQueryの基本だけでなく、中級・上級者向けの jQuery の特徴について幾つか紹介します。プログレッシブ・エンハンスメント (Progressive Enhancement) を意識して、1ページの Web アプリケーションを構築するためのノウハウを紹介。また、カスタムイベントやデータバインディングといった jQuery の機能を利用したアプリケーション開発の解説もします。

学習出来ること

• jQueryの基礎
• jQueryのコードをより最適化する方法
• jQuery UI を利用してカスタムインターフェイスを作る方法
• 自家製 jQuery プラグインを作る方法
• Progressive Enhancement デモと解説
• カスタムイベント、データバインディングといった上級ネタ

対象

JavaScriptの経験があるフロントエンドかプログラマー向けの講座です。例題やデモがが幾つかあるので、必ずノートパソコンを持参してください。

リンク

• ジョン・レシグのスピーカープロフィールとセッション情報
• WDE2010ブログ：スピーカー紹介: ジョン・レシグ (John Resig)

『使いやすい、美しいを実現する CSS3 活用講座』：11月14日（日）9：30～17：30

ステファニー・サリバン・ルイス：Stephanie (Sullivan) Rewis

デザイナーやアーティストに与えられた新しい表現方法、それが CSS3 です。先端を行くWebデザイナー達は CSS3 を既に使いこなしているものの、新しいシンタックスやブラウザ間の違いを考慮して制作するのは一筋縄にはいきません。CSS3を導入することでワークフローはどのように変化するのでしょうか？Web標準な技術を用いることで開発スピードとページの表示速度のどのような影響をもたらすのでしょうか？何が今使うことができるのでしょうか？どれはまだ導入せずに待つべきなのでしょうか？

このワークッショップでは、プログレッシブ・エンハンスメントの意味と、新しい CSS の力をすぐに導入するためのコツを学びます。また、コードを記述するのに便利なツール、特定の CSS をサポートしてないブラウザへの対処方法を幾つか紹介します。このセッションを通じて新しいWebデザインを学びませんか？

学習できること

• どのCSSが今使えるのか？
• 『プログレッシブ・エンハンスメント (Progressive Enhancement)』と『適切な低均化 (Graceful Degradation)』の違い
• 新しいセレクタの使い方
• 色と透過の使い分け
• Webフォントの導入方法
• 新しいテキスト効果
• CSSで影とグラデーションを付ける方法
• 背景と枠線の新しい表現
• CSSを利用した様々なアニメーション
• Media Query と可変レイアウト
• CSS3 のエフェクトを作り出すためのツール紹介

対象

このワークショップは CSS3 に興味があり、ワークフローの効率化を通してクライアントの満足度を上げたいという方すべての方に最適です。CSS3 に関する知識は必要ありませんが、CSS の基本は知っておく必要があります。Webデザイナーやフロントエンド・エンジニアで CSS3 のプロになりたいという方はこのワークショップの参加をお勧めします。

リンク

• ステファニー・サリバン・ルイスのスピーカープロフィールとセッション情報
• WDE2010ブログ：スピーカー紹介: ステファニー・サリバン (Stephanie Sullivan)