ما هي مجموعات الخط العامة في CSS؟

تصنيفات الخطوط العامة المتاحة للاستخدام على موقع الويب الخاص بك

عند تصميم أحد مواقع الويب ، فإن أحد العناصر الأساسية للصفحة التي ستعمل معها هو محتوى نصي. على هذا النحو ، عند إنشاء صفحة ويب وأسلوبها باستخدام CSS ، سيتمحور جزء كبير من هذا الجهد حول الطباعة في الموقع.

يلعب التصميم الطباعي دورًا مهمًا في تصميم مواقع الويب. يساعد محتوى النص المحدد والمعيّن على جعل الموقع أكثر نجاحًا من خلال إنشاء تجربة قراءة ممتعة وسهلة الاستخدام. جزء من جهودك في التعامل مع الكتابة هو اختيار الخطوط المناسبة لتصميمك ثم استخدام CSS لإضافة تلك الخطوط وأنماط الخطوط إلى عرض الصفحة. يتم ذلك باستخدام ما يسمى " الخط - المكدس "

FONT-الأكوام

عند تحديد خط لاستخدامه على صفحة ويب ، فمن الأفضل أيضًا تضمين خيارات احتياطية في حالة عدم إمكانية العثور على خيار الخط. يتم تقديم هذه الخيارات الاحتياطية في "كومة الخط". إذا تعذر على المستعرض العثور على الخط الأول المدرج في المكدس ، فإنه ينتقل إلى الخط التالي. وتستمر هذه العملية إلى أن تجد خطًا يمكن استخدامه ، أو أنه ينفد من الخيارات (وفي هذه الحالة يختار أي خط نظام يريده). في ما يلي مثال على كيفية ظهور حزمة الأحرف في CSS عند تطبيقها على عنصر "body":

body {font-family: Georgia، "Times New Roman"، serif؛ }

لاحظ أننا نحدد الخط جورجيا أولاً. بشكل افتراضي ، هذا ما ستستخدمه الصفحة ، ولكن إذا كان هذا الخط غير متاح لسبب ما ، فستعود الصفحة إلى Times New Roman. نرفق اسم الخط هذا بين علامتي اقتباس مزدوجتين لأنه اسم متعدد الكلمات. لا تتطلب أسماء الخطوط أحادية الكلمة ، مثل Georgia أو Arial ، علامات الاقتباس ، ولكن اسم الخط متعدد الكلمات بحاجة إليها حتى يعرف المتصفح أن كل تلك الكلمات تشكل اسم الخط.

إذا نظرت إلى نهاية مكدس الخط ، يجب أن تلاحظ أننا ننتهي بكلمة "serif". هذا هو اسم عائلة خط عام. في حالة غير محتملة أن لا يكون لدى شخص ما جورجيا أو Times New Roman على جهاز الكمبيوتر الخاص به ، سيستخدم الموقع أي خط خطي يمكنه العثور عليه. هذا أفضل من السماح للموقع بالرجوع إلى أي الخطوط التي يريدها ، لأنك تستطيع على الأقل أن تعرف ما هو نوع الخط الذي تستخدمه حتى يكون المظهر العام ونبرة تصميم الموقع سليماً قدر الإمكان. نعم ، سيختار المتصفح خطًا لك ، ولكن على الأقل تقدم إرشادات حتى تعرف نوع الخط الذي يعمل بشكل أفضل ضمن التصميم.

عائلات الخط العامة

اسم الخط العام المتوفر في CSS هو:

في حين أن هناك العديد من تصنيفات الخطوط الأخرى المتاحة في تصميم الويب والطباعة ، بما في ذلك لوحة slab-serif ، و blackletter ، و display ، و grunge ، وأكثر من ذلك ، فإن أسماء الخطوط العامة المذكورة أعلاه هي تلك التي ستستخدمها في حزمة الأحرف في CSS. ما هي الاختلافات في هذه التصنيفات الخط؟ لنلقي نظرة!

غالبًا ما تحتوي خطوط مخطوطة على أشكال رقيقة ورمزية مزخرفة تهدف إلى تكرار النص المكتوب بخط اليد. هذه الخطوط ، بسبب أحرفها الرفيعة المنمقة ، ليست مناسبة لكتلة كبيرة من المحتوى مثل نسخة الجسم. يتم استخدام خطوط مخطوطة بشكل عام للعناوين واحتياجات النص القصيرة التي يمكن عرضها بأحجام خطوط أكبر.

الخطوط الخيالية هي الخطوط المجنونة إلى حد ما والتي لا تقع في أي فئة أخرى. الخطوط التي تقوم بتكرار الشعارات المعروفة ، مثل الحروف من أفلام هاري بوتر أو العودة إلى المستقبل ، ستقع ضمن هذه الفئة. مرة أخرى ، هذه الخطوط ليست مناسبة لمحتوى الجسم لأنها غالباً ما تكون منمقة بحيث أن قراءة نصوص أطول من النص المكتوب في هذه الخطوط أمر صعب للغاية.

خطوط Monospace هي تلك التي تكون فيها أحجام الحروف متساوية الحجم ومتباعدة ، كما لو كنت قد عثرت على آلة كاتبة قديمة. على عكس الخطوط الأخرى التي تحتوي على عرض متغيّر للأحرف اعتماداً على حجمها (على سبيل المثال ، فإن رأس المال "W" سيشغل مساحة أكبر بكثير من الأحرف الصغيرة "i") ، الخطوط الثابتة هي عرض ثابت لجميع الأحرف. وغالبًا ما تستخدم هذه الخطوط عند عرض الشفرة على صفحة لأنها تبدو مختلفة تمامًا عن النص الآخر في تلك الصفحة.

الخطوط Serif هي واحدة من التصنيفات الأكثر شعبية. هذه هي الخطوط التي تحتوي على أحرف إضافية صغيرة على letterforms. وتسمى هذه القطع الإضافية "serifs". خطوط serif الشائعة هي جورجيا و Times New Roman. يمكن استخدام خطوط Serif لنص كبير مثل العنوان بالإضافة إلى مقاطع طويلة من النص ونسخة الجسم.

Sans-serif هو التصنيف النهائي الذي سننظر إليه. هذه هي الخطوط التي لا تحتوي على تلك الحروف المركبة المذكورة أعلاه. الاسم يعني "دون serifs". الخطوط الشعبية في هذه الفئة ستكون Arial أو Helvetica. مماثلة ل serifs ، يمكن استخدام خطوط sans-serif بشكل جيد في العناوين وكذلك محتوى الجسم.

المقالة الأصلية لجنيفر كرينين. حرره جيرمي جيرارد في 17/16/17