CSS Nite ビギナーズ（東京版）セッション内容

CSS Nite ビギナーズ（東京版）のセッション内容と出演のプロフィールです。

2008年10月31日時点で最新のものです。変更の可能性があります。
いつもCSS Niteよりも休憩が少なめで、みっちり濃い6時間になりそうです。体調万全でお越しください。
タイムテーブルはあくまでも目安であり、当日の流れによって、調整しながら進行します。

時間	区分	内容	書籍	担当	時間
11:45		オープニング
12:00	第1部	XHTMLのキホン	1章	益子	30分
12:30		CSSのキホン	2章	鷹野	30分
13:00		マークアップ選びのコツ	4章	山田	30分
13:30		休憩（10分）
13:40		CSSレイアウト	5章	小林	30分
14:10		CSSデザインの実用テクニック	4章	山田	30分
14:40	休憩（20分）
15:00	第2部	XHTML+CSSキホンのワークフロー（Dreamweaverを使用）		千貫	30分
15:30		CSSデザインのブラウザ調整	6章	益子	30分
16:00		CSSセッティング	3章	堀内	30分
16:30	休憩（20分）
16:50	第3部	JavaScriptライブラリとCSS	8章	西畑	30分
17:20	第3部	多様なデバイスでのCSSデザイン	7章	伊藤	30分
17:50	エンディング
18:10	終演

次のようなセクション構成です。

第1部：基本からレイアウトまで、“素直なブラウザ”を前提に。
第2部：おおまかな流れを第1部の復習として。さらに、複数のブラウザを対象としてブラウザ調整や、リセット、CSS分割などについて。
第3部：JavaScriptライブラリとCSSの連携や使い分け。ケータイ、ゲーム、iPhoneなどを対象とした多様なデバイスへの対応について。

セッション内容、および、それぞれの時間は調整中です。

いま求められるXHTML+CSSスキル

セミナー独自コンテンツ

デバイスやブラウザの多様化など、Webデザイナーやコーダーを取り巻く環境の変化にともない、期待される役割、求められるスキルが大きく変わってきています。ここで自分のスキルをいったん「再構築」しておかないと、いま必要な制作環境やワークフローに対応するのは困難です。

CSSデザインをゼロからはじめる人も、最短距離で実務対応力とスキルセットの習得を目指しましょう。

デバイスやブラウザの広がり
制作環境の変化
制作ワークフローの変化
スキルセットの変化

益子貴寛（ましこたかひろ）

株式会社サイバーガーデン
代表取締役

1975年生まれ。早稲田大学大学院商学研究科修了。大学院在学中の1999年5月にWebリファレンス＆リソース提供サイト「CYBER@GARDEN」を立ち上げる。一般企業に就職後もWebデザイン誌での執筆やW3C仕様書の翻訳活動を続け、2003年5月に独立。Webサイトのプロデュースや戦略立案、制作業務、コンサルティング、Webクリエイター向けの講義やトレーニング、執筆活動に従事。

社団法人全日本能率連盟登録資格「Web検定」プロジェクトメンバー。
2008年8月より、金沢工業大学大学院工学研究科知的創造システム専攻客員教授。

主な著書に『Web標準の教科書』（秀和システム）、『スタイルシート・デザイン』（共著、MdN）、『変革期のウェブ』（共著、マイコミ新書）など。

XHTML+CSSのキホン

第1章、第2章をベースに。

XHTML+CSSで制作するとなるとCSSのテクニックばかりに目がいきがちです。しかし基本をしっかり押さえないままでいると、XHTML+CSSで制作するメリットを十分得られないばかりか、トラブル発生の原因になりかねません。本セッションでは、文書構造やXHTML、CSSの基本的な考え方についてデモを交えつつご説明します。

XHTML+CSSのメリット
XHTMLのしくみ
CSSのしくみ
XHTML+CSS習得のために

千貫りこ（せんがん・りこ）

KICKS Web代表

フリーランスのWebクリエイター。

某企業における自社サイトのWebマスターとして4年間、その後転職したWeb制作会社にてHTMLコーディング専任者として4年間勤務した後、2005年に独立。

小〜中規模サイトの企画・制作や大規模サイトの(X)HTMLコーディングといった制作業務の他、雑誌記事の執筆、プライベートセミナー開講なども行う。

