新しい書籍が完成しました。Web制作に必要なデザインの制作からコーディングまで、ひととおりの制作過程を学べるように構成してあります。
分業化が進むWeb制作の現場ですが、この一通りの流れを理解しておくことも必要です。まず基本を身につけたいという方は、是非ご検討ください！
Web制作をこれから始める方へ。
「Webデザイン」、「マークアップ」、「CSSコーディング」、
それぞれ別の本で学んでいたら、時間もコストもかかってしまいます。
短い時間で一気に学んでしまいたい、そんな欲張りなあなたにぴったりな1冊です。
Web制作の仕事の流れ、Webデザインやマークアップ、CSSコーディングの理論や考え方、FireworksやDreamweaverといったソフトウェアの使い方まで、濃縮してまとめて詰め込みました。
（著者による「はじめに」から）
本書では、これからWebデザインの仕事に携わっていきたいと考えている方を対象に、Webサイトのプランニングからデザイン、コーディング、そして公開までの基本的な流れを、実際の制作手順を交えてご紹介しています。
最新の技術が次々と登場し、Webサイトというメディアで表現出来ることも常に進化しています。Web制作のための技術はより専門化してきており、Web制作の現場でもそれぞれのプロフェッショナルへ役割分担をして進めることが一般的になってきていますが、Webデザイナーという立場において、「ここだけは押さえておきたい」というポイントをまとめました。
「DAILY FLOWER STORE」という架空のフラワーショップのWebサイトをモデルに、Fireworksを使用して画面のデザインを作っていく課程と、Dreamweaverを使用したHTML&CSSによるコーディングの手順を細かく掲載しています。
実際に手を動かすことで実制作のノウハウを学ぶことが出来ると思いますので、手順を追いながら、まずは1つのWebサイトを完成させてみてください。
（環境について）
本書での説明は、基本的にはMac OS X、Adobe Creative Suite5.5（Adobe Photoshop CS5.1、Illustrator CS5.1、Fireworks CS5.1）、Google Chromeバージョン18（特に表記のない場合）を使用して行っています。
クリエイターの卵のための Webデザイン集中講座
| –目次 CHAPTER 1 Webデザインの基本1-1 Webサイトが出来るまで 基本的な制作の流れ クライアントワークの進め方 プラニング ワイヤーフレームの設計 デザインの制作 コーディング 公開 |
CHAPTER 3 デザインの制作3-1 デザインの制作 3-2 「Kuler」でカラースキームを設計する STEP 1 カラーテーマを作る STEP 2 デザイン制作フロー STEP 3 Fireworksについて3-3 ワイヤーフレームに沿って全体のベースを作る STEP 1 トップページのベースを作る STEP 2 下層ページのベースを作る 3-4 トップページのパーツを製作する STEP 1 メインビジュアル・INFORMATIONの作成 STEP 2 Illustratorでロゴマークを作る STEP 3 グローバルナビゲーションを作成 STEP 4 コンテンツの作成 STEP 5 フッターの作成 3-5 下層ページのパーツを制作する STEP 1 ヘッダーの作成 STEP 2 サイドバーの作成 STEP 3 コンテンツの作成 STEP 4 フッターの作成 3-6 スライスと画像の保存 3-7 デザインから各パーツをスライスして保存する STEP 1 トップページのデザインをスライスして保存する STEP 2 下層ページのデザインをスライスして保存する STEP 3 ロールオーバー効果のあるパーツを保存する 3-8 デザインのバリエーション11111 |
| CHAPTER 2 ワイヤーフレームの設計2-1 ワイヤーフレームの設計 Webサイトを構成する要素について 既存のWebサイトから学ぶ 要素のレイアウト Webサイトのユーザーインターフェース2-2 ワイヤーフレームを作る STEP 1 トップページのワイヤーフレームを作る STEP 2 下層ページのワイヤーフレームを作る 2-3 ワイヤーフレームのバリエーション |
CHAPTER 4 コーディング4-1 HTMLとCSSの役割 4-2 Dreamweaverを使う 4-2-1 マークアップ 4-2-2 HTMLの概要 4-2-3 マークアップの準備をする STEP 1 Dreamweaverのサイト定義 STEP 2 Dreamweaverでのファイル作成 4-2-4 トップページをマークアップする STEP 1 基本と構造のマークアップ STEP 2 ヘッダー STEP 3 コンテンツのマークアップ STEP 4 フッター STEP 5 トップページの確認4-2-5 下層ページをマークアップする STEP 1 下層ページの基本をマークアップ STEP 2 ヘッダーのマークアップ STEP 3 コンテンツの構造をマークアップ STEP 4 メインコンテンツをマークアップ STEP 5 サブナビゲーション STEP 6 フッター STEP 7 下層ページの確認 4-3-1 スタイルシートについて 基本的な制作の流れ クライアントワークの進め方 プラニング ワイヤーフレームの設計 デザインの制作 コーディング 公開 4-3-2 CSSコーディングの準備 STEP 1 DreamweaverでCSSファイルの作成 4-3-3 トップページのスタイリング STEP 1 全体的なスタイルの作成 STEP 2 ヘッダー STEP 3 グローバルナビゲーション STEP 4 コンテンツ STEP 5 フッター STEP 6 プレビュー 4-3-4 下層ページのスタイリング STEP 1 準備と確認 STEP 2 コンテンツ STEP 3 サブコンテンツ STEP 4 プレビュー 4-4-1 クロスブラウザ対応 サーバとアップロード |
クリエイターの卵のための Webデザイン集中講座
