clearfixと言うclass名について一考

ネガティブマージンに関する記事を検索していたらたまたまこのような記事に出会いました。

class名に「表示に関する指示を組み込む」ことについて

要するに『class名に視覚的な内容を示すのはセマンティックに反するので、その要素が意味することが伝えられる名前にしなさい。』とのこと。

clearfixはとても便利で汎用的なclassとして用意して使うケースがほとんどのはず。中にはこんな感じで単独で記入する場合もあります。

div#wrapper:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
div#wrapper {display: inline-table;}
/* Hides from IE-mac \*/
* html div#wrapper {height: 1%;}
div#wrapper {display: block;}
/* End hide from IE-mac */

ただこの場合、同じ記述が何度も出てくるので僕の場合、滅多に使う事が無い気がします。

僕の場合Movable Typeを使うようになってから、clearfixと言うclass名ではなくpkgと言うclass名で使ってます。なぜかと言うとMovable Typeのデフォルトcssにこの名前で記述されてたからです(笑)

pkgってのはおそらくはpackageの略だろうと勝手に思って使っています。そのグループをパッケージ=ひとまとめにすると言う意味で考えると、clearfixと言う名前よりはセマンティックに配慮されている気がします。

じゃあそのままpackageってclass名にすれば良いじゃないか?となるんですが、Dreamweaverを使ってる立場から複数のclass名を入力する際に、汎用性のあるclassは短い名前の方が便利なんですよね。

実際はやはり汎用性のあるclassを用意する場合、視覚的な内容を名前に付けてしまったりするのですがね。出来る限り使わないようにはしていますが...