REDLINE MAGAZINE | 100の法則本、読みましたよーREDLINE MAGAZINEトップページへ

すべてのエントリを見る

100の法則本、読みましたよー

最近この本を読みました。Twitterのお友達も購入したみたいなので気合入れてレビュー(読書感想文)書いてみます。

Web標準XHTML+CSSデザイン
クリエイターが身につけておくべき新・100の法則。

第1章で(X)HTMLの基本を確認

先は長いんですが、一通り拝読して個人的にはこの章が一番濃かったように思う。というのも自分では分かってるつもりでも実はあやふやだったじゃん、みたいな問題にいろいろ気づいた章でした。具体的にはこんな項目。

  • 法則6のメディアタイプ(XHTML文書の基本はapplication/xhtml+xml)
  • 法則15のリンクタイプの種類
  • 私PCDATAとCDATAの違いをちゃんと人に説明できたっけ?

などなど。リンクタイプの話なんかは「興味あるー」とか思ってたくせに放置気味だったし、PCDATAとCDATAの違いについては大事な部分は知ってたけど(SGML的にパースされるされないとか)一瞬怪しい感じがしたので改めてちゃんとググり直しました。そしたら「あ、この話は知らなかったわ」みたいな部分も発掘されていいきっかけになりました。

各法則には関連知識として知っておいたほうがいいというポイントも掲載されている。あまり掲載内容を詳しく書くのはまずいかもしれないから控えるけど、法則12の「コメントの記述位置についての注意」で、IE7でコメントを要素の外側に記述するとCSSのこんな指定で問題が起こる事があるよーとか、法則19の略語についての「abbr要素とacronym要素の使い分け」の話でこういう風に使い分けたらいいよみたいな話はとても参考になった。「迷ったらこっち使うのがおすすめ」と言う書き方はすごくありがたい。

第2章はCSSの基本

CSSに関する基本的な記述方法、優先順位、ボックスモデル、レンタリングモードなど、CSS解説書の定番のお話はもちろん、管理面・効率面から考えたCSSの書き方についてのお話が満載。

法則35ではこれからもっと普及するだろうなと思うセレクタや擬似クラスの解説もあり、それぞれに簡単なサンプルソースも掲載されているので理解しやすいと思う。法則38では文字色と背景色のコントラストの配慮ということで、W3Cのワーキングドラフトとして公開中のTechniques For Accessibility Evaluation And Repair Tools内で紹介されてる計算方法についての解説も。本の話からはズレるけど、文字色と背景色の見易さを考えるならこのツールもおすすめ。

>>富士通アクセシビリティ・アシスタンス
>>ColorSelector

このColorSelectorを使えば簡単に健常者、白内障、第一色覚(赤)障害、第二色覚(緑)障害、第三色覚(青)障害での見やすさを判定確認できる。アクセシビリティ向上を考えるなら知っておいて損はないツールの一つ。

法則43.44ではショートハンドについて詳しく解説。font関連についてはショートハンドを使わない方が無難かもという考え方にはかなり同意。

第3章はレイアウト

floatプロパティ、positionプロパティ、ネガティブマージンを使ったレイアウト、clearプロパティ使用時の注意点などレイアウトテクニックを解説。一番気に入ったのは法則50の「サイト全体の文書構造を整理してからCSSを記述する」の項目。実際にどう組み立てていくか、というお話。多分多くの制作者はそういう考え方・作り方をしているとは思うけど、やっぱり大切なのはそこだよねーと。

法則52のエラスティックレイアウトは興味津々。実験ではいろいろ試したみたものの、実はまだ実務で使用した事がない。固定幅のレイアウトをエラスティックレイアウトへ変更する際のポイントが掲載されていて、とても参考になった。エラスティックの場合、背景画像どうしたらいいのという話も書かれていて、なるほどなるほど。

第4章はユーザビリティを考えたCSS

