Typografia internetowa - Web typography
Typografia internetowa odnosi się do używania czcionek w sieci WWW . Kiedy po raz pierwszy tworzono HTML , kroje i style czcionek były kontrolowane wyłącznie przez ustawienia każdej przeglądarki internetowej . Nie istniał żaden mechanizm umożliwiający sterowanie wyświetlaniem czcionek przez poszczególne strony internetowe, dopóki firma Netscape nie wprowadziła tego fontelementu w 1995 r., który został następnie ustandaryzowany w specyfikacji HTML 3.2. Jednak czcionka określona przez fontelement musiała być zainstalowana na komputerze użytkownika lub zostałaby użyta czcionka rezerwowa, taka jak domyślna czcionka bezszeryfowa lub monospace przeglądarki . Pierwsza specyfikacja Cascading Style Sheets została opublikowana w 1996 roku i zapewniała te same możliwości.
Specyfikacja CSS2 została wydana w 1998 roku i próbowała ulepszyć proces wyboru czcionek poprzez dodanie dopasowania czcionek, syntezy i pobierania. Techniki te nie zyskały większego zastosowania i zostały usunięte ze specyfikacji CSS2.1. Jednak Internet Explorer dodał obsługę funkcji pobierania czcionek w wersji 4.0 , wydanej w 1997 roku. Pobieranie czcionek zostało później uwzględnione w module czcionek CSS3 i od tego czasu zostało zaimplementowane w Safari 3.1 , Opera 10 i Mozilla Firefox 3.5 . To z kolei spowodowało wzrost zainteresowania typografią internetową, a także wykorzystaniem pobierania czcionek.
CSS1
W pierwszej specyfikacji CSS autorzy określili charakterystykę czcionki za pomocą szeregu właściwości:
font-familyfont-stylefont-variantfont-weightfont-size
Wszystkie czcionki zostały zidentyfikowane wyłącznie po nazwie. Poza wyżej wymienionymi właściwościami projektanci nie mieli możliwości stylizowania czcionek i nie istniał żaden mechanizm wybierania czcionek nieobecnych w systemie klienta.
Czcionki bezpieczne w Internecie
Czcionki bezpieczne w Internecie to czcionki, które mogą być obecne w wielu systemach komputerowych i są używane przez autorów treści internetowych w celu zwiększenia prawdopodobieństwa wyświetlania treści w wybranej przez nich czcionce. Jeśli użytkownik odwiedzający witrynę sieci Web nie ma określonej czcionki, jego przeglądarka próbuje wybrać podobną alternatywę, opartą na czcionkach zastępczych określonych przez autora i rodzinach ogólnych lub korzysta z zastępowania czcionek zdefiniowanego w systemie operacyjnym użytkownika.
Podstawowe czcionki firmy Microsoft dla sieci Web
Aby zapewnić wszystkim użytkownikom sieci dostęp do podstawowego zestawu czcionek, firma Microsoft uruchomiła w 1996 r. inicjatywę Core fonts for the Web (zakończoną w 2002 r.). Opublikowane czcionki to między innymi Arial , Courier New , Times New Roman , Comic Sans , Impact , Georgia , Trebuchet , Webdings i Verdana — na mocy umowy EULA, która umożliwia ich swobodne rozpowszechnianie, ale także ogranicza niektóre prawa do ich używania. Ich wysoki wskaźnik penetracji sprawił, że stały się podstawą dla projektantów stron internetowych. Jednak większość dystrybucji Linuksa domyślnie nie zawiera tych czcionek.
CSS2 próbował rozszerzyć narzędzia dostępne dla twórców stron internetowych, dodając syntezę czcionek, ulepszone dopasowywanie czcionek i możliwość zdalnego pobierania czcionek.
Niektóre właściwości czcionek CSS2 zostały usunięte z CSS2.1 i później włączone do CSS3.
Czcionki zastępcze
Specyfikacja CSS pozwala na wymienienie wielu czcionek jako czcionek zastępczych. W CSS font-familywłaściwość akceptuje listę rozdzielonych przecinkami krojów czcionek do użycia, na przykład:
font-family: "Nimbus Sans L", Helvetica, Arial, sans-serif;
Pierwsza określona czcionka jest czcionką preferowaną. Jeśli ta czcionka jest niedostępna, przeglądarka internetowa próbuje użyć następnej czcionki na liście. Jeśli żadna z określonych czcionek nie zostanie znaleziona, przeglądarka wyświetli czcionkę domyślną. Ten sam proces odbywa się również na podstawie znaku, jeśli przeglądarka próbuje wyświetlić znak nieobecny w określonej czcionce.
Ogólne rodziny czcionek
Aby zapewnić projektantom sieci Web pewną kontrolę nad wyglądem czcionek na ich stronach sieci Web, nawet jeśli określone czcionki nie są dostępne, specyfikacja CSS pozwala na użycie kilku ogólnych rodzin czcionek. Te rodziny służą do dzielenia czcionek na kilka kategorii na podstawie ich ogólnego wyglądu. Są one zwykle określane jako ostatnie z serii czcionek zastępczych, w ostateczności w przypadku, gdy żadna z czcionek określonych przez autora nie jest dostępna. Przez kilka lat istniało pięć rodzin generycznych:
- Czcionki, które nie mają ozdobnych oznaczeń ani szeryfów na swoich literach. Czcionki te są często uważane za łatwiejsze do odczytania na ekranach.
- Czcionki, które mają ozdobne oznaczenia lub szeryfy, obecne na ich znakach. Te czcionki są tradycyjnie używane w książkach drukowanych.
- Czcionki, w których wszystkie znaki są jednakowo szerokie.
- Czcionki przypominające pismo kursywą. Czcionki te mogą mieć dekoracyjny wygląd, ale przy małych rozmiarach mogą być trudne do odczytania, dlatego zazwyczaj używa się ich oszczędnie.
- Czcionki, które mogą zawierać symbole lub inne właściwości dekoracyjne, ale nadal reprezentują określony znak.
Czcionki CSS działające w wersji roboczej 4 z mniejszą obsługą przeglądarek
System-ui
- Domyślne czcionki w danym systemie: celem tej opcji jest umożliwienie integracji treści internetowych z wyglądem i działaniem natywnego systemu operacyjnego.
ui-szeryfowy
- Domyślne czcionki w danym systemie w stylu szeryfowym
ui-san-szeryf
- Domyślne czcionki w danym systemie w stylu bezszeryfowym
ui-monospace
- Domyślne czcionki w danym systemie w stylu monospace
zaokrąglony ui
- Domyślne czcionki w danym systemie w zaokrąglonym stylu
- Czcionki używające emotikonów
- Czcionki do złożonych formuł matematycznych i wyrażeń.
- Chińskie kroje pisma, które znajdują się między szeryfową Song a kursywą Kai. Ten styl jest często używany w dokumentach rządowych.
Czcionki internetowe
Historia
Technika odwoływania się i automatycznego pobierania czcionek zdalnych została po raz pierwszy określona w specyfikacji CSS2, która wprowadziła konstrukcję. W tym czasie pobieranie plików czcionek z sieci było kontrowersyjne, ponieważ czcionki przeznaczone do użytku tylko na niektórych stronach internetowych można było również pobierać i instalować z naruszeniem licencji na czcionkę.
@font-face
Microsoft po raz pierwszy dodano wsparcie dla pobrania EOT czcionek w Internet Explorer 4 w 1997. Autorzy musieli używać zastrzeżonych wątkową narzędzie do tworzenia subsetted plik czcionki dla każdej strony. EOT pokazał, że czcionki internetowe mogą działać, a format znalazł pewne zastosowanie w systemach pisania, które nie są obsługiwane przez popularne systemy operacyjne. Jednak format nigdy nie zyskał powszechnej akceptacji i został ostatecznie odrzucony przez W3C.
W 2006 roku Håkon Wium Lie rozpoczął kampanię przeciwko używaniu EOT i raczej przeglądarki internetowe obsługują powszechnie używane formaty czcionek. Obsługa powszechnie używanych formatów czcionek TrueType i OpenType została od tego czasu zaimplementowana w Safari 3.1 , Opera 10 , Mozilla Firefox 3.5 i Internet Explorer 9 .
W 2010 roku metoda kompresji WOFF dla czcionek TrueType i OpenType została zgłoszona do W3C przez Mozilla Foundation , Opera Software i Microsoft , a od tego czasu przeglądarki dodały obsługę.
Czcionki Google zostały uruchomione w 2010 roku w celu obsługi czcionek internetowych na licencjach open source . Do 2016 roku dostępnych będzie ponad 800 rodzin czcionek internetowych.
Czcionki internetowe stały się ważnym narzędziem dla projektantów stron internetowych, a od 2016 r. większość witryn korzysta z czcionek internetowych.
Formaty plików
Korzystając z określonej techniki osadzania CSS , można osadzić czcionki tak, aby działały z IE4+, Firefox 3.5+, Safari 3.1+, Opera 10+ i Chrome 4.0+. Dzięki temu większość użytkowników sieci Web ma dostęp do tej funkcji. Niektóre odlewnie komercyjne sprzeciwiają się redystrybucji swoich czcionek. Na przykład Hoefler i Frere-Jones twierdzą, że chociaż „… entuzjastycznie [wspierają] pojawienie się bardziej wyrazistej sieci, w której projektanci mogą bezpiecznie i niezawodnie korzystać z wysokiej jakości czcionek online”, obecne dostarczanie czcionek jest uważane za „nielegalną dystrybucję” przez odlewnię i jest zabronione. Zamiast tego Hoefler & Co. oferuje zastrzeżony system dostarczania czcionek zakorzeniony w chmurze. Wiele innych odlewni typu komercyjnego zajmuje się redystrybucją swoich czcionek, oferując specjalną licencję, zwaną licencją na czcionki internetowe, która pozwala na używanie oprogramowania czcionek do wyświetlania treści w Internecie, co zwykle jest zabronione przez podstawowe licencje komputerowe. Oczywiście nie koliduje to z czcionkami i odlewniami na wolnych licencjach.
@font-face@font-face
TrueDoc
TrueDoc , choć nie jest specyfikacją czcionki internetowej, był pierwszym standardem osadzania czcionek. Został opracowany przez typ Foundry Bitstream w 1994 roku i został natywnie obsługiwany przez Netscape Navigator 4 w 1996 roku. wydany. ActiveX plugin był dostępny dodać obsługę technologia TrueDoc do przeglądarki Internet Explorer , ale technologia musiała konkurować z Microsoft „s wbudowanych OpenType czcionek, które natywnie obsługiwanych w przeglądarce Internet Explorer od wersji 4.0. Inną przeszkodą był brak otwartego lub bezpłatnego narzędzia do tworzenia czcionek internetowych w formacie TrueDoc, podczas gdy firma Microsoft udostępniła bezpłatne narzędzie do osadzania czcionek internetowych do tworzenia czcionek internetowych w ich formacie.
Wbudowany OpenType
Internet Explorer obsługuje osadzanie czcionek za pośrednictwem zastrzeżonego standardu Embedded OpenType od wersji 4.0. Wykorzystuje techniki zarządzania prawami cyfrowymi , aby zapobiec kopiowaniu i używaniu czcionek bez licencji. Uproszczony podzbiór EOT został sformalizowany pod nazwą CWT ( Compatibility Web Type , dawniej EOT-Lite )
Skalowalna Grafika wektorowa
Typografia internetowa odnosi się do SVG na dwa sposoby:
- Wszystkie wersje specyfikacji SVG 1.1, w tym podzbiór SVGT , definiują moduł czcionek umożliwiający tworzenie czcionek w dokumencie SVG. Safari wprowadziło obsługę wielu z tych właściwości w wersji 3. Opera dodała wstępną obsługę w wersji 8.0, a obsługę większej liczby właściwości w wersji 9.0.
- Specyfikacja SVG umożliwia stosowanie CSS do dokumentów SVG w podobny sposób do dokumentów HTML, a reguła może być stosowana do tekstu w dokumentach SVG. Opera dodała obsługę tego w wersji 10, a WebKit od wersji 325 obsługuje również tę metodę tylko przy użyciu czcionek SVG .
@font-face
Skalowalne czcionki grafiki wektorowej
Czcionki SVG były standardem czcionek W3C wykorzystującym grafikę SVG, która stała się podzbiorem czcionek OpenType. Dopuszczał czcionki wielokolorowe lub animowane. Początkowo był podzbiorem specyfikacji SVG 1.1, ale został przestarzały w specyfikacji SVG 2.0. Czcionki SVG jako niezależny format są obsługiwane przez większość przeglądarek oprócz IE i Firefox i są przestarzałe w Chrome (i Chromium). To jest teraz ogólnie przestarzałe; standardem, z którym zgodziła się większość dostawców przeglądarek, jest podzbiór czcionek SVG zawarty w OpenType (a następnie nadzbiór WOFF, patrz poniżej), o nazwie SVGOpenTypeFonts . Firefox obsługuje SVG OpenType od Firefox 26.
TrueType/OpenType
Łączenie ze standardowymi czcionkami TrueType (TTF) i OpenType (TTF/OTF) jest obsługiwane przez Mozilla Firefox 3.5+, Opera 10+, Safari 3.1+ i Google Chrome 4.0+. Internet Explorer 9+ obsługuje tylko czcionki z uprawnieniami do osadzania ustawionymi na instalację.
Otwarty format czcionki internetowej
Format Web Open Font (WOFF) jest zasadniczo OpenType lub TrueType z kompresją i dodatkowego metadanych. WOFF jest obsługiwany przez Mozilla Firefox 3.6+, Google Chrome 5+, Opera Presto oraz Internet Explorer 9 (od 14 marca 2011). Wsparcie jest dostępne w systemie Mac OS X Lion's Safari od wersji 5.1.
Czcionki Unicode
Tylko dwie czcionki dostępne domyślnie na platformie Windows , Microsoft Sans Serif i Lucida Sans Unicode , zapewniają szeroki repertuar znaków Unicode . Błąd w Verdana (i różnego obchodzenia się z nim za pomocą różnych środków użytkownika ) hamuje jego przydatności w przypadku łączenie znaków są pożądane.
Na darmowych i otwartych platformach oprogramowania , takich jak Linux , GNU Unifont i GNU FreeFont zapewniają szeroki zakres znaków Unicode .
Alternatywy
Częstą przeszkodą w projektowaniu stron internetowych jest projektowanie makiet zawierających czcionki, które nie są bezpieczne w sieci. Istnieje wiele rozwiązań dla takich sytuacji. Jednym z typowych rozwiązań jest zastąpienie tekstu podobną czcionką bezpieczną w Internecie lub użycie serii podobnie wyglądających czcionek zastępczych.
Inną techniką jest zastępowanie obrazu . Ta praktyka polega na nakładaniu tekstu z obrazem zawierającym ten sam tekst napisany żądaną czcionką. Jest to dobre ze względów estetycznych, ale uniemożliwia zaznaczanie tekstu, zwiększa wykorzystanie przepustowości, jest niekorzystne dla optymalizacji pod kątem wyszukiwarek i sprawia, że tekst jest niedostępny dla użytkowników niepełnosprawnych.
Powszechne jest również stosowanie rozwiązań opartych na technologii Flash , takich jak sIFR . Jest to podobne do technik zastępowania obrazów, chociaż tekst można zaznaczać i renderować jako wektor. Jednak ta metoda wymaga obecności zastrzeżonej wtyczki w systemie klienta.
Innym rozwiązaniem jest użycie Javascript do zastąpienia tekstu VML (dla Internet Explorera) lub SVG (dla wszystkich innych przeglądarek).
Usługi hostingu czcionek umożliwiają użytkownikom opłacenie subskrypcji za hosting czcionek, które nie są bezpieczne w Internecie. Większość usług hostuje czcionkę dla użytkownika i zapewnia niezbędną deklarację CSS.
@font-face
Przykładowa konfiguracja CSS :
@font-face
@font-face {
font-family: 'Journal';
src: url('http://your-own.site/fonts/journal/journal.woff') format('woff'),
url('http://your-own.site/fonts/journal/journal.svg#Journal') format('svg'),
url('http://your-own.site/fonts/journal/journal.ttf') format('truetype'),
url('http://your-own.site/fonts/journal/journal.eot'),
url('http://your-own.site/fonts/journal/journal.eot?#iefix') format('embedded-opentype');
font-weight: normal;
font-style: normal;
}
Względy praktyczne
W praktyce liczy się nie tylko to, z jakiej przeglądarki internetowej korzysta publiczność, ale także jak skonfigurowany jest ich system operacyjny. W 2010 roku projektant czcionek i konsultant Thomas Phinney (wiceprezes FontLab i wcześniej współpracował z Adobe) napisał krok po kroku proces znajdowania najlepszego rozwiązania do renderowania, które – mniej lub bardziej żartobliwie – wykorzystuje dużą liczbę instrukcji goto . Bardziej zorientowany wizualnie schemat blokowy został opublikowany w tym samym roku na forum Typophile przez Miha Zajec.
Zobacz też
- Skalowalna wymiana lampy błyskowej Inman
- Lista RFC wymieniona w WOFF (projekt z 23.10.2009):
Uwagi
- ^ Zobaczlistę krojów pisma Open-source i Wolnego oprogramowania Unicode dla takich czcionek.
Bibliografia
Linki zewnętrzne
- Specyfikacja czcionek CSS W3C
- Typoscan to narzędzie dla projektantów, które pomaga zeskanować typografię dowolnej witryny w mniej niż sekundę.