Web制作会社をはじめとして、出版、呉服、店舗、作家、NPO法人などクライアントの業種は多岐に渡る。

CSSセッティング

第3章をベースに。

CSSをどうセッティングするかで、コーディングのスピードや精度、メンテナンス性が大きく変わります。XHTML+CSSで制作するメリットを享受するためには、適切なCSSセッティングが必要なのです。このセッションでは、CSSセッティング（設計・管理）におけるよくあるトラブルを元に、適切なCSSセッティングの方法や利点、注意点などをご紹介します。

コンポーネント化についての基本的な説明

コンポーネント化とは／メリット
コンポーネント化の分け方例

CSSセッティングにおけるトラブル

ファイルを分けすぎた！
メンテナンス性を考えずにCSS設計してしまった！
複数人数でのコーディングでルールを明確にしなかった！

堀内敬子（ほりうち・たかこ）

有限会社アズ・シーツー
代表取締役／ディレクター／デザイナー

1997年リクルート九州支社にて雑誌編集を担当。1999年Web制作会社勤務、2000年フリーランスのWebデザイナー等を経て、2005年にWeb制作会社、有限会社アズ・シーツーを設立。結果を出すことにフォーカスしたWeb制作・運営を行う。

雑誌「Web Site Expert」（技術評論社）にて「中小企業が『勝つ』ためのWeb制作と運営ノウハウ」を連載中。雑誌・Webマガジンに不定期で執筆。他、不定期で講演等。

ブログ：云々

CSSデザインのための実用テクニックTips

第4章をベースに。

デザインカンプからHTMLにするまでのワークフローを実務に即してお話
IDとクラスの使い方・使い分け
名前のつけかた
マークアップ選びの工夫
スタイリング実例とソースコード解説（CSSを中心に解説）

山田あかね（やまだ・あかね）

エスカフラーチェLLC　
デザイナー

