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