الدرس 2: مقياس الطباعة والتباعد — إيقاع بصري نابع من نظام
يسلّمك مصمّم نموذجًا أوّليًا يحتوي على 11 حجم خط مختلفًا و7 قيم تباعد عشوائية. بدون مقياس، تبدو كل شاشة مختلّة قليلًا. يعلّمك هذا الدرس تعريف `type scale` و`spacing scale` كتوكنز في `tailwind.config.ts` — خطوات ثابتة تصنع إيقاعًا بصريًا بدلًا من التخمين.
المقياس مثل مقاسات الأحذية: هناك مجموعة ثابتة من الخطوات يتشاركها الجميع، بدلًا من قياس كل قدم بالمليمترات العشوائية. هكذا ينتهي الأمر بكل الأزواج متناسقة.
- مقياس الطباعة
- مجموعة محدّدة من أحجام الخطوط تتصاعد بنسبة ثابتة — مثل `sm` و`base` و`lg` و`xl` — بحيث يُختار كل نص من مجموعة صغيرة من الخطوات بدلًا من حجم حر.
- مقياس التباعد
- مجموعة من توكنز التباعد مبنية على وحدة أساس (عادةً 4px) — `1` و`2` و`4` — تغذّي padding وmargin وgap بحيث تتراصف كل فجوة في الواجهة مع الشبكة نفسها.
- المقياس المعياري
- مقياس يكون فيه كل خطوة هي الخطوة السابقة مضروبة في نسبة ثابتة (مثل 1.25) — ما يمنح الطباعة تدرّجًا منسجمًا بدلًا من قفزات عشوائية.
- وحدة الأساس
- الرقم الصغير الذي تكون كل قيمة تباعد من مضاعفاته — عادةً 4px أو 8px — بحيث تنقسم كل قيمة في الشبكة عليه ولا تقع أي فجوة 'بين' الخطوات.