Web業界と関係ない業種で独立して働く傍ら，Web/XHTML/CSS等技術を独学。2005年「コトノハ -○×ソーシャル(http://kotonoha.cc/)」のリニューアルをきっかけに上京し転職。

paperboy&co.でWebサービス開発等を経て、2007年にエスカフラーチェLLCの設立に参画。twister(http://jp.twisternow.net/)など自社サービスのデザイン他、超特急(X)HTML/CSSコーディングサービスCodeEXPRESS(http://www.escafrace.co.jp/codeexpress/)の企画運営・Webサービスのコンサルティングなど幅広く活躍中。その他、Web連載・雑誌執筆活動など多数。

ハンドルはpurprin（ぷるぷりん）。

CSSレイアウト

第5章をベースに。

「いざCSSレイアウトをしてみよう！」と思ってみても、慣れないうちはさまざまな問題に直面します。マルチカラムはfloatで作るのか、positionで作るのか？そもそもfloatの決まりが複雑であまり好きではない！positionで自由度の高いコンテンツ配置を行いたいのに思ったようにいかない！など、あげていったらキリがありません。

本セッションでは、CSSレイアウトを行う際には必須の基本テクニックや、分かりづらいプロパティの解説をデモを交えながらご説明します

コンテンツをセンタリングするテクニック
2カラム化のテクニック
clearfix って何？
実践 position プロパティ

小林信次（こばやし・しんじ）

株式会社まぼろし
Webディレクター、マークアップエンジニア

茨城県出身 1980年生まれ。
専修大学経営学部卒業後、1年弱のニート生活を経て、販売代理店の営業職を経験後、（有）アイエイトワンへ入社。

08年8月11日、業務分野をWebに特化するため、（有）アイエイトワン代表：栗原誠と株式会社まぼろしを設立。

主に、Webディレクション、マークアップを担当するかたわら、allWebクリエーター塾などでセミナー講師を担当する。
著書に『XHTML+CSSデザイン|基本原則、これだけ。』。

DreamweaverやExpression Webでの実装

セミナー独自コンテンツ

バリバリとハンドコーディングだけで作業する方も少なくありませんが、きちんとソースコードが読める上で、やはりDreamweaverやExpression Webなどのツールを併用するのが全体の作業フローはスピーディです。

このセッションでは、DreamweaverやExpression Webを使う上のでの基本的なところを解説します。前のセッションの復習も兼ねてお聞きください。

Dreamweaverを使ったXHTMLのマークアップ
Dreamweaverを使ったCSSのコーディング
Dreamweaverを使ったXHTML+CSSのワークフロー
Expression Web 2を使ったワークフロー

鷹野雅弘（たかの・まさひろ）

Webサイトの構築やコンサルティングを中心に、WebやDTPに関しての講演やトレーニングのほか、スクールなどのカリキュラム開発も手がける。テクニカルライターとして10冊以上の著書を持つほか、書籍の企画や編集なども行っている。

2005 年からCSSNiteを主宰。

著書に『できるクリエーターFlash独習ナビ』（インプレス）、『Illustrator CS3 完全制覇パーフェクト』（翔泳社）
共著に『Dreamweaverプロフェッショナル・スタイル［CS3 対応］』（毎日コミュニケーションズ）
編著書に『1ランク上の技を身につけるFlashの強化書』（毎日コミュニケーションズ）、『Movable Typeプロフェッショナル・スタイル』（毎日コミュニケーションズ）

CSSデザインのブラウザ調整

第6章をベースに。

CSSデザインはブラウザによってズレや崩れが発生することがありますが、落ち着いて、順を追って作業をすれば、きちんと調整することができます。ただし、チェック環境を整えたり、古いブラウザには「力技」で対応したりと、効率的な作業にはちょっとしたコツが必要です。このようなブラウザ調整テクニックについて、デモをたくさんお見せしながらご紹介します。

ブラウザ調整のワークフローとポイント
チェック環境の整え方
CSSハックのまとめとデモ
ブラウザのCSSサポート状況を確認する方法

益子貴寛（ましこたかひろ）

株式会社サイバーガーデン
代表取締役

多様なデバイスでのCSSデザイン

第7章をベースに。

インターネットはパソコン以外からアクセスすることもごくごく当たり前となってきました。今やそれはケータイだけに留まらず、家庭用ゲーム機や音楽プレイヤー、さらに、印刷向けも含まれます。

このようなパソコン画面以外のさまざまなデバイスにも対応できる制作のスキルについてご紹介します。

マルチデバイスとは
非パソコンデバイスの現状と動向
身近な非パソコンデバイス（印刷用）
　→ デモ：DWを用いて印刷用作成見本
　→ 過去の事例におけるトラブル紹介
iPhone/iPod touch向けサイトの基本
　→ デモ：事例サイトの紹介
　→ 今後のモバイルの方向性について

伊藤学（いとう・まなぶ）

ウィルシステム・インコーポレイテッド
マークアップエンジニア/マネージャー

1977年、神奈川県生まれ。逗子開成高校卒。MIDI音楽制作とパソコン講師を行いながら99年にWebサイト制作ユニット『STUDIO Freesia』を設立。

IBM国内認定試験事務局をスタッフを経て、現在はWill System, inc.にて情報設計やCSS・マークアップ等の設計を担当。また派遣会社にてスタッフ向け講師を担当中。雑誌『Web　STRATEGY』（MdN）にて「問題解決のためのWebディレクション術」も連載中。

JavaScriptライブラリとCSS

第8章をベースに。

JavaScriptライブラリを利用すればプログラミングの知識がなくても、JavaScriptを利用した様々な機能を使うことが可能になります。また、ブラウザ間のCSSの実装の違いを吸収して、効率的なWeb制作を行うことが可能です。本セッションではJavaScriptライブラリの活用方法や、ライセンスについて解説いたします。

JavaScriptとは？
JavaScriptライブラリとは？
ライセンスについて
Webサイト構築の際のJavaScriptライブラリ活用（LightBox、yuga.js、alphafilter.js、ie7.js / ie8.js、jQuery）

西畑一馬（にしはた・かずま）

to-R代表／Webクリエイター

フリーランスのWEBクリエイター。
PHPによるシステム開発や、CMSを利用したWEBサイト制作、SEOなどのマーケティング、コンサルティング、WEBクリエイター向けの講座などを業務で行う。
ブログでは、WEB制作に関するTIPSから、自作のJavaScriptライブラリ、Movable Typeのプラグインを公開するなどの活動を行っている。
大阪市ソフト産業プラザimedioや、パソナテック、ナガセPCスクールなどでのセミナー講師も務める。