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