接続に失敗しました。もう一度試してください。

コンテンツにスキップ
SEO Tools
ヘルプとドキュメント
速度 小さな影響 簡単 30~60分

インラインスタイル

style="..." が多すぎると、キャッシュと保守性が悪化します。

それは何ですか

インライン スタイルは、要素の style="..." 属性に直接記述される CSS です。大量に存在すると HTML が拡大し、キャッシュしたり再利用したりできなくなります。

なぜそれに対処するのでしょうか?

多くのインライン スタイルを含む HTML はサイズが大きくなり (ロードごとに転送される)、保守が難しくなります。例外は、速度向上のためにヘッド内に意図的にインライン化された「クリティカル CSS」です。

やり方

  1. 1繰り返されるスタイルを外部/クラスと組み合わせた CSS に移動します。
  2. 2真に一意で動的に計算される値の場合にのみインラインに保持します。
  3. 3<head> 内の意図的なクリティカル CSS は問題ありませんが、それは同じではありません。

結論

優先度は低く、クリーンさとキャッシュ可能性が重要です。一括インライン スタイルをクラスに移動します。例外は、意図的にクリティカルな CSS です。画像の重みやリソースのブロックの前に対処しないでください。

関連トピック