HTMLに刻まれた
「禁断のタトゥー」
「ちょっと色を変えるだけだから」とHTMLタグに直接書かれたスタイル。
それは着替えられない服であり、消せないタトゥーです。
デザイン変更のたびに、あなたは5000箇所の「皮膚移植手術」を行うことになります。
- HTMLファイルの中に `style="..."` が大量に見つかる
- 「この文字色を変えたい」と言われた時、CSSファイルを直しても反映されない
- CMSのエディタ（WYSIWYG）が吐き出したHTMLをそのまま表示している
- メールマガジンのHTMLコーディングの癖が、Webサイト制作にも抜けない
リデザインのコストは、通常の10倍以上に膨れ上がります。
01. 着替えられない身体
HTMLは「構造（骨格）」であり、CSSは「装飾（服）」です。
インラインスタイル（`<div style="color:red">`）を書くということは、骨に直接色を塗るようなものです。
TPOに合わせて服を着替える（テーマ変更やレスポンシブ対応）ことが極めて困難になります。
インラインスタイルはタトゥー。
02. 詳細度の暴力
CSSには「詳細度（Specificity）」という強さのルールがあります。
インラインスタイルは `1000点` という圧倒的な強さを持ち、IDセレクタ（100点）やクラスセレクタ（10点）では絶対に勝てません。
これを上書きするには、禁断の呪文 `!important` を使うしかなく、コードは瞬く間に崩壊します。
03. テロリストを許すな
CMSやエディタツールが勝手に吐き出すインラインスタイルも同様の大罪です。
保存時に入力を正規化（Sanitize）し、許可されたクラス名以外はすべて剥ぎ取る処理を実装しましょう。
「便利だから」という理由で、将来の自分たちを苦しめてはいけません。