يتمتع تصميم الويب عبر الهاتف المحمول بالعديد من الفوائد، ولكن فقط عند استخدامه بشكل صحيح. ستمكن التقنيات المناسبة من عرض الصفحة بشكل جيد على الشاشات الكبيرة، والشاشات الصغيرة، وشاشات المساعد الرقمي الشخصي الصغيرة. ومع ذلك، فإن بنية التعليمات البرمجية الضعيفة ستكون كارثية بالنسبة للتخطيط المرن. ولذلك، نحن بحاجة إلى إيجاد حلول مجدية لأوجه القصور في معظم تصاميم التدفق.
إذا كنت كمصمم قد بذلت جهدًا إضافيًا لإنشاء تخطيط متدفق وظيفي، فلماذا لا تذهب خطوة أبعد وتجعله متوافقًا مع جميع الدقة بدلاً من أن يقتصر على معظم الشاشات. يمكنك استخدام بعض التقنيات لإنشاء تخطيط قابل للتكيف بشكل غير متوقع ويظل سليمًا من الناحية الوظيفية مع تغير دقة الشاشة.
في هذه المقالة، سنناقش الطرق التي أثبتت جدواها لإنشاء تخطيطات CSS سريعة الاستجابة وفعالة بنسبة 100%، وسنقدم قائمة مفصلة بالبرامج التعليمية والممارسات الأخرى:
يمكنك أيضًا الرجوع إلى المقالات السابقة:
1. تخطيط السوائل باستخدام الشبكة
لقد سمع معظمنا عن نظام الشبكة 960 لتصميم صفحات الويب ذات العرض الثابت. إن استخدام نظام الشبكة 960 يجعل التصميمات ذات العرض الثابت أفضل من التخطيطات المرنة. ومع ذلك، هناك طريقة لإنشاء تخطيط مرن قائم على الشبكة. من الناحية الفنية، يختلف هيكل الكود الخاص بالتخطيط المرن عن هيكل التخطيط المرن، ولكنه يوفر نفس التأثير تقريبًا للمستخدم.
ما هو تخطيط التدفق؟
يتم إنشاء شبكات السوائل من خلال الاستخدام الذكي للتقسيمات والنسب المئوية والحسابات الرياضية البسيطة. تأتي هذه الفكرة من إيثان ماركوت، الذي أدرك أن "em" عبارة عن تحسين لحجم الخط. نعيد النظر في هذا المفهوم الأساسي هنا، ولكن للحصول على فهم شامل ومفصل لهذا النهج، راجع "Flowing Grid"، وهو برنامج تعليمي شامل حول إنشاء تخطيطات مرنة قائمة على الشبكة.
تتمثل الفكرة في استخدام الأحجام النسبية، ودمج النسب المئوية وems، واستخدام الانقسامات البسيطة للعثور على عروض البكسل المقابلة المستخدمة في التصميمات ذات العرض الثابت.
ميزة :