マークアップのクオリティを上げるって?

CSS HappyLifeさんのトコロで「今よりちょっとだけクオリティを上げるために。」という記事を拝読したので、自分用のメモをしておく。

ものすご〜くザックリとまとめると

“志は高く。でも柔軟にね”という事だと思う。
これってなんでもそうだけど、「最終的にどうしたいか」「それは何でなのか?」という事を忘れちゃうと、結果、「クオリティって、何を基準に言ってるのさ」と意味無しな感じになっちゃう。

正しい(X)HTMLを書くべきなのはもちろんだけど、目的は正しい(X)HTMLを書く事じゃないって事。
その先に、利用者はもちろん、クライアントさまや自分の所属する会社や自分自身の利益がないとね。

だから、(管理・運営も自社でやるならまた別だけど)多少冗長になってもclassを付けるってのは賛同できます。
ただ、できれば減らしたいので最近は後でIE6が切りやすいように書く事を心がけています。

「クオリティが上がってる状態ってのが、いまいちピンと来ないな。。。」と思いつつ、以下は、自分なりに気を付けたい事をメモる。

気をつけたい事

Definition Listの使い道

何となく、「タイトル:内容」みたいな文章構造の時に、なんでも使ってしまいがち。

あくまで、定義語リストなので、単純に後に続く内容をまとめた程度のものであれば(当然だが)「hn:内容」とすべきで、dl使うとdivで囲うよりスッキリしてる気になってしまう事に注意したい(あくまで個人的な感覚です)。

と言いつつ、「定義語リスト」という使い道に限定されている訳でもない曖昧な定義なんだよな。。。でも、そこを個人任せにすると複数人で管理する時にグチャグチャになっちゃうから、「定義語以外には使わない」って決めちゃった方が良いと思う。

Ordered Listの使い道

なんか、デザインや原稿に番号付きで書かれてると、何も考えないでolにしちゃう事が多い。

HTML書くのって、タイミング的に「すでにだいぶ押してます」って事が多いせいもあるけどそこに甘えちゃいけないよね。 って事で気を付けたい。

結構、「これって順番関係ないよね」っていうパターンはある。
たぶん、CSS HappyLifeさんで書かれていた「デザインから要素を選ばないよーに。」という項はそんな感じなのかな?

でも、「これって別に表じゃないよね」って反論しても通らない事はあるので、そこは柔軟に対応したい。

プロパティの指定順序は統一するよーに。の件

これは、かなり気をつけている。というより、もうクセです。
なので、人が書いたCSSは正直キモイ事が結構多いっす。
指定順序もそうだけど、一括指定できるプロパティはできるだけ一括指定にしたり、後で検査しやすくて、可読性の高い書き方をしたいです。

でも、CSSにはHTML程は気を使ってないかな。。。

HTMLはきれいに書いておくと次のリニューアルの時に重宝するけど、CSSはきっと一から書き直しだもんね。

それに、デザインがきちんと計画的に作られていれば、後でCSSファイルをチコチコいじくる事は少ないはず。

横幅も大事だけど、縦幅にも気を使って。の件

これは、結構難しい問題だと思います。

単純にピクセル単位でチコチコ合わせて行く事はできるけど、テキストの部分は「どんなフォントか」「解像度は?」「OSは?」「フォントサイズは?」と、利用者の環境に左右される部分が大きいし、そもそもが、「好きに見たい派」な僕はカッチカチに組みたくないんだよな。。。

でも、デザインによって(特にサイトのトップページなど情報量が多い場合)は、そうも言ってられない事が多いのも事実。

そんな時はline-heightの計算にハマらない様、フォントサイズごとに、上下にどのくらいの余白が発生するか、予めメモっておくとラク。

だけどやっぱり、個人的な好みは「相対的にこの程度の余白があれば読み易い」という狙いでデザイン。
そんな感じで作ってくれるデザイナーさんと働くと書き甲斐があるってものです。

まあ、そもそも「これって狙いなの? 間違い?」な素材である事が多くて困る。