يلعب تصميم الويب دورا مهما في إنشاء تجربة فريدة لا تنسى للمستخدمين. جزء من هذه التجربة هو استخدام العديد من الخطوط التي تساعد في إبراز المحتوى ونقل الحالة المزاجية الصحيحة. ومع ذلك ، فإن الخطوط القياسية المثبتة مسبقا على الأجهزة ليست دائما قادرة على تلبية جميع احتياجات المصمم.
في هذه الحالة ، تأتي خاصية وجه الخط المغلق للإنقاذ. انها تسمح لك لتحميل الخطوط المخصصة واستخدامها على صفحة ويب. بهذه الطريقة ، يمكنك إضافة خطوط جديدة ستكون متاحة للعرض على أي جهاز ، سواء كان جهاز كمبيوتر أو هاتف محمول.
لتوصيل خط باستخدام وجه الخط ، تحتاج إلى اتباع بعض الخطوات البسيطة. أولا ، تحتاج إلى إضافة الخط نفسه إلى الخادم أو استخدام مصدر خارجي. ثم ، في ملف نمط كس ، يمكنك تحديد خصائص الخط: الاسم ، المسار إلى ملف الخط ، والوزن.
إذا كنت تريد أن تبرز صفحة الويب الخاصة بك في الحشد وأن يكون لها أسلوبها الفريد ، فإن استخدام وجه الخط هو الحل الأمثل. باستخدام خاصية كس هذه ، يمكنك توصيل أي خط وتحقيق مجموعة متنوعة مرئية من المحتوى الخاص بك.
- الخطوة 1: اختيار الخط المناسب
- الخطوة 2: إعداد الخط للاتصال
- الخطوة 3: تحميل الخط إلى الخادم
- الخطوة 4: إنشاء نمط كس للخط
- الخطوة 5: قم بتوصيل الخط بصفحة الويب
- الخطوة 6: التحقق من عملية الخط على صفحة ويب
الخطوة 1: اختيار الخط المناسب
قبل توصيل خط عبر كس ، تحتاج إلى تحديد الخط المناسب لمشروعك. ضع في اعتبارك أن خطوط الويب يجب أن تكون متاحة وقابلة للقراءة على مختلف الأجهزة والمتصفحات.
عند اختيار الخط ، ضع في اعتبارك العوامل التالية:
| نمط النص | الخطوط المختلفة لها أنماطها وحالاتها المزاجية الفريدة. اختر خطا يطابق موضوع مشروعك. على سبيل المثال ، الخط الكلاسيكي والرسمي مناسب للمحتوى الجاد والمهني ، ويمكن استخدام خط أكثر إشراقا وأكثر مرحا لموقع الألعاب. |
| سهولة القراءة | تأكد من سهولة قراءة الخط ، خاصة على الأحجام الصغيرة أو على الشاشات منخفضة الدقة. من المهم أن يكون الخط واضحا ومفهوما للمستخدمين. |
| التوفر | تأكد من أن الخط المحدد يحتوي على جميع التراخيص والحقوق اللازمة لاستخدامه على موقع الويب الخاص بك. تأكد من أن الخط متوافق مع المتصفحات والأجهزة المختلفة. |
| التفرد | يمكن أن يؤدي استخدام خطوط غير عادية أو نادرة إلى جعل مشروعك فريدا وأصليا. ومع ذلك ، ضع في اعتبارك أن الخط المعقد جدا أو غير القياسي يمكن أن يجعل من الصعب قراءة النص ويزيد من سوء تجربة المستخدم. |
بعد تحديد الخط المناسب ، يمكنك متابعة الخطوة 2-توصيل الخط عبر كس.
الخطوة 2: إعداد الخط للاتصال
1. تأكد من أن لديك جميع ملفات الخطوط الضرورية. عادة ما يتم توفير الخطوط بتنسيقات مختلفة (على سبيل المثال .ووف,.2,.صندوق النقد الدولي, .أوتف ، الخ.) لضمان التوافق مع المتصفحات المختلفة. من الأفضل أن يكون لديك كل تنسيقات الملفات هذه.
2. قم بإنشاء مجلد منفصل على الخادم أو الاستضافة حيث ستضع جميع ملفات الخطوط. قم بتسمية هذا المجلد ، على سبيل المثال ، " الخطوط "أو"الخطوط". تأكد من أن المسار إلى هذا المجلد يمكن الوصول إليه من خلال عنوان ورل لموقع الويب الخاص بك.
3. ضع جميع ملفات الخطوط في المجلد الذي تم إنشاؤه على الخادم الخاص بك. يرجى ملاحظة أن أسماء ملفات الخطوط قد تكون مختلفة ، ولكن من الأفضل الاحتفاظ بأسمائها الأصلية.
4. تحديد المسارات إلى ملفات الخط. على سبيل المثال ، إذا قمت بإنشاء مجلد "خطوط" في الدليل الجذر لموقع الويب الخاص بك ، فقد تكون مسارات الملفات كما يلي:
.ووف - / الخطوط / الخط.ووف
.2 - / الخطوط / الخط.2
.الصناديق - / الخطوط / الخط.الصندوق
.أوتف - / الخطوط / الخط.أوتف
5. تحقق من توافر ملفات الخطوط عن طريق فتحها من خلال عنوان ورل لمتصفح الويب. تأكد من أن يتم عرض الملفات ومتاحة للتحميل.
بعد الانتهاء من هذه الخطوات ، سوف تكون على استعداد لربط الخط إلى موقع الويب الخاص بك باستخدام الخاصية المغلق الخط الوجه. الآن سيكون لديك جميع ملفات الخطوط الضرورية ، بالإضافة إلى المسار الصحيح لها.
الخطوة 3: تحميل الخط إلى الخادم
بعد تحديد الخط المناسب وتنزيله ، تحتاج إلى تحميله على خادم موقع الويب الخاص بك.
أولا ، تأكد من أن لديك حق الوصول إلى الخادم. اعتمادا على مكان استضافة موقعك ، يمكن الحصول على الوصول من خلال برنامج بروتوكول نقل الملفات (بروتوكول نقل الملفات) أو لوحة تحكم الاستضافة.
ثم قم بإنشاء مجلد على الخادم حيث تريد تحميل الخط. يمكن أن يكون مجلدا باسم "الخطوط" أو أي اسم آخر يناسبك.
افتح برنامج بروتوكول نقل الملفات أو لوحة تحكم الاستضافة وقم بتسجيل الدخول إلى حسابك.
ابحث عن المجلد الذي تريد تنزيل الخط فيه وافتحه.
انقر فوق الزر تنزيل أو ما شابه وحدد ملفات الخطوط التي تريد تحميلها على الخادم.
انتظر حتى تكتمل عملية التنزيل. قد تحتاج إلى الانتظار قليلا ، خاصة إذا كان ملف الخط كبيرا.
بعد التنزيل الناجح ، ستتمكن من استخدام الخط الذي تم تنزيله على موقع الويب الخاص بك باستخدام رمز كس.
مثال على رمز كس:
استبدال " ميفونت "مع اسم الخط الخاص بك و" الخطوط/ميفونت.الصناديق " مع المسار إلى ملف الخط الخاص بك على الخادم.
لقد أكملت الآن تحميل الخط إلى الخادم وأنت جاهز لاستخدامه على موقع الويب الخاص بك.
الخطوة 4: إنشاء نمط كس للخط
بعد تحميل ملفات الخط وتوصيلها بالخادم الخاص بك ، تحتاج إلى إنشاء نمط كس لهذا الخط.
في المغلق.
لنقم بإنشاء قاعدة بسيطة لتحديد اسم الخط. لنفترض أننا نريد تسميتها "ميكوستومفونت". وهنا ما رمز كس الخاص بك سوف تبدو وكأنها:
ص {في هذا المثال ، أنشأنا قاعدة للعنصر
(الفقرة) لاستخدام الخط "ميكوستومفونت". يمكنك استبدال
إلى أي عنصر أو فئة أخرى تريد استخدام هذا الخط لها.
مرحبا ، العالم!
الآن النص داخل العنصر
سيتم عرضه باستخدام الخط الذي حددته.الخط الأسرة: "ميكوستومفونت";
سرك: ورل("المسار إلى ملفك/ميكوستومفونت.الصندوق");
}
لاحظ أننا هنا نستخدم العقار
الآن يجب أن يكون الخط متصلا وجاهزا للاستخدام على موقعك.
الخطوة 5: قم بتوصيل الخط بصفحة الويب
بعد تنزيل ملف الخط وإعداد كتالوج بالتنسيقات اللازمة ، يمكنك البدء في توصيله بصفحة الويب الخاصة بك.
للقيام بذلك ، يمكنك استخدام خاصية كس
- . تتيح لك هذه الخاصية تحديد المسار إلى ملف الخط وتعيين اسمه.
- الخط الأسرة: 'اسم الخط';
سرك: رابط ('مسار / إلى / ملف.ووف 2') شكل ('ووف 2'),
الخط الأسرة
- تعيين اسم الخط لاستخدامها في قواعد المغلق;
الشكل
- يحدد تنسيق الملف.
يرجى ملاحظة أنه يجب الوصول إلى ملفات الخطوط في المسار المحدد ، وإلا فلن يتم تحميلها.
- بعد إضافة قاعدة كس مع
- @الخط الوجه
- ، يمكنك استخدام الخط المحدد في قواعد كس الأخرى باستخدام الخاصية
- الخط الأسرة