إنشاء حزمة خطوط ويب
اختر خطوط TTF أو OTF أو WOFF أو WOFF2 لإنشاء ملفات WOFF2 وملف CSS ومعاينة HTML. قبل دمجها في موقع ويب، تحقق من النص النموذجي ومن الاسم والوزن والنمط و«العرض أثناء التحميل» في CSS، ثم احفظ الحزمة كملف ZIP. لا يتم إجراء تجزئة لمجموعة الأحرف.
ما يمكنك فعله
تجميع ملفات جاهزة للويب
أنشئ WOFF2 و CSS ومعاينة HTML من TTF أو OTF أو WOFF أو WOFF2. يمكنك تحديد عدة خطوط معًا.
التحقق من الأشكال وإعدادات CSS
تحقق من مظهر الخطوط المحولة. يمكنك تغيير الأسماء والأوزان والأنماط المستخدمة على الويب وطريقة العرض أثناء التحميل حسب الحاجة.
مشاركة المجموعة كملف ZIP
احفظ مجلد الخطوط و fonts.css و preview.html كمجموعة واحدة. استخدمها مع الحفاظ على مواضعها النسبية.
كيفية الاستخدام
تحديد الخطوط معًا
حدِّد الخطوط التي يمكنك استخدامها على الويب. إذا كنت تستخدم عدة خطوط، حدِّدها معًا.
التحقق من المظهر وإعدادات الويب
أدخل نصًا للمعاينة وتحقق من كل خط. لتعديل اسمه أو وزنه أو خيارات أخرى، افتح إعدادات CSS لذلك الخط.
إنشاء الحزمة وحفظ ملف ZIP
انقر على "إنشاء حزمة خطوط ويب" واحفظ ملف webfont-kit.zip المُولَّد.
فك الضغط والإضافة إلى صفحة ويب
فكّ ضغط الملفات مع الحفاظ على مواضع مجلد الخطوط و fonts.css و preview.html. حمِّل CSS في الصفحة التي ستستخدم فيها الخطوط واستخدم أسماء الخطوط المحددة.
مفيد عند
تجهيز موقع ويب للنشر
جمِّع خطوطك في صيغ ويب مع CSS لتجهيز الملفات اللازمة للتكامل.
تسليم المجموعة الكاملة إلى فريق الإنتاج
جمِّع عدة خطوط، مثل العادي والعريض، وسلِّمها مع HTML يحتوي على نص للتحقق منها.
كيف تعمل الخطوط و CSS معًا
WOFF2 تنسيق خطوط للويب
يُجهِّز WOFF2 الذي يحتوي على الرموز الأصلية. لا يتم تقليم الرموز. يختلف حجم الملف حسب الخط.
تسجيل الأسماء والأوزان والأنماط في CSS
تحدد هذه الإعدادات الأنماط المطلوبة التي تستخدم هذا الخط على الويب. فهي لا تحوِّل أشكال الرموز إلى عريضة أو مائلة.
تمييز الاسم نفسه بالوزن والنمط
يمكن للنمطين العادي والعريض استخدام الاسم نفسه، لكن لا يمكن تكرار الجمع بين الاسم والوزن والنمط.
اختيار العرض أثناء التحميل
افتراضيًا، يُعرض خط احتياطي أولًا ثم يتم التبديل عندما يصبح الخط جاهزًا. يمكنك تغيير سلوك الانتظار والتبديل في إعدادات CSS عند الحاجة.
الحفاظ على المواضع النسبية للملفات
يشير fonts.css إلى ملفات مثل fonts/font-1.woff2. إذا نقلت المجلد أو ملف CSS، فعدِّل مسارات المراجع تبعًا لذلك.
الأسئلة الشائعة
أين ينبغي أن أضع الملفات المُولَّدة؟
فكّ ضغط ملف ZIP وضع مجلد الخطوط و fonts.css و preview.html بحيث تبقى مواضعها النسبية محفوظة. حمِّل fonts.css من صفحتك واستخدم اسم الخط المحدد داخل CSS.
كيف يختلف هذا عن تحويل التنسيق وحده؟
تجمع هذه الشاشة WOFF2 مع CSS ومعاينة HTML. إذا كنت تريد تغيير تنسيق الخط فقط، فاستخدم "محوِّل تنسيق الخطوط".
هل يمكنني الاحتفاظ بالرموز التي أستخدمها فقط؟
لاتقوم هذه الشاشة بتقليم الرموز. إنها تجهِّز خطوطًا تحتفظ بالرموز الأصلية.
هل يجعل تغيير الوزن الرموز أكثر سماكة؟
يحدد هذا الإعداد قيمة الوزن المستخدمة في CSS. فهو لا يعدِّل أشكال الرموز في ملف الخط. لاستخدام عريض أو مائل، قدِّم ملفًا يحتوي على تلك الأشكال.
هل يمكنني استخدام عدة ملفات بالاسم نفسه للخط؟
يمكنك تسجيل ملفات بأوزان أو أنماط مختلفة. إذا تكرر الجمع نفسه بين الاسم والوزن والنمط، فراجع الإعدادات ذات الصلة.
ماذا يحدث عندما أحدد الخطوط مرة أخرى؟
تُحذف مجموعة الخطوط الحالية و ZIP المُولَّد، وتُحمَّل المجموعة المُحدَّثة حديثًا. حدِّد أي ملفات تريد الاستمرار في استخدامها إلى جانب الجديدة.
ماذا إذا لم تظهر كل الرموز التجريبية؟
قد تُعرض الرموز غير الموجودة في الخط بخط آخر. تحقق من الرموز المدعومة وكيف تبدو في المكان الذي ستستخدم فيه الخط.
ماذا إذا تعذر تحميل خط؟
حدِّد الخطوط مرة أخرى بتنسيق مدعوم. إذا تعذر تحويل أي ملف في المجموعة أو تحميله، فلا تُحفظ مجموعة ناجحة جزئيًا.
الإدخال والنتائج
- الإدخال
- TTF و OTF و WOFF و WOFF2. يمكنك تحديد عدة ملفات معًا.
- الشروط
- تحقق من شروط استخدام خطوط الإدخال، بما في ذلك التضمين على الويب.
- الإعدادات
- الأسماء والأوزان والأنماط وطريقة العرض أثناء التحميل المستخدمة في CSS.
- الإخراج
- webfont-kit.zip. يتضمن WOFF2 و fonts.css و preview.html.