CSS Nite in OSAKA ザ・ルールズ・オブ・スタイルシート by 益子貴寛

このエントリーをはてなブックマークに追加

ついにCSS Nite が大阪に上陸しちゃいました。

以下のような内容でした。

まずは益子貴寛さんのセッションから
(もうすぐCSS Nite公式ブログで当日の資料/セミナー内容のポッドキャスティングを公開するらしいので興味がある方、詳しい内容が知りたい方はそちらをご覧ください。)

ザ・ルールズ・オブ・スタイルシート by 益子貴寛

CSS NiteなんでCSSネタをと始まった『カニの貴公子』のセッションです。

「プログラムとはコンピュータへの命令ではなく、コンピューターに何をしてほしいか、人に説明することだ」という有名なプログラマの言葉を引用し「CSSもそうあるべきではないか」と始まりました。

まずはCSSの基本ルールの再確認。

などの説明。

min-/max-width/heightはIE6が対応してないので、普段使わないですがIE7で対応している為これから使ってい
かないといけないですね。

line-heightを行間と説明しているのは間違いとの指摘も印象的でした。ついつい「line-heightで行間空けて」とか注文してしまうところです。

次はテクニックとして

positionはあんまり使わないほうがいいのでないかとのこと。
個人的にはpositionは好きで多用するんですけど・・・
興味がある方はpositionプロパティの考察を参考にしてください。

floatと親ボックスの高さの問題はoverflow:autoを使って解決する方法が書かれています。
Web creators 2006年 12月号で書かれてた『すぐ使えるCSSデザインテクニック』のネタですね。
僕もこれを見たときは衝撃でした。

次はCSS2 vs CSS2.1と題して
CSS2からCSS2.1への変更点がまとめられてます。

そして本題『ザ・ルールズ・オブ・スタイルシート 』へ

意外と羅列されると守れてないルールもありますね。

『プロパティの順序を明確に』などは早い目に自分ルールを確立しておかないと後々の自分の作業の首を絞めてる感じがします。

『色の指定方法を決めておく』などは結構しっかりした自分ルールがあり『基本はキーワード』というルールがあります。
でもデザインする際にはRGB(キーワードが対応してないカラー)になるのが多いですね。
ただキーワードはレンダリングを行わなくても直感的に色が予想できるので愛用しています。

コメントは

/*
header
----------------------*/

と記述します。(益子さんに西畑式とか名付けられてしまいましたが)
鷹野さんもこの方法で記述されますね。
この記述の可読性の高さは自信を持ってお勧めできます。
基本の職業がプログラマーなので『読みやすいコメント』というのは命題でもありますから。

興味がある方はもうすぐ公開される資料とポッドキャスティングでお楽しみください。

次回は長谷川恭久さんのエコなWebデザイナーになろう。をエントリーします。

関連エントリー

web標準の日

CSS Nite in OSAKA
CSS Nite inOSAKA 前夜祭 in Apple Store 心斎橋
CSS Nite in OSAKA エコなWebデザイナーになろう by 長谷川恭久
CSS Nite in OSAKA Dreamweaverの作業効率を高める小技30発 by 鷹野雅弘

スポンサードリンク

«CSS Nite inOSAKA 前夜祭 in Apple Store 心斎橋 | メイン | javascriptで文字にドロップシャドウをつける方法»

このエントリーのトラックバックURL
http://blog.webcreativepark.net/cgi/mt/mt-bt.cgi/1364
コメント

> line-heightで行間空けて

line-heightは文字通り「行の高さ」でしょうけど、
「line-height(を大きくとる事)で行間空けて」は間違いではないのでは?

投稿者:at | 2006年11月29日 10:44

>atさん

コメントありがとうございます。

おっしゃる通り「line-height(を大きくとる事)で行間空けて」は間違いではありません。

結果としては行間を開けることを目的として使用していますし。

ただ、間違っているとは言わないけれども言葉足らずな注文になっているのではないかと感じました。

line-heightは行間を開けるCSSプロパティなんだなと理解されると、指示を出す側というか教える側としては罰がわるいですからね。

今後ともよろしくおねがいします。

投稿者:西畑 | 2006年11月30日 01:24
コメントを投稿