ちゃんとCSSするための スタイルガイド入門 -スタイルシート スタイルブック2(有坂 陽子 長谷川 恭久 上ノ郷谷 太一)|翔泳社の本
  1. ホーム >
  2. 書籍 >
  3. ちゃんとCSSするための スタイルガイド入門 -スタイルシート スタイルブック2

ちゃんとCSSするための スタイルガイド入門 -スタイルシート スタイルブック2




形式:
書籍
発売日:
ISBN:
9784798112190
定価:
2,420(本体2,200円+税10%)
仕様:
B5変・208ページ

未来派CSS!!スタイルシートの新しいステージ

前作は、折からのブログブームにジャストフィットする形で(ウェブログはデザインとしてCSSを全面的に採用しているため)、デザイナー/非デザイナーを問わず多くの人たちに読まれ、ベストセラーとなりました。それから2年が経ち、CSSはもはやウェブデザインの常識となりましたが、ウェブサイトをCSSでデザインする本当の理由と正しいやり方をわかっている人は未だに少数にとどまっているようです。
本書では、ただCSSを使うだけでなく、考えながらCSSを使うこと、いちからCSSらしいデザインを作り上げること、CSSデザインされること前提とした正しいXHTMLを書くこと、CSSを利用しやすい「スタイルガイド」などを整えることなどをテーマに、CSS本来の持ち味を十二分に発揮できるウェブデザインの手法を解説します。

00 はじめに CSSの考え方をしっかり把握しよう

00-01 結局CSSデザインってどうなのでしょう?
00-02 Web志向の感覚とは?
00-03 この本を未来へのきっかけに

01 基本編 CSSらしいデザイン手法を考える

01-01 ようこそ、新しい時代へ
   CSSレイアウトの新しいステージ
   CSSは解ではなく道具
01-02 「サポート」ということの意味を考える
   すべてのデバイスを「サポート」する
   よりリッチな体験をサポートする
   サポートするブラウザを分類する
01-03 CSSでできること/できないこと
   CSSでできないこと
   CSSだからこそできること
   技術の組み合わせによる新たな表現の道
01-04 スタイルガイドに挑戦
   さまざまな世界で使われる「スタイルガイド」
   Webデザインの「スタイルガイド」
   自分だけのスタイルガイド/スタイルブック
01-05 CSSの書き方のガイドライン
   目的に合わせたCSSの構成パターン
   ID名/CLASS名の付け方
   プロパティの記述順番
   コメントを忘れずに
01-06 CSSハックについて
   ハックは必要か?
   ハックする場合の注意
01-07 ミス探しのチェックポイント
   1. プロパティのあとは「:」、値のあとは「;」がきちんと記述されているか
   2. ID/CLASS名は書き間違えていないか
   3. プロパティや値のスペルミスはないか
   4. 余計なスペースがないか
   5. 仕様どおりに値を記述しているかどうか
   6. スタイルの継承でかぶっている部分はないか
   7. 文字コードのチェック

02 実践編 スタイルシート スタイルガイド

02-01 柔軟な構造のHTMLテンプレートのメリット
   CSS Zen Gardenから考えるHTMLテンプレート
   どんなレイアウトにも対応できる骨組み
   複雑な構造のHTMLテンプレート
   HTMLテンプレートの完成形
02-02 さまざまな段組レイアウトを実現するCSSライブラリ
   1カラムスタイル
   1カラムスタイルの応用
   2カラムスタイル
   2カラムスタイルの応用 1
   2カラムスタイルの応用 2
   3カラムスタイル その1―両サイドにメニュー
   3カラムスタイル その2―メニューを片側にまとめる
   3カラムスタイル その3―メニューの順を逆に
02-03 CSSファイルを分割して管理する
   CSSファイルを分割する理由と方法
   1. ブラウザごとのスタイルの違いをリセットする(common.css)
   2. 各HTML要素の振る舞いを指定する(common.css)
   3. ページのレイアウトのライブラリ(layoutsフォルダ)
   4. 全体的なフォントの指定を管理する(fonts.css)
   5. 頻繁に使うスタイルをクラスにまとめたライブラリ(module.css)
   6. 配色・レイアウトの調整を管理する(theme.css)
   分割したCSSを合体ロボットのように組み合わせる
   複数のレイアウトが混在するサイト構築
02-04 CSSファイルの作成ガイドライン
   セットフォーマットルール
   プロパティの順序
   筆者が使用しているプロパティの順序の詳細
   簡略化プロパティ
   フォントに関するプロパティの簡略記述
   ルールの共有

