レイアウト自由自在！Dreamweaver CS4（ドリームウィーバーCS4）CSSデザイン手法

レイアウト自由自在！Dreamweaver CS4 CSSデザイン手法は、Adobe Dreamweaver CS4（アドビ ドリームウィーバーCS4）を活用して、CSS（カスケーディングスタイルシート）を使用したWebサイトデザインを習得する講座です。

CSSレイアウトに必要な知識とテクニックが、2日間のハンズオン（PCを使用しての実習）で身に付きます。

『いままでテーブルレイアウトでページを作成していたけど、Internet ExplorerやFirefox、SafariもバージョンアップしてCSSにフル対応しているし、そろそろはじめないと…』

そんなWeb制作者の方にピッタリの内容となっています。さらに、各種ブラウザーでの見え方の違いや、Web標準化などの話題もご紹介します。

こんな方におすすめ！テーブルレイアウトでお困りの方に！

• テーブルを使ってレイアウトしているが、柔軟性がなく四苦八苦している
• Webサイト全体のデザインを変更したいが、ページがたくさんありすぎて挫折した
• CSSを利用すると非常に便利だ、と話には聞いているが、実際にどこから始めていいのかわからない
• ポータルサイトなどでよくみかける、2段組み、3段組みのレイアウトを作ってみたい
• Internet Explorer 6 / 7 / 8から、Firefox、Safari、Google Chrome、Operaなどなど、数多くある各ブラウザーでの見え方の違いに悩んでいる
• CSSを使ったWeb制作のワークフローを確認したい
• Web制作業務の担当になったが、ちまたにあるようなサイトが作れない

CSSとは

CSSとは、Cascading Style Sheets（カスケーディングスタイルシート）の略で、Webページのレイアウトを制御する技術（規格）です。

HTMLは、もともと文書構造の記述を目的としていました。そして時代とともにインターネットの利用頻度が高まるにつれ、見た目やレイアウトが重視され始めます。しかし本来、HTMLにそのような制御を行う要素は少なく、代替手段としてテーブル（table）が利用されるようになります。

しかしテーブルレイアウトには大きな欠点がありました。

• Webサイト全体のレイアウトをテーブルで作った場合、少し修正しただけでも、すべてのページを修正しなくてはならない
• 細かくレイアウトを指定しようとすると、テーブルが入れ子の状態になり、HTMLが複雑になる
• 複雑になったHTMLは、修正もしにくく、視認性も悪く、もちろんファイルサイズも大きくなる
• table要素は、もともと表（ひょう）を記載するためのものなので、そもそも使い方がまちがっている

そこでCSSの登場です。HTMLは文書の論理構造のみを記述し、レイアウトや文字デザインなど、見た目の制御はCSSにまかせるようになったのです。内容と表現を別々に制御する、本来あるべき姿になりました。

現在この流れは世界のWebサイトの主流となり、Webの標準規格への準拠と言われています。標準規格に準拠することにより、アクセシビリティとSEO（検索エンジンへの最適化）の効果も高まります。

Adobe Dreamweaver CS4 販売中！

CSSデザイン手法 講座の特長

レイアウト自由自在！Dreamweaver CS4（ドリームウィーバーCS4） CSSデザイン手法では、

1. 講義　－　インストラクターの解説や、手順の説明
2. 実習　－　実際にDreamweaverを操作して、使い方を習得
3. まとめ　－　重要なポイントを確認、復習
4. 演習　－　これまでに学んだ知識をもとに、目標に向け制作実習

のステップを、各章（ユニット）ごとに学びます。

ユニットごとに明確な目標をたてて授業を進めるので、実践的な知識が身に付きます。また、学習に必要なサイクルをこなすことで、効率的に技術を吸収できます。

Dreamweaver（ドリームウィーバー）で作業工数が削減

Adobe Dreamweaver CS4（アドビ ドリームウィーバーCS4）は、複雑になりがちなCSSを管理するために、使い勝手のよい機能やインターフェースを搭載しています。

講座では、Dreamweaverを利用したCSSの設計から作成、管理方法をマスターします。

もちろんデザインテクニックだけでなく、CSSでデザインする際の大きな課題である「各ブラウザーでの見え方の違い」に関するトラブルシューティングも、多数ご紹介します。

その日からすぐに使える、実践的なテクニックが満載です。

講座テキストは、Dreamweaverのプロが作成

講座で使用するテキストは、Dreamweaverのプロフェッショナルである、アドビ認定インストラクターおよびm-Schoolが制作・監修しました。

短期間の中で効率よく習得いただけるよう、以下のポイントを重視したテキストとなっています。

