Блогът на Гонзо

Шрифтове в уеб – идва ли края на мъчението?

Всеки дизайнер е наясно с ограничения набор от шрифтове, достъпни в уеб. Проблемът проистича от факта, че за да изобрази браузъра даден шрифт, той трабва да е инсталиран на компютъра на потребителя. И за да ни е по-интересно, различните платформи идват с различен набор от шрифтове. Е, вече няма да е така, с излизането на Firefox 3.5 и версия 10 на Опера преди това всички основни браузъри вече поддържат декларацията @font-face от CSS.

Конструкцията @font-face позволява да укажете името на шрифта, файла, който да се използва за изобразяването му, както и характеристиките му.

@font-face {
font-family: "Tagesschrift";
src: url("fonts/YanoneTagesschrift.ttf");
font-weight:normal;
}

h1 {
font-family: Tagesschrift,serif;
}

Горното ще изобрази основното заглавие в страницата със шрифта Tagesschrift, описан във файла YanoneTagesschrift.ttf. И това работи във Сафари 3.2, Frefox 3.5, Опера 10. Ами IE? Е, както винаги от Microsoft са на собствено мнение по въпроса и поддържат шрифтове в свой собствен формат, който наричат Embeddable Open Type. За да конвертирате шрифтовете в този формат, ще ви трябва инструмента WEFT, който не е точно удобен за работа, но пък няма алтернатива (търсих!). Този инструмент ще генерира за вас шрифтовете и съответните CSS декларации, които естествено ще трябва да поставите във CSS файл, който да зареждате със условен коментар. Ако ползвате последна версия на съвременен браузър, ето и примерна страничка с два шрифта, които най-вероятно нямате. В заглавната част на този блог също ползвам шрифт, зареден с @font-face, като съм си направил труда да направя и EOT вариант за тези, които по една или друга причина още ползват IE.

Конструкцията @font-face позволява освен пътя до шрифта да опишете и повечето му характеристики – дебелината (font-weight как се казва на български?), дали е курсив и т.н. Освен това имате възможност да зададете различни имена, под които браузъра да го потърси на потребителската машина, преди да се опита да го изтегли:

@font-face {
font-family: MyHelvetica;
src: local("Helvetica Neue"),
local("HelveticaNeue"),
url(MgOpenModernaRegular.ttf);
}

body { font-family: MyHelvetica, sans-serif; }

Примерът е от статията Beautiful fonts with @font-face. В нея можете да намерите и други съвети относно използването на тази конструкция.

За съжаление завръщането на @font-face в спецификацията и поддръжката от основните браузъри не решава напълно проблема с използването на различни шрифтове в уеб. В момента, в който решите да качите любимия си шрифт на вашия сървър, вие ще се превърнете в пират, ограбващ интелектуалната собственост на създателите му. Въпросът за евентуалното неограничено копиране на файловете се явява сериозна пречка пред приемането на OpenType като основен формат в CSS3 стандарта. Повече по въпроса смятам да напиша в следваща публикация, а до тогава ето статии, третиращи типографията в уеб:

Етикети: , , , , , ,

3 коментара по “Шрифтове в уеб – идва ли края на мъчението?

  1. Гонзо

    Явно не съм търсил правилно… Благодаря, Ангеле, вече го дръпнах, компилира се без проблем и работи, остава да тествам резултата.

    А проектът е в GoogleCode, просто защото създателят на програмчето е харесал услугата. GoogleCode e просто още една услуга за хостване на проекти с отворен код и проектите там не са по никакъв начин гарантирани от Гугъл.

Вашият коментар

Вашият имейл адрес няма да бъде публикуван. Задължителните полета са отбелязани с *