Dreamweaver＋HTML5&CSS3レッスンブック
エビスコム
最新版DreamweaverとHTML5&CSS3をいっしょに学べる
- 定価
- 2,948円（本体価格 2,680円）
- 発売日
- 2012年6月26日
- 判型／ページ数
- B5変型／320ページ（オール4C）
- ISBN
- 978-4-88337-827-2
- 備考
- DVD-ROM（Win&Mac体験版、サンプルデータ収録）
SOLD OUT
- キーワード：
- jQuery Mobile / スニペット / テンプレート / レスポンシブWebデザイン / 可変グリッドレイアウト
ステップ・バイ・ステップ形式で最新版Dreamweaver CS6の操作とHTML5&CSS3の知識が自然に身に付く。Dreamweaverをこれから学びたい方、Dreamweaverをまだ十分使いこなせていない方に最適。
また、1つのHTMLファイルでスマートフォンやタブレットにも対応できる話題の「レスポンシブWebデザイン」についても事例を使って紹介。
そのほか、Dreamweaver CS6の最新機能なども網羅
●可変グリッドレイアウト、jQuery Mobileなど、新機能にも対応
●スニペットやテンプレートを活用した効率的なWebデザインができる
ソフトウェアをお持ちでない方でも安心！30日間の無料体験版で学べます。
＜付属DVD-ROMの内容＞
■Windows版Dreamweaver CS6の30日間無料体験版（機能制限なし）
■Macintosh版Dreamweaver CS6の30日間無料体験版（機能制限なし）
■本書で使用するサンプルデータ（各種素材データ、HTML5&CSS3ソース）
Chapter 1 ［イントロダクション］Dreamweaverで効率よくページを作成するために
STEP 1 ワープロやDTPソフトとDreamweaverの違い
STEP 2 Webページの作法
Chapter 2 ［基本編］文字の表示とデザイン
STEP 1 Dreamweaverを使ってみる
STEP 2 ページの新規作成
STEP 3 文字を入力する
STEP 4 見出しを指定する
STEP 5 デザインしたい箇所をインスペクトモードで選択する
STEP 6 CSSのルールを作成してデザインを指定する
STEP 7 IDで区別してデザインを指定する
STEP 8 文章中の語句のデザインを指定する
Chapter 3 ［基本編］レイアウト
STEP 1
STEP 2 ボックスを罫線で囲む
STEP 3 ボックスの横幅を指定する
STEP 4 ボックスの配置を指定する
STEP 5 ボックスの余白を調節する
STEP 6 ボックスに下線を引く
STEP 7 ボックスの背景色を指定する
STEP 8 区切り線を挿入する
Chapter 4 ［基本］画像とアップロード
STEP 1 画像を挿入する
STEP 2 画像まわりの余白サイズを調節する
STEP 3 背景画像を表示する
STEP 4 リンクを設定する
STEP 5 リンクのデザインを指定する
STEP 6 ブラウザでの表示を確認する
STEP 7 ページをアップロードする
Chapter 5 ［サイト構築編］段組みレイアウトとナビゲーション
STEP 1 下準備
STEP 2 クラス名を利用して同じスタイルシートを適用する
STEP 3 セレクターのグループ化を利用して同じスタイルシートを適用する
STEP 4 ３段組みのための準備
STEP 5 スニペットで増やすためのパーツを作成する
STEP 6 スニペットで同じデザインのパーツを増やす
STEP 7 3段組みでレイアウトする
STEP 8 ナビゲーションバーを作成する
STEP 9 外部スタイルシートを利用する
Chapter 6 ［サイト構築編］テンプレートの活用とコンテンツページの作成
STEP 1 テンプレートを作成する
STEP 2 テンプレートを利用してページを作成する
STEP 3 テンプレートを編集して複数ページをまとめてカスタマイズする
STEP 4 2段組みのレイアウトを設定する
STEP 5 子テンプレートを作成する
STEP 6 子テンプレートを利用してページを作成する
STEP 7 IDを指定してページごとにデザインを変える
STEP 8 表示位置や重なり順を指定してレイアウトする
STEP 9 テーブル（表組み）を作成する
STEP 10 フォームを作成する
Chapter 7 ［応用編］スマートフォン＆タブレット
SAMPLE 1 レスポンシブWeb デザインの設定
SAMPLE 2 可変グリッドレイアウトを利用したページ作成
SAMPLE 3 jQuery Mobileを利用したページ作成
Chapter 8 ［応用編］HTML5＆CSS3
SAMPLE 1 HTML5による論理構造のマークアップ
SAMPLE 2 HTML5によるビデオの表示
SAMPLE 3 HTML5によるフォームの機能拡張
SAMPLE 4 トランジション機能を利用したアニメーションの設定
正誤情報
- 2012.09.11P141の手順6の画面のコメントに誤りがありました
- 2013.07.11P226の「トップページのIDを指定する」の手順2の文章に誤りがありました
- 2013.07.11P227の「子テンプレートで作成したページのIDを指定する」の手順5の文章に誤りがありました
- 2013.08.09P142の手順7の「コードビューCheck」に誤りがありました
- 2013.08.09Creative Cloud版もしくは単体製品のDreamweaverをご利用で、「12.1」および「12.2」にアップデート済みの方に補足情報
P141の手順6の画面のコメントに誤りがありました
当書籍について、現在以下の記述ミスが発見されております。 大変ご迷惑をおかけしますが、以下をご参照いただきますよう、よろしくお願いいたします。
（第2刷以降は修正済み）
［誤］クラスを「basicinfo」、IDを「header」と指定。
↓
［正］クラスを「basicinfo」、IDを「footer」と指定。
P226の「トップページのIDを指定する」の手順2の文章に誤りがありました
当書籍について、現在以下の記述ミスが発見されております。 大変ご迷惑をおかけしますが、以下をご参照いただきますよう、よろしくお願いいたします。
［誤］メニューから［修正＞テンプレートオブジェクト］を選択します。
↓
［正］メニューから［修正＞テンプレートプロパティ］を選択します。
P227の「子テンプレートで作成したページのIDを指定する」の手順5の文章に誤りがありました
当書籍について、現在以下の記述ミスが発見されております。 大変ご迷惑をおかけしますが、以下をご参照いただきますよう、よろしくお願いいたします。
［誤］コードビューを確認すると、<div id=”event”>となったことがわかります。
↓
［正］コードビューを確認すると、<body id=”event”>となったことがわかります。
P142の手順7の「コードビューCheck」に誤りがありました
当書籍について、現在以下の記述ミスが発見されております。 大変ご迷惑をおかけしますが、以下をご参照いただきますよう、よろしくお願いいたします。
［誤］<div class=”basicinfo” id=”header”>～</div>
↓
［正］<div class=”basicinfo” id=”footer”>～</div>
Creative Cloud版もしくは単体製品のDreamweaverをご利用で、「12.1」および「12.2」にアップデート済みの方に補足情報
P49などにあります「挿入」パネルの「一般」から「タグ選択」が削除されました。詳しくは、アドビサイトの情報をご覧ください。
http://helpx.adobe.com/jp/dreamweaver/using/changes-insert-options-creative-cloud.html
代替手段として、タグを直接入力するか、「クイックタグ編集」の機能を利用してください。「クイックタグ編集」については、P53のTIPで紹介しています。
お問い合わせ
本書に関するお問い合わせは、下記のボタンをクリックしてお問い合わせフォームよりお問い合わせください。
関連する書籍
- 発売日
- 2012年6月11日
