شرح صفوف ومحتوى الفقرة
عندما يكتب مطور الواجهة الخلفية كوده البرمجي، فإن الكود يعمل على خادم واحد معروف المواصفات تتحكم به الشركة. أما مطور الواجهة الأمامية فيكتب كوداً سيعمل على ملايين الأجهزة المختلفة التي يملكها الزوار حول العالم:
- تنوع مقاسات وأبعاد الشاشات (): قد يفتح الزائر موقعك من هاتف صغير بعرض ، أو جهاز لوحي ، أو حاسوب محمول، أو شاشة مكتبية عريضة بدقة .
- اختلاف محركات المتصفحات (): رغم تقارب المعايير القياسية اليوم، لا تزال هناك فروق دقيقة في طريقة عرض بعض العناصر بين متصفح ومتصفح على هواتف آيفون ومتصفح .
- تفاوت سرعة الإنترنت وقوة الأجهزة: يجب أن تعمل الواجهة بسلاسة حتى لدى الزائر الذي يستخدم هاتفاً اقتصادياً واتصال بيانات متنقل متوسط السرعة.
- دعم اللغات ثنائية الاتجاه (): في المواقع العربية والعالمية، يحتاج المطور إلى ضبط اتجاه الواجهة ليعمل بالعربية (من اليمين لليسار) والإنجليزية (من اليسار لليمين) بنفس الأناقة.
CSS
/* Modern CSS Grid automatically adapts columns to any screen width */
.cards-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}