1. يجب وضع CSS فوق الهيكل (عادةً ما يتم وضعه داخل عنصر الرأس). CSS هي لغة مترجمة، ولن يعرض Firefox وIE أي شيء حتى ينتظروا اكتمال نقل CSS. فقط من خلال إضافة CSS مسبقًا، يمكن عرض الصفحة عندما يقوم المتصفح بتحليل البنية.
مثال على كود المصدر:
يؤدي هذا إلى مشكلة الشاشة البيضاء الفارغة، حيث تظل الصفحة فارغة تمامًا حتى يتم تنزيل ورقة الأنماط في الأسفل، في غضون 6 إلى 10 ثوانٍ لهذه الصفحة. وينتظر المتصفح تحميل ورقة الأنماط قبل أن يعرض أي شيء آخر الصفحة، وحتى النص الثابت.
والمشكلة الناتجة هي أن الصفحة ستكون "بسيطة" لفترة من الوقت، وفجأة "رائعة" مرة أخرى، مما يؤدي إلى تجربة مستخدم سيئة للغاية.
2. حاول استخدام طريقة استيراد النمط ، وقلل من استخدام @import، ناهيك عن استخدام مستويات متعددة من @import المتداخلة. لأنه في IE، @import يعادل وضع في نهاية الصفحة.
مثال كود المصدر
يعد هذا بناء جملة صالحًا، ولكن على الرغم من وجوده في رأس المستند، فإنه يكسر العرض التدريجي ويؤدي بدلاً من ذلك إلى ظهور شاشة بيضاء فارغة ووميض غير منمق