التيبوغرافي

Roboto

منذ إصدار نسخة ايس كريم ساندويتش للاندوريد ،  كان الخط الأساسي هو روبوتو (Roboto). في هذه النسخة تم تعديل وصقل خط Roboto بشكل موسع للعمل علي مجموعة كبيرة من المنصات المعتمدة. فهو مستدير واعرض قليلا، مما يعطيها قدر أكبر من الوضوح. تحميل خط Roboto [divider] [/divider]

الأنماط القياسية (Standard Styles)

 مقياس التيبوغرافي والأنماط الأساسية (Typographic Scale & Basic Styles) الكثير من الأحجام والأنماط في نفس الوقت يمكن أن تحطم وتدمر أي تصميم(layout).مقياس التيبوغرافي هو مجموعة محدودة من أنواع الأحجام التي تعمل بشكل جيد مع بعضها، جنبا إلي جنب مع شبكة التصميم (layout grid) . المجموعة الأساسية من الأنماط تعتمد علي مقياس التيبوغرافي من 12 ، 14 ، 16 ، 20 ، 34 . [divider] [/divider]

أمثلة لاستخدام نمط العرض (Display Style)

[divider] [/divider]

أمثلة لاستخدام نمط العنوان الرئيسي (Headline Style)

[divider] [/divider]

من خلال نماذج المعاملات، كل العناوين التي تظهر في شريط التطبيق يجب أن تستخدم نمط (style) العنوان.

أمثلة لاستخدام نمط العنوان (Title Style)

[divider] [/divider]

يوجد بعض الحالات حيث يجب استخدام نمط عنوان فرعي (Subhead) أكبر بدلا من نمط Body الأصغر.بعض هذه الحالات تتضمن عند عرض معلومات كمقتطفات صغيرة أو عند إرفاق العناوين مع أسطر نص ال Body.

[divider] [/divider]  أمثلة لاستخدام نمط العنوان الفرعي (Subhead style) [divider] [/divider] أمثلة لاستخدام نمط الهيكل ( Body style) [divider] [/divider] أمثلة لاستخدام نمط الزر ( Button Style) [divider] [/divider]

الألوان الأساسية / تباين اللون (Basic colors/Color contrast)

من المنطقي أن يكون النص الذي يكون لونه نفس لون الخلفية صعب قراءته. ما هو أقل وضوحا أن النص الذي يكون تباينه (contrast) كثير يمكن أن يلمع (dazzle) ويكون صعب للقراءة. وهذا ينطبق خاصة علي الخلفيات المظلمة.. يجب ان يحافظ النص علي نسبة تباين بحد أدني من 4.5: 1 علي الأقل (محسوبة علي أساس قيم السطوع “luminance”) لوضوح القراءة (legibility).ويفضل نسبة 7:1 لقراءة مريحة. تركيبات الألوان هذه تعتبر أيضا نسب تباين للمستخدمين ذو استجابات غير نمطية (atypical) للون.   [divider] [/divider]  أمثلة للتوافق والاقتران (Pairing) [divider] [/divider]

ارتفاع الخط (Line Height)

يتم تحديد ارتفاعات الخط (Line heights) علي اساس الحجم الفردي والوزن لكل نمط (style) لتحقيق انقرائية صحيحة و تباعد مناسب.التفاف الخط (Line wrapping) ينطبق فقط علي Body ، والعنوان الفرعي(Subhead) ، العنوان الرئيسي. جميع الأنماط والأشكال الأخري يجب أن تكون كخط واحد. [divider] [/divider]

قوانين خرق الخط / الوصل (Line breaking rules / Hyphenation)

    [divider] [/divider]

الحروف لكل طول خط

ضع في عين الاعتبار هذه النصحية للانقرائية وطول الخط من معهد Baymard: يجب أن يكون في كل سطر حوالي 60 حرف اذا كنت تريد تجربة انقرائية جيدة. وجود كمية مناسبة من الحروف في كل سطر هو المفتاح لسهولة انقرائية النص. عريض جدا – اذا كان خط النص طويل جدا فعين المستخدم ستجد صعوبة في التركيز علي النص. لأن الطول يجعل من الصعب تكوين فكرة لمكان بداية السطر ونهايته. علاوة علي ذلك يمكن أن يكون من الصعب الاستكمال من السطر الصحيح في النصوص الكبيرة. ضيق جدا – اذا كان السطر قصير جدا فالعين ستضطر إلي الانتقال في كثير من الأحيان، كسر إيقاع القارئ. الأسطر القصيرة جدا تقوم بإجهاد الناس والقارئين، مما يجعلهم يبدأوا بقراءة السطر التالي قبل الانتهاء من الحالي (وبالتالي تخطي كلمات قد تكون مهمة جدا). [divider] [/divider]

التتبع والمسافات بين الحروف

  المصدر  ]]>