Istnieją 2 metody osadzania czcionki Ubuntu w witrynie - za pomocą katalogu czcionek Google (preferowane) lub @font-facedeklaracji CSS i ręcznej konwersji czcionek.
Korzystanie z Google Webfonts
Możesz teraz używać czcionki Ubuntu jako czcionki internetowej Google. Ułatwi to proces. Większość treści tej części odpowiedzi pochodzi z odpowiedzi Sladena .
Dlaczego używanie interfejsu API czcionek Google jest preferowaną metodą?
Korzystanie z interfejsu API czcionek Google jest doskonałą sugestią, ponieważ umożliwia stronom internetowym automatyczne działanie we wszystkich nowoczesnych przeglądarkach bez martwienia się o szczegóły. Korzystanie z interfejsu API czcionek oznacza, że odwiedzający zawsze będą automatycznie widzieć najnowszą wersję kroju pisma.
Jak mogę korzystać z interfejsu API czcionek Google?
Od 21 grudnia 2010 r. Rodzina czcionek Ubuntu jest teraz włączona i można ją wdrażać z interfejsu API czcionek Google, odwiedź:
Możesz przeczytać post Google Web Font o wiadomościach, a następnie:
- Otwórz katalog czcionek Google: „ Ubuntu - Użyj tej czcionki ”
Zaznacz kombinację wag i stylów spośród zwykłych, kursywy, pogrubionej i pogrubionej kursywy, których potrzebujesz na swojej stronie internetowej.
Jeśli wartość domyślna jest nieprawidłowa, wybierz potrzebną kombinację języka / skryptu : rosyjska witryna internetowa z przykładami w języku angielskim może używać „Cyrylicy, łaciny”.
Dodaj podany <link>tag pomiędzy <head> ... </head>na stronie HTML lub w szablonach i dodaj odpowiedni kod CSS pomiędzy <style> ... </style>tagami na swoim <head>.
Na przykład, jeśli tworzysz rosyjsko-angielską stronę hybrydową i chcesz użyć czcionki jako domyślnej dla całego tekstu, możesz dodać następujący kod między <head>tagami:
<link href='http://fonts.googleapis.com/css?family=Ubuntu&subset=cyrillic,latin' rel='stylesheet' type='text/css' />
<style type="text/css" >
body {
font-family : 'Ubuntu', sans-serif;
}
</style>
Uwagi :
„Łacina” to skrypt, w którym napisany jest angielski oraz wiele innych języków europejskich i afrykańskich.
„Podzbiór” optymalizuje pliki czcionek, wysyłając tylko znaki dla niektórych języków, czcionki mają około 44 kB każdy. Liczba 168 kB pokazana w tej chwili dotyczy wszystkich ponad 1200 glifów jako pojedynczego pobrania czcionki internetowej - i większość z nich nie jest potrzebna w przypadku jednej witryny internetowej.
Pliki czcionek Ubuntu są automatycznie konwertowane w odpowiednim formacie dla różnych przeglądarek; w zależności od marki i wersji wymagany format jest WOFF, EOT, SVGlub TTF. Właściwa kombinacja CSS jest specyficzna dla każdego żądania strony i magicznie rozwiązuje ten trudny problem.
Używanie @ font-face
Możesz osadzić czcionki Ubuntu, konwertując je na czcionki WOFF . Możesz je następnie osadzić za pomocą deklaracji CSS @ font-face. Czcionki (pliki .ttf) można znaleźć w /usr/share/fonts/truetype/ubuntu-font-family.
Na przykład, aby użyć zwykłej czcionki Ubuntu, przekonwertowanej na plik WOFF, Ubuntu-R.woff, użyj tego kodu CSS:
@font-face
{
font-family : "Ubuntu-R";
src: url('Ubuntu-R.woff');
}
Podobnie dla Ubuntu Bold:
@font-face
{
font-family : "Ubuntu";
src: url('Ubuntu-B.woff');
font-weight : bold;
}
Kursywa Ubuntu:
@font-face
{
font-family : "Ubuntu";
src: url('Ubuntu-I.woff');
font-style : italic;
}
Ubuntu Bold Italic:
@font-face
{
font-family : "Ubuntu";
src: url('Ubuntu-BI.woff');
font-weight : bold;
font-style : italic;
}
Jest to obsługiwane przez wszystkie najnowsze przeglądarki .
Uwagi
Pamiętaj, że niektórzy użytkownicy konfigurują przeglądarki tak, aby używały określonego zestawu czcionek i mogą być zirytowane, jeśli zostaną użyte niestandardowe czcionki. Przeczytaj także licencję czcionek Ubuntu, aby uzyskać dokładne warunki dystrybucji czcionki.
Korzystanie z interfejsu API czcionek Google jest doskonałą sugestią, ponieważ umożliwia stronom internetowym automatyczne działanie we wszystkich nowoczesnych przeglądarkach bez martwienia się o szczegóły. Korzystanie z interfejsu API czcionek oznacza, że odwiedzający zawsze będą automatycznie widzieć najnowszą wersję kroju pisma.
Od 21 grudnia 2010 r. Rodzina czcionek Ubuntu jest teraz włączona i można ją wdrażać z interfejsu API czcionek Google, odwiedź:
Możesz przeczytać post Google Web Font o wiadomościach, a następnie:
<head> ... </head>i<style>...</style>strony HTML lub szablonów.Uwagi:
„Łacina” to skrypt, w którym napisany jest angielski oraz wiele innych języków europejskich i afrykańskich.
„Podzbiór” optymalizuje pliki czcionek, wysyłając znaki tylko dla niektórych języków, a każdy z nich ma rozmiar około 44 kB. Liczba 168 kB pokazana w tej chwili dotyczy wszystkich ponad 1200 glifów jako pojedynczego pobrania czcionki internetowej - i większość z nich nie jest potrzebna w przypadku jednej witryny internetowej.
Pliki czcionek Ubuntu są automatycznie konwertowane w odpowiednim formacie dla różnych przeglądarek; w zależności od marki i wersji wymagany format jest
WOFF,EOT,SVGlubTTF. Właściwa kombinacja CSS jest specyficzna dla każdego żądania strony i magicznie rozwiązuje ten trudny problem.źródło
Renderowanie czcionek po stronie serwera (być może lepsze „dynamiczne renderowanie czcionek”) było interesującym problemem od dłuższego czasu.
Technicznie wydaje się logiczne, że aby maszyna wyświetlała określoną czcionkę, powinna być już zainstalowana lokalnie.
Z drugiej strony projektowanie stron internetowych dużo traci, ponieważ musi trzymać się podstawowych / dobrze znanych „czcionek internetowych”.
W CSS2.1 wprowadzono pewne ulepszenia, używając deklaracji reguły @ font-face .
Nie stał się jeszcze standardem, ale ostatecznie będzie w CSS3.
Poza tym istnieje kilka alternatywnych metod, takich jak:
Mam nadzieję, że podane linki dadzą ci lepsze pojęcie o tym, co można zrobić ;-)
źródło