• 本講座専用で作成されたテキストのため、習得効果が高い。
• 操作手順やポイントなど、細かな説明がわかりやすい。
• 操作画面などのスクリーンショットや図表を多数掲載し、初心者の方でも理解しやすい。
• 各章の構成が「手順解説→操作→実習」のサイクルを基本としているため、しっかりと身に付く。
• 講座で使用する教材データファイルも付いてくるので、講座修了後でも復習できる。

テキストの形状は、PCの横に広げて読みやすいように、各講座共通のバインダー形式となっています。そのため、必要なページをピックアップしたり、ほかの講座テキストと組み合わせて、自分だけのオリジナルテキストも作成できます。

CSSレイアウトでサイトを作るなら、この講座から！

レイアウト自由自在！Dreamweaver CS4 CSSデザイン手法は、CSSを基礎から学びたい方に最適なトレーニングです。

書籍やリファレンス本を見ても、実際にどう使えばわからない…。

そんな方は、この講座からスタートしてみましょう！

---

レイアウト自由自在！
Dreamweaver CS4 CSSデザイン手法

講座種別	この講座はm-Schoolオリジナル講座です。
対象者	Webデザイナーを目指す方。 企業のWeb担当の方。 Adobe Dreamweaver CS4: Fundamentalsを受講済み、もしくは同等の知識があり、さらにレベルアップを目指す方。
前提条件	下記のようなWindowsの一般的なパソコンの操作ができる。 マウス操作（クリック、ダブルクリック、ドラッグ） フォルダの作成 フォルダやファイルの名前変更 フォルダやファイルのコピー操作 テキスト入力（半角や全角での文字入力） テキストの編集（Microsoft Wordや一太郎などのワープロソフトでのフォントサイズ変更やカラー変更） Dreamweaver CS4の基本操作（イメージの配置やリンクの設定など）ができる。 前提条件の習得におすすめの講座 Adobe Dreamweaver CS4: Fundamentals
セット 講座	2講座セットでお得なバリューパックもあります。 Adobe Dreamweaver CS4 ＋ CSS スタートパック
講座内容	CSSレイアウトに必要な知識とテクニックを2日間のハンズオン（PCを使用しての実習）で学びます。 CSSの概要と記述方法 セレクタの種類と特徴 DreamweaverでのCSS設定方法 CSSで2段組、3段組のWebページをレイアウトする 便利なツール紹介 CSSでナビゲーションバーのレイアウトやリンクをデザインする ブラウザごとの特徴と違い、原因と対処方法 見出しの効果的な表現方法（例：角丸デザイン） 印刷用レイアウトの作成 総合実習：サンプルサイトを作成する
講座目録	講座の目録をご確認いただけます。
習得目標	CSSで自在にページレイアウトができる。 各種ブラウザーの見え方の違いに対応できる。 アクセシビリティを考慮したWebサイトを作成できる。
受講環境	受講環境はMicrosoft Windows XP ProfessionalまたはWindows Vista Businessです（日程により環境が異なります）。Apple Macintoshをご利用の方でも、ツールの基本操作やユーザーインターフェースはWindows版とほぼ同等ですので、安心してお申し込みください。 ノート、筆記用具等はご持参ください。 受講に必要なPC等の器材・資料はご用意しております。 講座で作成したファイルをお持ち帰りになる場合は、USBメモリをご持参ください（フロッピーディスクは利用できません）。 そのほかご不明な点がありましたら、講座のFAQをご確認ください。
受講期間	2日間
総時間	12時間（6時間×2日）
受講時間	［通常コース］ 10:00～17:00 （受付9:40より / 13:00～14:00は昼休み）
会場	m-School / 東京都千代田区三崎町1-3-12 水道橋ビル8階 会場地図
受講料	73,500円 （税込）
教材	講座テキスト 教材データCD-ROM
支払方法	銀行振込にてお支払いください。 お振り込み先等は、お申し込み手順にてご確認ください。
受講規約	お申し込み前に、受講規約（PDF：311KB）をご一読ください。本受講規約をご了承の上、お申し込みいただきますよう、よろしくお願いいたします。
集合研修	この講座は、集合研修・企業研修として、お客さまのもとへ講師を派遣して開催できます。詳細は法人・自治体向け 集合研修のご案内をご覧ください。
その他	進行状況により、講座の内容や（お昼をはさむ場合は）昼休みの時間等、若干変更される場合がございますので、あらかじめご了承ください。 ご不明な点はお申し込み手順ページにてご確認、またはお問い合わせページよりお問い合せください。 雇用・能力開発機構のキャリア形成促進助成金を利用することで、研修費や人件費を補助する給付金を受給できる場合がありますのでご利用ください。