利用者のユーザビリティを向上させるCSSテクニックが11項目掲載されている。法則63の「CSSのみでドロップダウン型メニューを作る」。IE6がアレなんで使うとしてもjs併用だなーと今まで思っていたんだけど、IE7の登場でそろそろCSSだけで実現する方向に頭を切り替えていってもよさそうな印象を受けた。

その他、この章ではクリック領域を大きくしよう、リンク先のファイルタイプや新ウィンドウで開く時は利用者にそれらを明示しようなど、小さな事だけど大切で、利用者にとってみると大きな事となるテクニックが書かれている。

法則70ではフィードにCSSを適応させるという内容も。XMLの見た目・・・というとXSLTを連想しちゃうけど、CSSを適応させるっていうのもアリだね。(少し前にどこかのブログでもこの手の話を見た気がする・・・思い出せない。。。)

第5章は実践的なCSSデザインテクニック

書籍・雑誌やCSS解説系サイトのテクニック集みたいな感じの内容。ブラウザのデフォルトスタイルをリセットするとか、字下げとぶら下がりをコントロールする、定義リストを横並びにするなどなど。ソース見てるだけでも楽しいCSSタイムが過ごせます。法則85では最近チラホラ見かけるようになったCSS3の属性セレクタや擬似クラスの解説もあり。

第6章 プロを感じさせるデザインの法則

実際に今稼動しているサイトを例に挙げつつポイントを解説してくれている。これまでの章と違って「見た目」のデザインの話がメイン。グリッドを意識する、余白の使い方、黄金比・白銀比、配色ルール、フォント、ナビ・・・などなどなど。

法則92の「号数活字システムで見栄えのよい文字サイズを決める」の話は珍しいなと思った。号数体系の話はあまりweb関連の本では載ってないかも。いや、私が今まで見た本には載ってた記憶がないってだけなんだけど。

付録部分も素敵。スタイルが適応されない場合のチェックポイントがあったり、各法則に関するW3Cの仕様はこの辺りに書かれてますとurlがあったり。便利です。

公式サポートサイトが登場!(2007.01.12追記)

この本の公式サポートサイトが公開されたそうです。

Web標準XHTML+CSSデザイン クリエイターが身につけておくべき新・100の法則。公式サポートサイト

書籍の内容紹介、サンプルデータのダウンロード、著者の方々のプロフィールなど、書籍に関する各種サポートを目的とされたサイトです。2007.01.12現在、まだ準備中の箇所もありましたが、今後が楽しみです。

で、同サイトのサポートブログの中でこのエントリに対してリンクして頂けました!やったやった!(←超舞い上がり中)トラックバックすら送ってないのに見つけてくださってありがとうございます!心の広いデジパの方々に感謝(n'ω'n)

<< Design Rule Index という本の話 | 雑記 >>

トラックバック

このエントリーのトラックバックURL:
http://redline.hippy.jp/cgi/mt/mt-tb.cgi/156

このページの一番上へ

その他の情報など

最近のコメント

PHP オブジェクト指向の勉強
  • Red - 2010.01.08
  • hogepage - 2010.01.21
  • Red - 2010.01.22
  • - 2011.11.27
  • houseiii - 2011.11.27
Fireworks トリミング画像を一括書出 CS4編
  • Iper - 2009.06.27
  • Red - 2009.06.27
  • mala - 2011.11.17
  • Red - 2011.11.18
jQueryでボックスを上下左右中央に簡単配置
overflow を使用したボックス背景のこと
  • - 2007.12.13
  • Red - 2007.12.13
  • - 2007.12.13
  • Red - 2007.12.13
  • hj - 2011.09.23
IE6 → 透過PNG+overflow=混ぜるな危険(追記有)

メッセージを送る

こちらのメッセージ送信フォームは閉鎖させて頂きました。
御用の方は新しい方のブログ にコメント頂くか、 連絡用のフォーム もありますので、そちらからご連絡ください。