الخط هو أحد العناصر الرئيسية لتصميم الويب. إنها الوسيلة الرئيسية لنقل المعلومات وتضع النمط العام والجو العام لصفحة الويب. حجم الخط هو معلمة مهمة ، لأنه يحدد قابلية قراءة النص وإدراكه البصري.
هناك العديد من وحدات الخط في هتمل. واحدة من الأكثر شيوعا هو بكسل (بكسل). البكسل هو وحدة قياس مطلقة تحدد حجم الخط على مستوى البكسل. يظل حجم الخط هذا دون تغيير تقريبا على جميع الأجهزة.
هناك طريقة أخرى لتعيين حجم الخط وهي استخدام وحدات القياس النسبية مثل إم و ريم. توفر وحدات القياس النسبية مرونة لحجم الخط ، لأنها تعتمد على العنصر الأصلي. تحدد وحدة إم حجم الخط بالنسبة لحجم خط العنصر الأصل ، وتحدد وحدة ريم حجم خط العنصر الجذر (عادة هتمل أو الجسم).
وحدة أخرى لقياس الخط هي النقطة (نقطة). غالبا ما تستخدم هذه الوحدة في المنتجات المطبوعة ولها أبعاد قريبة من وحدات البكسل. تشير النقطة إلى وحدات القياس المطلقة ولا تعتمد على شاشة المستخدم أو إعدادات المتصفح.
- المفاهيم الأساسية وميزات أحجام الخطوط في هتمل
- أحجام الخطوط بالبكسل (بكسل)
- أحجام الخطوط في الوحدات النسبية (م)
- أحجام الخطوط في الوحدات النسبية (ريم)
- أحجام الخطوط بالنقاط (نقطة)
- جدول يقارن أحجام الخطوط بوحدات مختلفة
- مزايا استخدام الوحدات النسبية
- كيفية اختيار حجم الخط المناسب للنص
المفاهيم الأساسية وميزات أحجام الخطوط في هتمل
- بكسل (بكسل) هي وحدة مطلقة لقياس الخط تشير إلى عدد معين من وحدات البكسل في ارتفاع أو عرض الحرف. يتم تعيين حجم الخط بالبكسل بقيمة رقمية ، على سبيل المثال ، حجم الخط: 14 بكسل. عادة ما يتوافق بكسل واحد مع بكسل مادي واحد على الشاشة. ومع ذلك ، يجب ألا يغيب عن البال أن أحجام البكسل قد تختلف على الأجهزة والشاشات المختلفة ، مما قد يؤثر على إدراك النص.
- الوحدات النسبية إم و ريم-تسمح لك بتعيين أحجام الخطوط بالنسبة لحجم الخط الأساسي ، والذي تم تعيينه على مستوى العنصر الأصلي أو بواسطة إعدادات المتصفح. تتوافق قيمة 1 م مع حجم الخط الأساسي. على سبيل المثال ، إذا كان الخط الأساسي هو 16 بكسل ، فسيكون 1 دقيقة 16 بكسل. من خلال تعيين قيمة الخط في إم أو ريم ، يمكننا بسهولة تغيير حجم النص اعتمادا على السياق وإعدادات المستخدم. تعتبر الوحدات النسبية مفيدة بشكل خاص عند إنشاء إصدارات سريعة الاستجابة ومتنقلة من مواقع الويب ، عندما يجب أن تتغير أحجام الخطوط تلقائيا اعتمادا على حجم الشاشة أو الجهاز.
- النقاط (نقطة) هي وحدات قياس الخط المستخدمة في الطباعة. نقطة واحدة حوالي 1/72 من البوصة. في هتمل ، يشار عادة إلى حجم الخط في الفقرات باستخدام قيمة من حوالي 9 إلى 12 نقطة. ومع ذلك ، تجدر الإشارة إلى أنه على الشاشة ، قد تختلف أحجام الخطوط في النقاط عما هو متوقع ، حيث سيتم قياسها اعتمادا على دقة الشاشة وإعدادات المتصفح.
يعتمد اختيار وحدة حجم الخط في هتمل على المتطلبات المحددة وسياق الاستخدام. عادة ما تستخدم وحدات البكسل لتعيين حجم الخط الدقيق ، في حين أن الوحدات النسبية لـ م و حركة العين السريعة تجعل من السهل تغيير حجم النص اعتمادا على السياق. يمكن أن تكون العناصر مفيدة للطباعة أو عندما يكون من الضروري الامتثال لمعايير معينة لحجم الخط.
أحجام الخطوط بالبكسل (بكسل)
. على سبيل المثال ، لتعيين حجم الخط إلى 14 بكسل ، يمكنك استخدام القاعدة التالية:
| بناء الجملة | الوصف |
|---|---|
حجم الخط: 14 بكسل; | يضبط حجم الخط على 14 بكسل |
سيتم إصلاح حجم الخط المحدد ولن يتغير عند تغيير حجم نافذة المتصفح أو جهاز العرض. يمكن أن يكون هذا مفيدا إذا كنت تعرف بالضبط حجم الخط الذي سيكون مناسبا للقراءة على شاشة أو جهاز معين.
أحجام الخطوط في الوحدات النسبية (م)
تسمح لك وحدات الخط النسبية بتعيين حجم الخط بالنسبة إلى حجم العنصر الأصل. عند استخدام وحدة م ، يتم تحديد القيمة فيما يتعلق بحجم الخط الحالي للعنصر الأصل.
وحدة إم يساعد على خلق تصميم التكيف ومرنة ، وحجم الخط سوف مقياس تلقائيا اعتمادا على المعلمات التي حددها المستخدم.
على سبيل المثال ، إذا كان للعنصر الأصل حجم خط 16 بكسل ، وكان للعنصر الفرعي قيمة حجم خط 0.5 م ، ثم سيكون حجم الخط الفعلي للعنصر الفرعي 8 بكسل (16 بكسل*0.5).
يمكن أيضا استخدام وحدة إم لتعيين الهوامش وأحجام الكتل والعناصر الأخرى.
مزايا استخدام وحدة إم:
- المطاط. سيتم تحجيم الخط وفقا لإعدادات المستخدم.
- القدرة على التكيف. يسمح لك حجم الخط النسبي بإنشاء تصميم تكيفي يتم عرضه بشكل صحيح على أجهزة مختلفة.
عند اختيار استخدام وحدة إم ، فمن الجدير بالذكر أنه يشير إلى حجم الخط الحالي للعنصر الأصل ويمكن أن تكون موروثة مزيد من أسفل التسلسل الهرمي. أيضا ، عند استخدام وحدة إم ، ضع في اعتبارك أنه عند وراثة أحجام الخطوط ، يمكن أن يكون للتسلسل الهرمي للعناصر تأثير كبير على حجم الخط النهائي.
أحجام الخطوط في الوحدات النسبية (ريم)
). قيمة 1 ريم تساوي حجم الخط المحدد لعنصر الجذر.
تتمثل ميزة استخدام حركة العين السريعة في أن أحجام الخطوط المحددة في حركة العين السريعة سيتم توريثها تلقائيا لجميع العناصر المتداخلة. إذا قمت بتغيير حجم الخط للعنصر الجذر ، فسيتم أيضا تحديث جميع أحجام الخطوط المحددة في حركة العين السريعة تلقائيا.
على سبيل المثال ، إذا قمت بتعيين القاعدة التالية في كس:
أتش تي أم أل {حجم الخط: 16 بكسل؛}
ثم سيكون لجميع أحجام الخطوط المحددة في حركة العين السريعة قيمة 16 بكسل. إذا قمت ، على سبيل المثال ، بتعيين:
ف {حجم الخط: 1.5 ريم؛}
ثم سيكون حجم الخط للفقرات 24 بكسل (1.5 * 16 بكسل).
يساعد استخدام الوحدات النسبية مثل حركة العين السريعة في إنشاء تخطيط مرن وقابل للتكيف يتم قياسه تلقائيا اعتمادا على حجم الخط المحدد لعنصر الجذر.
أحجام الخطوط بالنقاط (نقطة)
نقطة واحدة (1 نقطة) هي 1/72 من البوصة. هذا يعني أنه في حالة زيادة عرض شاشة الجهاز ، سيبدو الخط في النقاط أصغر مقارنة بالخط المحدد بالبكسل أو الوحدات النسبية الأخرى.
مثال على تعيين حجم الخط بالنقاط:
يحتوي هذا النص على حجم خط 12 نقطة.
وبالتالي ، لتعيين حجم الخط بالنقاط ، يتم استخدام خاصية حجم الخط في سمة النمط ، مع تحديد قيمة الحجم ووحدة القياس (على سبيل المثال ، نقطة).
ومع ذلك ، يجب ألا يغيب عن البال أن الخط في النقاط قد يكون أصغر وأقل قابلية للقراءة على الشاشات ذات الكثافة العالية للبكسل. لذلك ، في معظم الحالات ، يوصى باستخدام وحدات البكسل (بكسل) أو الوحدات النسبية مثل إم أو ريم لتعيين أحجام الخطوط في هتمل.
جدول يقارن أحجام الخطوط بوحدات مختلفة
يلعب حجم الخط في تصميم الويب دورا رئيسيا في إنشاء محتوى جيد القراءة وفعال. هناك عدة وحدات لقياس حجم الخط في هتمل ، كل منها له خصائصه الخاصة.
| وحدة القياس | الوصف |
|---|---|
| من بكسل | حجم الخط بالبكسل. بكسل واحد يتوافق مع نقطة واحدة على الشاشة. وحدات البكسل هي وحدة قياس مطلقة وعادة ما تستخدم لتعيين حجم الخط بدقة. |
| م | وحدة قياس نسبية تعتمد على حجم خط العنصر الأصل. تتوافق القيمة 1 م مع حجم خط العنصر الأصل. على سبيل المثال ، إذا كان حجم خط العنصر الأصلي هو 16 بكسل ، فسيكون حجم الخط 1 م أيضا 16 بكسل. |
| ريم | ). على سبيل المثال ، إذا كان حجم خط العنصر الجذر هو 16 بكسل ، فسيكون حجم الخط 1 ريم أيضا 16 بكسل. |
| حزب العمال | حجم الخط في النقاط. نقطة واحدة تقابل حوالي 1/72 من البوصة. النقاط هي وحدة قياس مطلقة وتستخدم بشكل شائع للمواد المطبوعة. |
يعتمد اختيار وحدة القياس على متطلبات التصميم المحددة وسياق صفحة الويب. من المهم أن تضع في اعتبارك أن الأجهزة والمتصفحات المختلفة قد يكون لها إعدادات مختلفة لقياس الخطوط وعرضها ، لذلك من الضروري اختبار مظهر المحتوى والتحقق منه بأحجام خطوط مختلفة.
مزايا استخدام الوحدات النسبية
استخدام الوحدات النسبية لتحديد أحجام الخطوط في كود هتمل له العديد من المزايا على استخدام الوحدات المطلقة:
- القدرة على التكيف: تسمح لك الوحدات النسبية بإنشاء خطوط تتكيف مع التغييرات في حجم الشاشات والأجهزة ، مما يوفر عرضا أفضل للمحتوى على الأجهزة المختلفة.
- تعدد الاستخدامات: تسمح لك الوحدات النسبية باستخدام نفس قيمة حجم الخط لعناصر الصفحة المختلفة ، مما يساعد على جعل التصميم أكثر اتساقا واتساقا.
- المرونة: الوحدات النسبية تجعل من السهل تغيير أحجام الخطوط اعتمادا على احتياجات المستخدم وتفضيلاته ، على سبيل المثال ، باستخدام إعدادات المتصفح أو قواعد كس.
- سهولة الدعم: توفر الوحدات النسبية دعما أبسط وأكثر ملاءمة لقابلية التوسع وتقريب النص على صفحة الويب ، مما يساهم في تحسين إمكانية الوصول وسهولة الاستخدام للمستخدمين.
- سهولة الاستخدام: من السهل تعيين الوحدات النسبية في كود هتمل وتغييرها ، لأنها تعتمد على القيم النسبية بناء على حجم الخط الأساسي للعنصر الأصل أو العنصر الجذر للمستند.
بشكل عام ، يعد استخدام الوحدات النسبية عند تحديد أحجام الخطوط نهجا أكثر مرونة وسهولة في الاستخدام يوفر قدرة أفضل على التكيف وإمكانية الوصول إلى صفحات الويب ، فضلا عن تحسين توحيد التصميم واتساقه.
كيفية اختيار حجم الخط المناسب للنص
يلعب اختيار حجم الخط الصحيح دورا مهما عند إنشاء صفحة ويب. يؤثر على تصور المستخدم وسهولة قراءة النص. في هتمل ، هناك عدة وحدات القياس التي يمكن استخدامها لتعيين حجم الخط: بكسل ، إم ، ريم ، و بت.
1. بكسل (بكسل)
هذه هي الوحدة المطلقة لقياس الخط بالبكسل. من خلال تعيين حجم الخط بالبكسل ، ستحدد بالضبط الحجم الذي سيكون عليه على الشاشة. ومع ذلك ، نظرا لتثبيته الصارم ، يمكن تغيير حجم النص بصعوبة ولن يكون دائما قابلا للقراءة على أجهزة مختلفة.
2. الوحدات النسبية (إم و ريم)
) عنصر.
3. النقاط (نقطة)
النقاط هي وحدة القياس المطلقة المستخدمة في الطباعة. تستخدم وحدة القياس هذه أيضا على نطاق واسع في تطوير الويب. من خلال تعيين حجم الخط في الفقرات ، يمكنك تحقيق قراءة جيدة للنص في المستندات المطبوعة. ومع ذلك ، على الشاشات عالية الدقة ، قد تبدو العناصر صغيرة جدا.
عند اختيار حجم خط لنص ما ، من المهم أن تأخذ في الاعتبار ليس فقط سهولة قراءته ، ولكن أيضا الجانب الجمالي. يجب أن يتطابق حجم الخط مع تصميم الموقع ويضمن قراءة مريحة للمستخدم. يوصى بإجراء اختبار على أجهزة مختلفة للتأكد من أنه مرئي بشكل صحيح.