- 2007-03-13 (Tue) 18:46
- (X)HTML/CSS
<p>この部分は<span class="red">期末試験の範囲</span>だよ！</p>.red {
color: red;
}とか。
.alignright {
text-align: right;
}とか、
.left {
float: left;
}とか、
.hidden {
display: none;
visibility: hidden;
}とか、
.clearfix:after {
display: block;
visibility: hidden;
clear: both;
height: 0;
content: ".";
}とか。
視覚効果のために文章構造を変えるのはよろしくない
さんざん言われていることだけれども、未だに上記のようなことが書かれているエントリがあがっていたりして、少し悲しく思うのでした。いくらサイトデザインの面で楽になる、サイトのメンテナンス性が向上するからとはいえ、そのために文章構造を変化させるのは本末転倒ではないでしょうか。".clearfix"など、気持ちはわからなくもないですが、右に寄せたいからrightと名付けたり、非表示にしたいからhiddenと名付けたりするのはよろしくないですよね。
ある程度妥協しなければならない場面もある
とはいえ、現状ではCSSの仕様通りに実装されていないせいで文章構造が冗長にならざるを得なかったり、どうしてもそのままでは表現しきれないデザインであったりする場合は妥協することもありますよね。それがプライベートではなくビジネスならなおさらだと思います。マークアップって難しい。
結局なにが言いたいかというと...
下の会話文が書きたかっただけなのです。みなさん怒らないでっ
HTMLくんとCSSちゃん
- CSSちゃん:
- HTMLくん、どう？強調してあげたいところを赤字にしたいときにclass="red"とか用意しておけばあちこち使えて便利じゃない？
- HTMLくん:
- 同じデザインにスタイルを適用させるために、汎用化するのはいいよね！そこは認めるよ！でも重要な部分すべてにclass="red"は認めないよ！
- CSSちゃん:
- class="red"でもいいじゃない、コードを見ても「その部分が赤になる」ってわかりやすいし！
- HTMLくん:
-
じゃあたとえばさ...
<p>この年の運動会は、<span class="red">白組</span>の勝利！</p>これだと、文章構造としては"白組"なのに"red"って意味がついちゃうよ？
- CSSちゃん:
- うう...なら赤組が勝ったことにしちゃおうよ！
- HTMLくん:
- その発想はなかったわ