يعد اختيار حجم الخط جانبا مهما لإنشاء تصميم سهل الاستخدام وممتع. من خلال الوصول إلى أحجام الخطوط المختلفة ، يمكن للمصممين إنشاء مواقع وتطبيقات مبهجة من الناحية الجمالية وقابلة للقراءة.
تحدد معايير الويب نطاقا من أحجام الخطوط القياسية الموصى باستخدامها. يمكن أن تكون هذه القائمة دليلا مفيدا للمصممين والمطورين ، مما يساعدهم على إنشاء تصميم حديث ومتسق.
في هذه المقالة ، نقدم قائمة كاملة بأحجام الخطوط القياسية التي يجب مراعاتها عند تصميم مواقع الويب والتطبيقات. سنقدم أيضا توصيات ونصائح حول اختيار حجم خط معين لعناصر الواجهة المختلفة.
ملاحظة: أحجام الخطوط المدرجة أدناه هي توصيات وقد تختلف اعتمادا على التصميم والواجهة المحددة ، وكذلك على النظام الأساسي والجهاز الذي من المفترض أن يتم عرض موقع الويب أو التطبيق عليه. استخدام الحس السليم والنظر في احتياجات وتوقعات جمهورك المستهدف.
- أحجام الخطوط للعناوين
- حجم الخط الرئيسي للنص
- أحجام الخطوط للعناوين الفرعية
- أحجام الخطوط للقوائم
- أحجام الخطوط للروابط
- أحجام الخطوط للأوصاف
- أحجام الخطوط لعروض الأسعار
أحجام الخطوط للعناوين
تحتوي خطوط رؤوس صفحات الويب على أحجامها القياسية الخاصة ، المحددة في اصطلاحات تطوير مواقع الويب.
من المهم اختيار حجم الخط المناسب للعناوين الرئيسية لضمان سهولة القراءة المثلى وتركيز انتباه المستخدم على عناصر المحتوى المناسبة.
كقاعدة عامة ، يشار إلى حجم الخط للعناوين باستخدام ح1 إلى ح6 العلامات. يؤثر مستوى العنوان على أهمية العنوان وحجمه-فكلما كان الرقم أصغر ، كان الخط أصغر.
عادة ما تكون أحجام الخطوط القياسية للعناوين كما يلي:
ح2 هو خط أصغر قليلا من ح1 ، غالبا ما تستخدم للأقسام والعناوين الفرعية. يوصى باستخدام خط لا يقل عن 18 بكسل أو 1.2 إم.
ح3-حتى أصغر من ح2 ، يمكن استخدامها لرؤوس الكتل أو عناصر المحتوى الكبيرة. يوصى باستخدام خط لا يقل عن 16 بكسل أو 1.1 إم.
ح4, ح5-تستخدم للعناوين ذات المستوى الأدنى ، وعادة ما تستخدم للعناوين الفرعية أو عناوين الأقسام. يمكن أن يكون حجم الخط من حوالي 14 بكسل أو 1 متر.
ح6 هو أصغر رأس ، يمكن استخدامه للرؤوس المساعدة أو العناوين الفرعية. يمكن أن يكون حجم الخط من حوالي 12 بكسل أو 0.9 م.
بالطبع ، قد تختلف أحجام الخطوط للعناوين اعتمادا على تصميم الموقع أو تفضيلاتك ، ولكن يمكن أن تكون هذه التوصيات بمثابة أساس لاختيار حجم الخط المناسب للمحتوى الخاص بك.
حجم الخط الرئيسي للنص
توصي معايير الويب بتعيين حجم الخط الأساسي (أو حجم الخط الافتراضي) بالبكسل في النطاق من 14 إلى 16 نقطة لمحتوى الصفحة الرئيسية. يعتبر حجم الخط هذا مثاليا لأنه يوفر إمكانية قراءة كافية للنص لمعظم المستخدمين.
ومع ذلك ، قد يختلف حجم الخط اعتمادا على الجمهور المستهدف وميزات تصميم الصفحة. على سبيل المثال ، بالنسبة للمواقع التي تستهدف المستخدمين الأكبر سنا ، قد يكون من المفيد اختيار حجم خط أكبر قليلا لتحسين إمكانية القراءة. وبالنسبة لمواقع الأطفال ، يمكنك استخدام خطوط أكبر وأكثر تميزا.
من المهم أن تتذكر أن حجم الخط يجب أن يكون قابلا للقراءة ولا يسبب صعوبات عند قراءة النص على الأجهزة والشاشات المختلفة. أيضا ، لا تسيء استخدام أحجام الخطوط الكبيرة حتى لا تثير الانتباه المفرط والحمل الزائد بالمعلومات المرئية.
نتيجة لذلك ، عند اختيار حجم الخط الرئيسي للنص على صفحة الويب ، يجب أن تأخذ في الاعتبار احتياجات المستخدمين والجمهور المستهدف وميزات التصميم. سيساعد ذلك على إنشاء تمثيل مرئي مناسب وجذاب للمحتوى الخاص بك وتحسين إدراك المعلومات على موقعك.
أحجام الخطوط للعناوين الفرعية
يوصى باستخدام أحجام الخطوط التالية للعناوين الفرعية لصفحة الويب:
- - 2.5 م;
- - 2 م;
- - 1.75 م;
- - 1.5 م;
- - 1.25 م;
- - 1.1 م.
ستساعد هذه الأبعاد في التأكيد على بنية الصفحة وجعل العناوين الفرعية أكثر تعبيرا. ومع ذلك ، من المهم أن تضع في اعتبارك إعدادات الخط التي يمكن تطبيقها على موقعك. من المستحسن اختيار حجم الخط الذي يسهل قراءته ويبرز على خلفية النص الرئيسي.
أحجام الخطوط للقوائم
لتحديد حجم الخط ، يمكنك استخدام القيم التالية:
- - الحد الأدنى لحجم الخط. عادة ما يتم استخدامه للقوائم الصغيرة أو العناصر التي نادرا ما تستخدم;
- - حجم الخط القياسي لمعظم القوائم. قراءة وسهلة القراءة;
- - زيادة حجم الخط الذي يمكن استخدامه للقوائم الأكبر أو المميزة;
- - حجم الخط كبير لتسليط الضوء على العناصر الهامة أو قائمة العنوان;
- - حجم خط كبير جدا ، وهو مناسب للقوائم الكبيرة أو العناصر ذات الأهمية الخاصة;
يعتمد اختيار حجم الخط للقوائم على التفضيلات المرئية وميزات التصميم لصفحة الويب. فمن المستحسن استخدام حجم الخط الذي يوفر قراءة جيدة ويتوافق مع النمط العام وهيكل الصفحة.
أحجام الخطوط للروابط
عند تصميم موقع ويب ، من المهم اختيار حجم الخط المناسب للروابط للتأكد من أن المستخدمين يمكنهم القراءة والتنقل بسهولة.
يعتقد أن حجم الخط للروابط يجب أن يكون أكبر قليلا من باقي النص على الصفحة. عادة ما تستخدم الأحجام التالية للروابط:
- - الحجم الأكثر شعبية للروابط. يوفر سهولة قراءة ممتازة وهو كبير بما يكفي للمستخدمين للنقر بسهولة على الروابط.
- - حجم خط أكبر يضيف القليل من الحدة والتعبير إلى نص الرابط. يمكن أن يكون مفيدا للروابط أو العناوين المهمة.
- - حجم أكبر يمكن استخدامه لإنشاء التركيز على روابط أو أزرار محددة.
ومع ذلك ، يعتمد اختيار حجم الخط للروابط على تصميم وأهداف موقع الويب الخاص بك. من المهم أن تضع في اعتبارك أن الخطوط من أنواع وأنماط مختلفة قد تبدو مختلفة بنفس الحجم.
تتمثل إحدى الممارسات المقبولة في استخدام القيم النسبية ، مثل النسب المئوية أو الوحدات النسبية ، بحيث يتكيف حجم خط الروابط تلقائيا مع إعدادات المستخدم أو حجم إطار العرض.
في النهاية ، يجب أن يكون حجم الخط الصحيح للروابط قابلا للقراءة ومتسقا مع النمط العام لموقعك على الويب.
أحجام الخطوط للأوصاف
عند كتابة الأوصاف في محتوى النص ، من الضروري استخدام أحجام الخطوط التي تضمن سهولة القراءة والراحة البصرية للمستخدمين. فيما يلي أحجام الخطوط الموصى بها للأوصاف:
12 نقطة (نقطة) هو حجم الخط الذي يستخدم غالبا للأوصاف في المنشورات المطبوعة.
14 نقطة (نقطة) هو حجم الخط الذي يوفر قراءة جيدة في محتوى النص عبر الإنترنت.
16 نقطة (نقطة) هو حجم الخط الموصى به للأوصاف الطويلة أو في الحالات التي يلعب فيها التمثيل المرئي للنص دورا مهما.
18 نقطة (نقطة) هي حجم خط مثالي للأوصاف الكبيرة أو في الحالات التي تحتاج فيها إلى جذب انتباه خاص.
وتجدر الإشارة إلى أن حجم الخط الفعلي قد يختلف اعتمادا على الخط المحدد والجهاز الذي يعرضه. لذلك ، من المهم اختبار والتحقق من قابلية قراءة النص على الأجهزة المختلفة للتأكد من عرضه بشكل صحيح.
أحجام الخطوط لعروض الأسعار
عند عمل اقتباسات في النص ، ينصح باستخدام حجم خط خاص بحيث يبرز عن باقي النص. فيما يلي بعض التوصيات لأحجام الخطوط لعروض الأسعار:
اقتباسات صغيرة: لإنشاء تأثير الخفة والتركيز ، يكون حجم الخط الصغير مناسبا للاقتباسات القصيرة ، مع إبراز العبارات أو الكلمات الرئيسية.
علامات اقتباس متوسطة: إذا كان الاقتباس أطول قليلا ويحتوي على أكثر من جملة واحدة ، فمن المستحسن استخدام حجم خط متوسط. سيساعد هذا الاقتباس على التميز عن النص الرئيسي ، ولكن لا يأخذ الكثير من الاهتمام.
اقتباسات كبيرة: إذا كان الاقتباس مهما ويحتل جزءا كبيرا من النص ، فيمكنك استخدام حجم خط متزايد. سيساعد الخط الكبير في إبراز الاقتباس ولفت انتباه القارئ إلى محتواه.
من المهم أن تتذكر أن حجم الخط للاقتباسات يجب أن يكون متسقا مع النمط العام للنص ولا يخلق إزعاجا غير ضروري عند القراءة.