Rychlost Nízký dopad Snadné 30–60 min

Inline styly

Hodně style="..." zhoršuje cache a údržbu.

Co to je

Inline styly jsou CSS zapsané přímo v atributu style="..." u elementů. Ve velkém množství zvětšují HTML a nedají se cachovat ani znovu použít.

Proč to řešit

HTML s množstvím inline stylů je větší (přenáší se při každém načtení) a hůř se udržuje. Výjimkou je záměrné inline „critical CSS" v hlavičce kvůli rychlosti.

Jak na to

1Přesuň opakované styly do externího/sloučeného CSS s třídami.
2Inline ponech jen pro skutečně jedinečné, dynamicky počítané hodnoty.
3Záměrné critical CSS v <head> je v pořádku, to není totéž.

Závěr

Nízká priorita, spíš otázka čistoty a cachovatelnosti. Hromadné inline styly přesuň do tříd; výjimkou je vědomé critical CSS. Neřeš dřív než váhu obrázků a blokující zdroje.

Související témata