يعد التصميم المطبعي جزءًا مهمًا للغاية من تصميم موقع ويب ناجح. إن إنشاء مواقع بنصوص يسهل قراءتها وتبدو رائعة هو هدف كل متخصص في تصميم مواقع الويب. لتحقيق ذلك ، ستحتاج إلى أن تكون قادرًا على تعيين الخطوط المحددة التي ترغب في استخدامها على صفحات الويب الخاصة بك. لتحديد نوع الخط أو مجموعة الخطوط في مستندات الويب الخاصة بك ، ستستخدم خاصية نمط عائلة الخطوط في ملف CSS.
قد يتضمن نمط عائلة الخطوط الأكثر تعقيدًا والذي يمكنك استخدامه عائلة خطوط واحدة فقط:
ص {
عائلة الخطوط: Arial ؛
}
إذا قمت بتطبيق هذا النمط على صفحة ، فسيتم عرض جميع الفقرات في عائلة الخطوط "Arial". هذا أمر رائع ونظرًا لأن "Arial" هو ما يُعرف باسم "خط الويب الآمن" ، وهو ما يعني معظم (إن لم يكن الكل) سيتم تثبيته على أجهزة الكمبيوتر ، يمكنك الراحة بسهولة مع العلم أن صفحتك سيتم عرضها في المقصودة الخط.
إذن ماذا يحدث إذا لم يتم العثور على الخط الذي حددته؟ على سبيل المثال ، إذا كنت لا تستخدم "خط الويب الآمن" على الصفحة ، فماذا يفعل وكيل المستخدم إذا لم يكن لديه هذا الخط؟ يقومون باستبدال.
يمكن أن ينتج عن هذا بعض الصفحات ذات المظهر الممتع. ذهبت ذات مرة إلى صفحة كان جهاز الكمبيوتر الخاص بي يعرضها بالكامل في "Wingdings" (مجموعة أيقونات) لأن جهاز الكمبيوتر الخاص بي لم يكن به الخط الذي حدده المطور ، واتخذ متصفحي خيارًا سيئًا فيما يتعلق بالخط الذي سيستخدمه كملف إستبدال. كانت الصفحة غير قابلة للقراءة تمامًا بالنسبة لي! هذا هو المكان الذي تلعب فيه مجموعة الخطوط.
افصل مجموعات الخطوط المتعددة بفاصلة في مجموعة الخطوط
"تكديس الخطوط" هو قائمة بالخطوط التي تريد أن تستخدمها صفحتك. يمكنك ترتيب اختيارات الخط حسب تفضيلاتك وفصل كل منها بفاصلة. إذا لم يكن المتصفح يحتوي على عائلة الخطوط الأولى في القائمة ، فسيحاول الثانية ثم الثالثة وما إلى ذلك حتى يعثر على مجموعة الخطوط الموجودة على النظام.
عائلة الخطوط: Pussycat، Algeria، Broadway؛
في المثال أعلاه ، سيبحث المتصفح أولاً عن خط "Pussycat" ، ثم "جزائري" ثم "Broadway" إذا لم يتم العثور على أي من الخطوط الأخرى. يمنحك هذا فرصة أكبر لاستخدام واحد على الأقل من الخطوط التي اخترتها. إنه ليس مثاليًا ، ولهذا السبب لدينا المزيد يمكننا إضافته إلى مجموعة الخطوط لدينا (اقرأ!).
استخدم Generic Fonts Last
لذلك يمكنك إنشاء مجموعة خطوط بقائمة من الخطوط ولا يزال لديك أي منها لا يمكن للمتصفح العثور عليه. لا تريد أن تظهر صفحتك بشكل غير قابل للقراءة إذا اتخذ المتصفح خيارًا بديلاً سيئًا. لحسن الحظ ، لدى CSS حلاً لهذا أيضًا ، ويُطلق عليه الخطوط العامة.
يجب عليك دائمًا إنهاء قائمة الخطوط (حتى لو كانت قائمة من عائلة واحدة أو خطوط آمنة للويب فقط) بخط عام. هناك خمسة يمكنك استخدامها:
- مخطوطة
- خيال
- مونوسبيس
- بلا الرقيق
- سيريف
يمكن تغيير المثالين أعلاه إلى:
عائلة الخطوط: Arial، sans-serif؛
أو.
عائلة الخطوط: Pussycat، Algeria، Broadway، fantasy؛
تتكون بعض أسماء عائلة الخطوط من كلمتين أو أكثر
إذا كانت مجموعة الخطوط التي تريد استخدامها تتكون من أكثر من كلمة واحدة ، فيجب أن تحيطها بعلامات اقتباس مزدوجة. بينما يمكن لبعض المستعرضات قراءة مجموعات الخطوط بدون علامات اقتباس ، فقد تكون هناك مشاكل إذا تم تكثيف المسافة البيضاء أو تجاهلها.
عائلة الخطوط: "Times New Roman"، serif؛
في هذا المثال ، يمكنك أن ترى أن اسم الخط "Times New Roman" ، وهو متعدد الكلمات ، محاط بعلامات اقتباس. هذا يخبر المتصفح أن كل هذه الكلمات الثلاث هي جزء من اسم الخط هذا ، على عكس ثلاثة خطوط مختلفة كلها بأسماء من كلمة واحدة.