Brak nagłówka odpowiedzi w CORS
Przeglądarki:
- Firefox (3.5 i nowsze)
- Internet Explorer (9 lub nowszy)
- Chrome (37 lub nowsze)
Opis
Przeglądarki Chrome, Firefox i nowsze wersje Internet Explorera wymuszają udostępnianie zasobów z innych witryn, co oznacza, że renderowane są tylko czcionki internetowe z odpowiednim nagłówkiem odpowiedzi „Access-Control-Allow-Origin”. Ponieważ czcionki Google Fonts można oglądać w dowolnej domenie, czcionki są wyświetlane z tym nagłówkiem odpowiedzi:
Access-Control-Allow-Origin:*
Możliwa przyczyna
Niektóre serwery proxy mogą usuwać nagłówek z odpowiedzi, a przeglądarka nie wyrenderuje czcionek.
Diagnozuję
W Chrome poszukaj odpowiedniego komunikatu ostrzegawczego w konsoli deweloperskiej.
W przeglądarce Firefox można wyświetlać rozszerzenia odpowiedzi CORS przy użyciu rozszerzeń Firebug lub Live Headers HTTPs.
Linki
Czcionki internetowe nie wyświetlają się w Firefoksie, gdy jest zainstalowana wtyczka NoScript
Przeglądarki: * Firefox (3.5+)
Opis
Po zainstalowaniu wtyczki NoScript Firefox nie wyświetla czcionek internetowych.
Możliwa przyczyna
Domyślnie wtyczka NoScript wyłącza reguły @font-face.
Rozwiązanie
Otwórz Opcje NoScript, przejdź na kartę Umieszczanie elementów i odznacz: Forbid @font-face
Czcionki internetowe się nie wyświetlają
Przeglądarki: * Wszystkie
Opis
Używane czcionki internetowe nie są wyświetlane.
Możliwa przyczyna
URL interfejsu API zawiera błąd lub wysłano żądanie stylu, który nie jest obsługiwany.
Rozwiązanie
Sprawdź, czy adres URL jest prawidłowo sformatowany, czy wielkość liter jest przestrzegana w nazwie czcionki (np. Droid Serif nie droid szeryfowa), czy składnia wagi i stylów jest zgodna z składnią, która wczytuje wiele rodzin (więcej informacji znajdziesz w dokumentacji: Pierwsze kroki – składnia). Gdy czcionki się nie wyświetlają, zajrzyj do treści arkusza stylów, żeby dowiedzieć się, co jest nie tak. Skopiuj adres URL i wklej go w przeglądarce, aby sprawdzić, czy nie ma komunikatu o błędzie. Na przykład żądanie wagy nieobsługiwanej przez narzędzie Droid Serif wyświetli następujący komunikat o błędzie:
/* Droid Serif (style: normal, weight: 300) is not available */ /* However, style: normal, weight: normal is available */ /* However, style: italic, weight: normal is available */ /* However, style: normal, weight: bold is available */ /* However, style: italic, weight: bold is available */ /* Not supported. */
Czcionki na internet wyglądają bardziej grubo, gdy są używane w nagłówku.
Przeglądarki: * Wszystkie
Opis
Czcionki w nagłówku (h1, h2 itp.) wyglądają na grubsze, mimo że ich waga jest standardowa (400).
Możliwa przyczyna
Przeglądarka automatycznie pogrubiła tekst.
Rozwiązanie
Upewnij się, że podczas przypisywania czcionki do nagłówka w regule CSS jest określona prawidłowa waga czcionki:
h1 {
font-family: Lobster, cursive;
font-weight: 400;
}