2007/08/09(木)
 | ワンランク上を目指す CSSクリエイティブ・デザイン (2007/07/25) 河内 正紀 価格：￥ 2,814 （税込） 1500 円以上国内配送料無料 商品詳細を見る 本書では、いくつかのサンプルや実際のWebサイトの実装例を交えて、デザインとコードの具体的な関係性を探るため、前半はグリッドやタイポグラフィといったデザイン知識の解説を織り交ぜながらレイアウト完成までのステップを展開、中盤ではJavaScriptを組み合わせた動的なレイアウトを作成する際の考え方や注意点を、後半では僕が仕事で携わった具体例を紹介し、どのような考え方でデザインをコードへと落とし込んでいったのかを詳解しています。 |
【商品の説明】
CSS(スタイルシート)でのWebサイト制作が当然であるという時代になり、Webデザイナーには、デザインとコードのどちらか一方に特化した取り組みだけでなく、双方の学習と理解が求められています。そこで本書では、CSSの基礎学習を終えた方に向けて、デザインからコードへ落とし込む実践的な技術を説明します。Webデザインの手法や最新Webデザインを紹介し、汎用性の高いレイアウトや動的なレイアウト、CSSのモジュール管理などを、サンプルや実例を使って学習します。学習用のサンプルファイルはダウンロードで提供します。
【目次】
Chapter.1：最新Webデザイン事情
1.1 近年のCSSデザインの動向
1.2 デザインとコード
Chapter.2：汎用性の高いレイアウトパターン
2.1 グリッドシステムによる段組のレイアウト
2.2 CSSで作るタイポグラフィの表現
2.3 ナビゲーションのインターフェースデザイン
[ Topics ] ブラウザのデフォルトスタイルの統一とその注意点
Chapter.3：JavaScriptを組み合わせた動的なレイアウト
3.1 コンテンツの表示切り替え
3.2 Lightboxのレイアウトカスタマイズ
[ Topics ] HTML5とその将来
Chapter.4：実例から学ぶレイアウトプロセス
4.1 デザインからコードへ落とし込む技術
4.2 効率的なサイト制作を助けるCSSのモジュール管理
[ Topics ] 仕様策定の段階から定義する汎用的なブロックの構成
Appendix：
A.1 DOCTYPE宣言とブラウザのレンダリングモード
A.2 セレクタ一覧と対応ブラウザ
A.3 カスケード処理
A.4 CSSハック
【カスタマーレビュー】
デザイナーの考えをコードで表現するためにテーマである「構造とデザインの一致」について、考え方とその具体的な実例によって構成されています。 同じ著者の前著「速習Webテクニックスタイルシート上級レイアウト」と同じく、なぜそのようにするのかといった考え方が充実していて大変勉強になります。他のCSS本と比べるとデザインについての説明が多く、それでいてデザイン解説本にはならずCSSに関して高度なレベルで解説されています。セレクタとは何かといった基礎的な内容は扱っていないので、そういった内容を期待する場合は他の本を先に読んだ方がよいでしょう。デザインをどのようにコードに落とし込めばよいのかわからないウェブデザイナー、デザインのことも勉強してよりよいソースを記述したいマークアップエンジニアにおすすめです。
HTML+CSSからXHTML+CSSに移行したいデザイナーの方へいまだにハイブリッドデザインやテーブルレイアウトをしているのですが、今後のSEO対策をを考えるとXHTML+CSSは避けられないと思い、サンプルが入っている教材を探していたところこの本に巡り会いました。サンプルのデザインが洗練されていてわかりやすいし、どんどん進めていくことができました。
CSSハックについても触れられていますがあまり詳しくは解説されていないので、その辺は別の本で勉強すればいいと思います。あと今流行のLightboxはCSSでデザインの変更の仕方が詳しく解説されていて大変ためになりました。早速仕事で実践してみようと思います。ちゃんとしたサンプル付きの教材ってなかなかないと思うので、XHTML+CSSってどんな感じ？？？っていう方の始めの一冊に最適だと思います。
私はこれとWebプロフェッショナルのための黄金則 XHTML+CSS虎の巻を購入し1週間ほど、どっぷりXHTML+CSS環境に浸かってみましたがなんとか移行できそうです。オススメな一冊です。
● ホームページ作成ガイドブック
Ｌ ホームページ・ブログ作成ソフト
Ｌ HTML & CSS
Ｌ CSS（スタイルシート）
Ｌ JavaScript（ジャバスクリプト）
Ｌ 無料でできる・作るシリーズ
● スタイルシート（CSS）解説本
Ｌ 実践Web Standards Design―Web標準の基本とCSSレイアウト&Tips
この記事のトラックバックURL
http://bloghp.blog102.fc2.com/tb.php/153-140fb7f1
この記事にトラックバックする(FC2ブログユーザー)
この記事にトラックバックする(FC2ブログユーザー)
この記事へのトラックバック