Какви са генеричните семейства шрифтове в CSS?

Общите класификации на шрифтове, които можете да използвате на уебсайта си

При проектирането на уебсайт един от ключовите елементи на страницата, с която ще работите, е текстовото съдържание. По този начин, когато изграждате уеб страница и я стил с CSS, голяма част от това усилие ще бъде съсредоточена около типографията на сайта.

Типичният дизайн играе важна роля в дизайна на уебсайтове. Доброто изработено и форматирано текстово съдържание помага на сайта да бъде по-успешен, като създава преживяване за четене, което е едновременно приятно и лесно да се консумира. Част от усилията ви за работа с типа ще бъде да изберете правилните шрифтове за вашия дизайн и след това да използвате CSS, за да добавите тези шрифтове и стиловете на шрифта към дисплея на страницата. Това се прави, като се използва това, което се нарича " font-stack "

Шрифт Stacks

Когато посочите шрифт, който да използвате в уеб страница, най-добрата практика е да включите и резервни опции, в случай че изборът на шрифт не може да бъде намерен. Тези резервни опции са представени в "пакета с шрифтове". Ако браузърът не може да намери първия шрифт, посочен в стека, той се премества в следващия. Продължава този процес, докато не намери шрифт, който може да използва или изчерпва избора си (в който случай просто избира всеки системен шрифт, който иска). Ето един пример за това, как ще изглежда стълбът на шрифтове в CSS, когато се прилага към елемента "body":

тяло {шрифт-семейство: Грузия, "Times New Roman", serif; }

Забележете, че първо посочваме шрифта Грузия. По подразбиране това е, което ще използва страницата, но ако този шрифт не е налице по някаква причина, страницата ще се оттегли от Times New Roman. Затваряме това име на шрифта в двойни кавички, защото това е име на няколко думи. Имената на шрифтовете на една дума, като Грузия или Arial, не изискват кавичките, но името на шрифта на няколко думи се нуждае от тях, така че браузърът знае, че всички тези думи съставляват името на шрифта.

Ако погледнете края на стека на шрифта, трябва да забележите, че завършваме с думата "serif". Това е фамилно име на шрифта. В невероятното събитие, че човек няма Джорджия или Times New Roman на своя компютър, сайтът ще използва каквото и да е шрифт, който може да намери. Това е за предпочитане да се позволи на сайта да се съпротивлява на каквото и да е шрифтове, защото може да кажете поне какъв шрифт да използвате, така че цялостният облик и тон на дизайна на сайта да бъде възможно най-непокътнат. Да, браузърът ще избере шрифт за вас, но поне вие ​​предоставяте напътствия, така че той знае какъв шрифт ще работи най-добре в дизайна.

Генерични семейства от шрифтове

Общото име на шрифта, налично в CSS, е:

Макар че има много други класификации на шрифтове в уеб дизайна и типографията, включително slab-serif, blackletter, display, grunge и др., Тези 5 имена на генерични шрифтове, изброени по-горе, са тези, които бихте използвали в куп шрифтове в CSS. Какви са разликите в тези класификации на шрифтове? Нека да погледнем!

Склонните шрифтове често се състоят от тънки, орнаментирани формати на букви, предназначени да възпроизвеждат фантастичен ръкописен текст. Тези шрифтове, поради тънките си цветни букви, не са подходящи за голям блок от съдържание като копие на тялото. Курсивните шрифтове обикновено се използват за заглавия и по-кратки текстови нужди, които могат да се показват в по-големи размери на шрифтове.

Фантастичните шрифтове са донякъде луди шрифтове, които всъщност не попадат в друга категория. Шрифтове, които копират добре известни лога, като буквите от филмите "Хари Потър" или "Връщане към бъдещето", ще попаднат в тази категория. Още веднъж тези шрифтове не са подходящи за съдържание на тялото, тъй като те често са толкова стилизирани, че четенето на по-дълги пасажи от текст, написан в тези шрифтове, е много трудно да се направи.

Monospace шрифтове са тези, при които всички формати на писмо са еднакво големи и раздалечени, както бихте намерили на стара пишеща машина. За разлика от други шрифтове, които имат променливи ширини за букви в зависимост от техния размер (например, капитал "W" ще заема много повече място от малка буква "i"), моноспасите шрифтове са с фиксирана ширина за всички знаци. Тези шрифтове често се използват, когато кодът се показва на страница, защото изглежда различно различен от другия текст на тази страница.

Серифните шрифтове са една от най-популярните класификации. Това са шрифтове, които имат малките допълнителни лигатури върху буквите. Тези екземпляри се наричат ​​"серифи". Общите серифни шрифтове са Грузия и Times New Roman. Серифните шрифтове могат да се използват за голям текст, като заглавие, както и за дълги текстове и копия на тялото.

Sans-serif е последната класификация, която ще разгледаме. Това са шрифтове, които нямат споменатите по-горе лигатури. Името означава "без серфи". Популярните шрифтове в тази категория ще бъдат Arial или Helvetica. Подобно на серифите, sans-serif шрифтовете могат да се използват еднакво добре както в заглавията, така и в съдържанието на тялото.

Оригинална статия на Дженифър Кринин. Редактиран от Джереми Жирард на 16.10.17