این سند برخی از اطلاعات فنی را در مورد آنچه در پشت صحنه در هنگام درخواست فونت وب با Google Fonts API در حال رخ دادن است، ارائه می دهد.
این سند همچنین اطلاعاتی در مورد رفتار خاص مرورگر می دهد.
اگر فقط می خواهید از Fonts API استفاده کنید، نیازی به خواندن این صفحه ندارید. با این حال، خواندن این صفحه ممکن است به شما در بهبود عملکرد بارگذاری صفحه کمک کند.
Google Fonts API چیست؟
هنگامی که یک مرورگر درخواستی برای یک شیوه نامه Fonts API ارسال می کند (همانطور که در تگ <link> در صفحه وب شما مشخص شده است)، Fonts API یک شیوه نامه تولید شده برای عامل کاربر خاص ارائه دهنده درخواست ارائه می دهد.
برای مثال، درخواست Inconsolata از فایرفاکس، CSS زیر را برمی گرداند:
@font-face {
font-family: 'Inconsolata';
src: local('Inconsolata'), url('https://themes.googleusercontent.com/fonts/font?kit=J_eeEGgHN8Gk3Eud0dz8jw') format('truetype');
}
از سوی دیگر، درخواستی از اینترنت اکسپلورر برمی‌گرداند:
@font-face {
font-family: 'Inconsolata';
src: url('https://themes.googleusercontent.com/fonts/font?kit=J_eeEGgHN8Gk3Eud0dz8jw');
}
پس از دانلود CSS، مرورگر فونت را با فرمت مناسب برای مرورگر دانلود می کند.
رفتار خاص مرورگر
این بخش رفتار پیش فرض هر مرورگر را با فونت های وب شرح می دهد. توجه داشته باشید که می توانید این رفتارها را با استفاده از Web Font Loader کنترل کنید.
برای لیستی از مرورگرهای پشتیبانی شده، به سؤالات متداول مراجعه کنید.
گوگل کروم
کروم بقیه صفحه را رندر می کند، اما تا زمانی که فونت بارگیری شود، یک فضای خالی به جای متنی که از فونت استفاده می کند، نمایش می دهد.
موزیلا فایرفاکس
فایرفاکس ابتدا متن را با فونت پیش‌فرض نمایش می‌دهد و پس از بارگذاری، متن را در فونت دوباره نمایش می‌دهد. این رفتار به عنوان "فلش متن بدون استایل" شناخته می شود.
اپل سافاری
سافاری بقیه صفحه را رندر می کند، اما تا زمانی که فونت بارگذاری شود، یک فضای خالی به جای متنی که از فونت استفاده می کند، نمایش می دهد.
مایکروسافت اینترنت اکسپلورر
اینترنت اکسپلورر بقیه صفحه را رندر می کند، اما تا زمانی که فونت بارگیری شود، یک فضای خالی به جای متنی که از فونت استفاده می کند، نمایش می دهد.
به طور کلی، رفتار اینترنت اکسپلورر ممکن است بسته به مکان و وجود عناصر مختلف متفاوت باشد. اگر می‌خواهید رفتار ثابتی را در همه مرورگرها ارائه دهید، از Web Font Loader استفاده کنید. برای مثال، می‌توانید انتخاب کنید که همه مرورگرها مانند فایرفاکس عمل کنند.