Používateľ vidí bielu obrazovku pred načítaním štýlov. Ako vyriešiť problém?

Biely displej pred načítaním štýlov sa zvyčajne objaví, pretože prehliadač najskôr načíta HTML, ale štýly ešte nie sú aplikované. Riešenie problému:

• Použite kritické CSS — vložte minimálne CSS potrebné na zobrazenie prvého displeja priamo do HTML.
• Minimalizujte a spojte CSS súbory, aby ste znížili počet požiadaviek.
• Použite atribúty rel="preload" alebo rel="prefetch" na zrýchlenie načítania štýlov.
• Odložte načítanie menej dôležitých štýlov, aby ste nezablokovali vykresľovanie.

Príklad vloženia kritického CSS:

<style>
  /* minimálne štýly pre prvý displej */
  body { margin: 0; font-family: Arial; }
  .header { background: #333; color: white; padding: 10px; }
</style>