اذهب إلى المحتوى

السؤال

نشر

اعرف طريقة نقوم فيها بنسخ رابط الخط من Google fonts ثم نلصقه في صفحة  html في head.  هكذا :

<head>

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Cairo&display=swap" rel="stylesheet">

<head/>

 

فأرجو توضيح الفرق بين الطريقة هذه والطريقة التي استخدمها الأستاذ في الشرح

مع الشكر الجزيل  

Recommended Posts

  • 0
نشر

مع الاسف ليس لدي فكرة عن اي شرح تتحدث لأنك نشرت التعليق في قسم الاسئلة العامة (الصحيح ان تنشر السؤال في التعليقات اسفل الدرس حتى نعرف ما لذي تتحدث عنه).

لكنني اظن انك تتحدث عن الطريقة التي نقوم فيها بتحميل الخط واضافته لملفات المشروع والتي هي الطريقة الافضل لعدة اسباب :

  • الخط في هذه الحالة لا يتأثر بخوادم جوجل (حيث ان الطريقة التي اشرت إليها في سؤالك تعتمد على جلب الخط من جوجل في كل مرة يتم فيها فتح الصفحة).
  • يتمكن استخدام هذه الطريقة على كل انواع الخطوط (حتى التي لا يدعمها جوجل).
  • هذه الطريقة تتيح لك تحكم افضل في الخط وذلك لأن الملفات موجودة لديك ويمكنك تعديلها بسهولة.
  • 0
نشر

الأمر يعتمد على ما تريد فعله وعلى الأماكن الجغرافية لزوار الموقع، فاستدعاء الخطوط عن طريق CDN من خلال جوجل يتيح لك الآتي:

  •  تحسين أداء الموقع، حيث تُحمل الخطوط من سيرفر قريب من المستخدم، مما يقلل من وقت التحميل ويعزز سرعة التصفح.
  • يتم تحديث خطوط CDN تلقائيًا، مما يعني أنك لن تحتاج إلى القلق بشأن تحديث الإصدارات أو حل المشاكل الأمنية للخطوط.
  • خدمات CDN متاحة عالميًا، وهذا يعني أن المستخدمين في جميع أنحاء العالم سيتمكنون من الوصول إلى الخطوط بشكل سريع وسهل.

أما تحميل الخطوط وإضافتها عن طريق CSS فيتيح لك:

  • الحصول على مستوى أعلى من التحكم في الخطوط المستخدمة في مشروعك، وتخصيص خصائص الخطوط بدقة وتحديد الإصدار المحدد الذي ترغب في استخدامه.
  • عند تحميل الخطوط محليًا، فإن الموقع سيكون قادرًا على عرض الخطوط بشكل صحيح حتى في حالة انقطاع الاتصال بالإنترنت.
  • متاح لك أنواع خطوط أكثر من المتاح على Google Fonts

أي أن استخدام CDN مناسب عندما تهتم بأداء الموقع وسرعة التحميل، وتفضل عدم التعامل مع الصيانة الدورية للخطوط، أما إذا كنت تحتاج إلى مرونة أكبر وتحكم دقيق في الخطوط، وتفضل الاستقلالية عن الاتصال بالإنترنت، فقد يكون تحميل الخطوط وإضافتها عن طريق CSS هو الخيار الأنسب لك.

  • 0
نشر

هناك بعض الفروقات الأخرى بالتفصيل بين self-hosted fonts وFonts API، وهي:

تخزين الخطوط: عند استخدام self-hosted fonts، يتم تخزين الخطوط على خادم الويب الخاص بك ويتم تحميلها مباشرة منه، بينما يتم تخزين الخطوط المستخدمة في Fonts API على خوادم الخدمة المستخدمة، ويتم تحميلها عند زيارة الصفحة.

التخصيص: يمكن تخصيص الخطوط بشكل أفضل عند استخدام self-hosted fonts، حيث يمكن تعديل خواص الخط مباشرة في ملفات CSS، بينما يمكن تخصيص الخطوط في Fonts API بشكل محدود باستخدام أدوات التخصيص المتاحة في الخدمة.

الدعم: يدعم العديد من المتصفحات self-hosted fonts، بينما يدعم Fonts API معظم المتصفحات الحديثة.

عند اختيار الطريقة المناسبة لاستخدام الخطوط على موقع الويب الخاص بك، يجب أخذ هذه الفروقات في الاعتبار والتحليل بناءً على احتياجاتك ومتطلبات موقع الويب الخاص بك.

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...