design
1.0.0
3.1 لا تستخدم أبدًا أكثر من ثلاثة محاربين على الصفحة مرة واحدة.
لماذا؟ يوضح مجموعة من المحارف المستخدمة في صفحة واحدة علامة تجارية سيئة المعرفة ويمكن أن تظهر كسولًا ومشبكًا. على الأكثر ، يمكن استخدام ثلاثة محارف مختلفة مرة واحدة (الشعار ، الرؤوس ، محتوى الجسم).
3.3 الحفاظ على تسلسل هرمي من النوع المتسق. يجب عليك فقط استخدام حفنة من أحجام الخطوط وواحد أو أوزان خط لتطوير التسلسل الهرمي للكوع. فكر في علامات رأس HTML H1 ، H2 ، H3 ، إلخ. يجب أن يكون لديك أنماط مرئية مميزة لأربعة منهم على الأقل ، باستخدام الاختلافات في السطوع والحجم والوزن للإشارة إلى أهمية النص. للحصول على مثال رائع من التسلسل الهرمي النوع ، تحقق من إرشادات الواجهة البشرية من Apple.
[3.4] حافظ على نص جسمك وزنًا طبيعيًا ومسافة جيدة. يجب أن يكون النص دائمًا مقروءًا ، لذا احجز الضوء أو الخطوط الجريئة للرؤوس الكبيرة أو الحالات التي يكون لها وزن الخط تأثير ضئيل على وضوح النص. بالإضافة إلى ذلك ، حافظ دائمًا على تباعد خط الجسم في نصك من 1.15 إلى 1.5 (حسب الحجم) لزيادة الوضوح إلى الحد الأقصى. على سبيل المثال ، تحتوي هذه المقالة على تباعد خط REM 1.5 تقريبًا. تبرير فقرات جسمك لا يضر ، أيضًا.
3.1 يجب أن تكون خلفيات الجسم دائمًا ظلال رمادية
لماذا؟ يمكن أن تخلق الخلفيات الملونة ، حتى الرمادي الداكن للغاية ، سلالة على العيون. بالنسبة للمحتوى المهم مثل نص النص لصفحة ويب أو تطبيق ، فهو يمكن للمستخدمين قراءة الصفحة وتسهيلها بسهولة.
3.3 في معظم الحالات ، استخدم نصًا أبيض على أي صورة أو خلفية ملونة أو تدرج. إذا لزم الأمر ، ضع ظل إسقاط الضوء للغاية (<= 10 ٪ عتامة) على النص.
لماذا؟ غالبًا ما يكون البيض على الظهور أكثر جاذبية من الناحية الشديدة وأسهل لإنشاء المتغيرات ل. يمكن أن يكون اتخاذ قرار باللون الداكن لاستخدامه ضد خلفية ملونة أمرًا صعبًا. ومع ذلك ، تأكد من أن كل التحرير والسرد الذي تختاره يمكن الوصول إليه أيضًا.
3.4 لا تستخدم أبدا السود المطلق.
لماذا؟ غالبًا ما يكون Black Black (#000) قاسيًا جدًا بالنسبة لمعظم صفحات الويب. حتى لون خط جسم Github هو #24292e ، وليس #000. عندما تكون في شك ، يمكنك استخدام رموز سداسية آمنة على شبكة الإنترنت ( #111 ، #222 ... #AAA ، #BBB ، وهكذا).
3.5 ضمان المكونات الملونة لا تحد بعضها البعض.
لماذا؟ ما لم تكن الألوان قوية جدًا لبعضها البعض ، غالبًا ما يمكن أن يخلق تباين لونين مجاورة إحساسًا بالاستقطاب والانقسام الذي يكسر تدفق صفحتك. في حالة المكان الذي قد يلمس فيه شريط التنقل بطلًا ملونًا ، فاختر خلفية نافذة شفافة بدلاً من ذلك.
ضمان الاتساق عبر جميع المكونات. بمجرد تحديد مصدر الضوء لصفحتك ، تأكد من أن جميع الظلال تتبع اتجاهها. إذا كان الضوء "يضرب" صفحتك على 135 درجة ، فيجب أن ينخفض كل ظل وتدرج عند 135 درجة. استخدم الظلال كأداة لتقديم التسلسل الهرمي أو الحالة. يجب استخدام الظلال لتمييز مكونات الصفحة أو توفير بنية الصفحة أو تصوير الحالة. على سبيل المثال ، يمكنك تصوير زر ما عن طريق خفض ارتفاعه بدلاً من تغيير لونه. يمكن أن تقدم الكثير من الظلال الكثير من الأبعاد ، لذا كن حذرًا (على سبيل المثال ، لا تنشئ موقعًا به 18 ارتفاعات فريدة). يجب أن تساوي إزاحة ظلالك ما يقرب من نصف دائرة نصف قطرها. على سبيل المثال ، يجب أن يكون للظل مع إزاحة x / y 10 بكسل نصف قطر ضبابي يبلغ حوالي 20 بكسل. هذا النهج يجعل الظل الأكثر أصالة. الحفاظ دائما على عتامة الظلال إلى أقل من 25 ٪. تخطئ على جانب الدقة حتى لا تنتقص من التصميم الخاص بك. إذا كنت تستخدم خلفية مظلمة ، فقد تحتاج في بعض الحالات إلى زيادة عتامة ظلالك لضمان وضوحها. لا تحتاج الظلال دائمًا إلى أن تكون أسود. عند استخدام الظلال على الأسطح الملونة ، غالبًا ما يكون من المفيد استخدام متغير مظلم جدًا أو ممتلئ بلون الخلفية لتحسين مزيج الظل.
