Szybkość Niski wpływ Łatwe 30–60 min

Style inline

Dużo style="..." pogarsza cache i utrzymanie.

Co to jest

Style inline to CSS zapisany bezpośrednio w atrybucie style="..." przy elementach. W dużej ilości powiększają HTML i nie da się ich cachować ani ponownie używać.

Dlaczego warto to rozwiązać

HTML z mnóstwem stylów inline jest większy (przesyłany przy każdym wczytaniu) i trudniejszy w utrzymaniu. Wyjątkiem jest celowy inline „critical CSS” w nagłówku ze względu na szybkość.

Jak to zrobić

1Przenieś powtarzające się style do zewnętrznego/połączonego CSS z klasami.
2Inline pozostaw tylko dla naprawdę unikalnych, dynamicznie obliczanych wartości.
3Celowy critical CSS w <head> jest w porządku, to nie to samo.

Podsumowanie

Niski priorytet, raczej kwestia czystości i możliwości cachowania. Masowe style inline przenieś do klas; wyjątkiem jest świadomy critical CSS. Nie zajmuj się tym przed wagą obrazów i zasobami blokującymi.

Powiązane tematy