يلعب تنسيق الخط دورا مهما في إنشاء تصميم فعال ونقل المعلومات على صفحة الويب. هناك العديد من المعلمات الأساسية التي تساعد على تحقيق التأثير المرئي المطلوب وزيادة سهولة قراءة النص.
حجم الخط هو أحد خيارات التنسيق الأساسية. وهو مسؤول عن تحديد ارتفاع الحروف والمسافة بينهما. يعتمد حجم الخط الأمثل على سياق النص والغرض منه ، ولكن يتم استخدام القيم من 12 إلى 16 نقطة بشكل أساسي.
عائلة الخط مهمة أيضا. تعطي عائلات الخطوط المختلفة النص طابعا ومزاجا مختلفين. على سبيل المثال ، الخطوط الرقيقة مثل تايمز نيو رومان غالبا ما تستخدم لطباعة المستندات ، بينما الخطوط غير الرقيقة مثل اريال أكثر شيوعا على صفحات الويب.
تحدد جرأة الخط كيفية تمييز النص. يؤكد الخط الغامق على الأهمية ويسلط الضوء على الكلمات الرئيسية أو العبارات.
تتضمن خيارات تنسيق الخط المهمة الأخرى اللون والربط (تباعد الأسطر) والمحاذاة الأفقية والرأسية للنص واستخدام تأثيرات إضافية مثل التسطير أو يتوسطه خط.
- خيارات تنسيق الخط الأساسية
- حجم الخط
- عائلة الخط
- تشبع الخط
- تباعد الحروف
خيارات تنسيق الخط الأساسية
عند العمل مع النص على صفحات الويب ، يتم إيلاء اهتمام خاص لتنسيق الخط. يتيح لك ذلك تحسين إمكانية قراءة المحتوى وإنشاء تصميم موقع ويب ممتع من الناحية الجمالية. هناك العديد من خيارات تنسيق الخط الأساسية في هتمل:
- عائلة الخط-تحدد عائلة الخطوط التي سيتم استخدامها لعرض النص. على سبيل المثال ، أريال ، تايمز نيو رومان.
- حجم الخط-يحدد حجم الخط. يتم قياسه بالبكسل أو النسب المئوية أو وحدات القياس الأخرى. على سبيل المثال ، 12 بكسل.
- الخط-الوزن-يحدد محتوى الدهون في النص. يمكن أن تكون القيم عادية (قياسية) أو جريئة (جريئة) أو قيمة رقمية تشير إلى محتوى دهون معين.
- نمط الخط-يحدد نمط النص. يمكن أن تكون القيم طبيعية (قياسية) أو مائلة (مائلة) أو مائلة (مائلة).
- زخرفة النص-يحدد التصميم الزخرفي للنص. على سبيل المثال ، تضيف قيمة التسطير شرطة سفلية إلى النص.
- محاذاة النص-يضبط محاذاة النص داخل العنصر. القيم الممكنة: يسار (يسار) ، مركز (وسط) ، يمين (يمين).
باستخدام هذه المعلمات مع كس يسمح لك لخلق مجموعة متنوعة من أنماط النص والتأكيد على تفرد والتفرد من المحتوى على صفحات الويب. من خلال الجمع بين قيم المعلمات ، يمكنك تحقيق تأثيرات مثيرة للاهتمام وتكييف الخطوط مع الأجهزة المختلفة ودقة الشاشة.
حجم الخط
يعتمد حجم الخط الأمثل على السياق والغرض منه. بالنسبة لمعظم المواد النصية ، يوصى باستخدام حجم خط في النطاق من 14 بكسل إلى 18 بكسل. إذا كان النص مخصصا للقراءة على الأجهزة المحمولة ، فيمكن تقليل حجمه إلى 12 بكسل أو 13 بكسل للحفاظ على سهولة القراءة على الشاشات الصغيرة. بالنسبة للعناوين الرئيسية أو عناصر التمييز الأخرى ، يمكنك استخدام أحجام خطوط أكبر لجذب انتباه القارئ.
عند تحديد حجم الخط في كس ، يمكنك أيضا استخدام وحدات القياس النسبية ، مثل إم أو ريم. يتيح لك استخدام الوحدات النسبية إنشاء تخطيط أكثر مرونة وتكيفا يتكيف مع أحجام الشاشة المختلفة. على سبيل المثال ، بدلا من استخدام قيمة ثابتة بالبكسل ، يمكنك تحديد حجم الخط في إم أو ريم بالنسبة لحجم خط العنصر الأصل أو العنصر الجذر للمستند.
يساعد اختيار حجم الخط المناسب في إنشاء تجربة بصرية ممتعة للقراء والتأكد من سهولة قراءة النص. من المهم أن تتذكر أن اختيار حجم الخط الأمثل يتطلب توازنا بين قابلية القراءة والجوانب الجمالية للتصميم.
عائلة الخط
. لتحديد عائلة خطوط ، يجب تحديد اسم الخط أو مجموعة الخطوط ، مفصولة بفواصل. إذا قمت بتحديد خطوط متعددة ، فسيبحث المتصفح عن الخط المناسب بالترتيب المحدد حتى يعثر على الخط المناسب.
على سبيل المثال:
| عائلة الخط | أمثلة |
|---|---|
| أريال ، بلا شريف | أريال ، هلفتيكا ، بلا شريف |
| "تايمز نيو رومان" ، شريف | تايمز نيو رومان ، تايمز ، الرقيق |
| فيردانا ، أريال ، بلا شريف | فيردانا ، أريال ، هلفتيكا ، سانس شريف |
إذا لم يتم العثور على الخط المحدد على جهاز الكمبيوتر الخاص بالمستخدم ، فسيقوم المتصفح تلقائيا باستبداله بخط آخر من العائلة المحددة أو الخط الافتراضي.
من الممارسات الجيدة تحديد عائلة خطوط تحتوي على خط بنوع خط محدد مسبقا (على سبيل المثال ، أريال) وعائلة خطوط مشتركة (على سبيل المثال ، بلا الرقيق) من أجل ضمان تعدد استخدامات عرض النص على أجهزة وأنظمة تشغيل مختلفة.
تشبع الخط
في هتمل ، يمكن تحديد تشبع الخط باستخدام خاصية وزن الخط. يمكن أن تكون قيم هذه الخاصية:
- عادي-تشبع الخط العادي (افتراضي);
- غامق-خط غامق مع تشبع كامل;
- أخف — خط مع تشبع أخف;
- أكثر جرأة هو الخط مع تشبع أثقل;
- 100-900 هي قيم رقمية محددة ، حيث 100 هو أدنى تشبع ، و 400 تشبع طبيعي ، و 900 هو أعلى تشبع.
مثال الاستخدام:
النص مع تشبع أثقل.
النص مع تشبع معين (700).