03 応用編 さまざまな環境のCSS

03-01 印刷用スタイルシート
   メディアタイプの指定
   印刷用CSSを用意しよう
03-02 タイポグラフィ
   フォントファミリーの指定
   line-heightプロパティには単位のない値がおすすめ
   1行あたりの文字数を制限する
03-03 フォームを使いやすく整える
   ブラウザ依存
   支払い情報入力フォームのサンプル
   fieldset要素のスタイル
   テキストフィールドの背景画像
   画像ボタンとインターアクション
   フォームのテンプレート
   デザインされたフォームのソースコード全体
03-04 携帯電話とCSS
   Compact HTMLからXHTML basicへ
   携帯電話用CSSの仕様
   各キャリアで利用できるセレクタ
   各キャリアで利用できるプロパティ
   i-mode XHTMLとCSS
   実際にコンテンツを作成する際のポイント
   開発環境について

04 スタイル編 CSSでの画像レイアウト見本帖

04-01 CSSデザインでは画像の使い方も変わった
04-02 背景
   背景 1―ページ上部からのグラデーション画像
   背景 2―大きな一枚画像
   背景 3―大きな背景画像で雰囲気を変える
   背景 4―ペンキ塗り立てのようなレイアウト
   背景 5―トップ画像を背景にとけ込ませて、イレギュラーな効果
04-03 ヘッダー
   ヘッダー 1―たとえば赤一色でまとめたデザイン
   ヘッダー 2―半透明のバナーなど
   ヘッダー 3―グラフィックで作り込み、構成はシンプルに
   ヘッダー 4―背景にとけ込ませたヘッダー
04-04 コンテナー
   コンテナー 1―イレギュラーな配置
   コンテナー 2―見栄えが良くて、シンプルな構成
   コンテナー 3―ノートに手描きのロボット
   コンテナー 4―ラインを斜めにして、動きを感じさせるデザイン
04-05 フッター
   フッター 1―猫が目を閉じたり舌を出すフッター
   フッター 2―草原の広い青空に飛ぶ飛行機
   フッター 3―メニューはページの下部に
04-06 全体
   全体 1―イスラム・テイストの独特なCSS
   全体 2―テーブルのように分割されたレイアウト
   全体 3―画面を上下に分割して、絵画のようなページ作り
   全体 4―シックで華やかなデザイン

05 APPENDIX 付録

Appendix A 役立ちCSS関連リンク集
   A.1 リファレンス
   A.2 ギャラリー系のサイト
   A.3 CSS関連のツール
   A.4 CSSエディタ、ユーティリティ
Appendix B CSSプロパティ簡易リファレンス
   B.1 はじめに
   B.2 ボックスモデル
   B.3 ポジション
   B.4 視覚効果
   B.5 リスト
   B.6 背景
   B.7 フォント
   B.8 テキスト
   B.9 擬似クラス(Pseudo-Class)
   B.10 擬似要素(Pseudo-Element)
Appendix C ブラウザのDOCTYPEスイッチのまとめ
Appendix D ブロック要素のセンタリングについて

本書は付属データの提供はございません。

お問い合わせ

内容についてのお問い合わせは、正誤表、追加情報をご確認後に、お送りいただくようお願いいたします。

正誤表、追加情報に掲載されていない書籍内容へのお問い合わせや
その他書籍に関するお問い合わせは、書籍のお問い合わせフォームからお送りください。

利用許諾に関するお問い合わせ

本書の書影(表紙画像)をご利用になりたい場合は書影許諾申請フォームから申請をお願いいたします。
書影(表紙画像)以外のご利用については、こちらからお問い合わせください。

追加情報はありません。
この商品の「よくある質問」はありません。

ご購入いただいた書籍の種類を選択してください。

書籍の刷数を選択してください。

刷数は奥付(書籍の最終ページ)に記載されています。

現在表示されている正誤表の対象書籍

書籍の種類:

書籍の刷数:

本書に誤りまたは不十分な記述がありました。下記のとおり訂正し、お詫び申し上げます。

対象の書籍は正誤表がありません。

最終更新日:2006年12月20日
発生刷 ページ数 書籍改訂刷 電子書籍訂正 内容 登録日
1刷 144
表03-04のi-mode XHTMLの行
2刷
GIF JPEG PNG ×  ○  
GIF JPEG PNG   ○  ×

.gifではなく、.pngが表示不可
2006.12.20

感想・レビュー

yhassy さん

2008-05-22

さらに自分の本