Вграждане на персонализирани шрифтове с Fontsquirrel
Преди да започна преглед на fontsquirrel.com, трябва да кажа няколко думи за това какво е правилото @ font-face и защо изобщо се нуждаем от генератор на шрифтове.
Например, помислете за тази ситуация - искате да вградите шрифт Горчив, която е в същата папка като файла със стилове.
Сега този шрифт може да се използва в бъдеще, както сме свикнали, в таблицата със стилове, задавайки свойството на шрифта за отделни html елементи, което указва името bitterregular.
Въпреки всички предимства и коректност на метода, за разлика от онези "патерици", които са били използвани по-рано, той също има своите недостатъци. Един от тях е липсата на съвместимост между браузърите. За да могат всички браузъри да възприемат адекватно това правило, трябва да преведете шрифта във формат ttf/otf в други възможни формати - EOT, WOFF, SVG.
След манипулациите правилото ще изглежда така
Как да вградите безплатен шрифт от колекцията Fontsquirrel?
Ако щракнете върху името на някой от шрифтовете, ще се отворят допълнителни настройки и информация.
- Образци - това показва текста, към който е приложен шрифтът от падащия списък.
- Тест драйв - ние самите имаме възможност да напишем произволен текст, за да видим как ще изглежда с избрания стил
- Глифи - този раздел показва всички символи, които тази опция за шрифт съдържа
- Разрешително - страница за запознаване с лиценза
- Комплект за уеб шрифтове - ако лицензът за шрифт позволява, тогава той може да се използва за вграждане и някои настройки могат да бъдат направени в този раздел. Намалете размера на файла, като намалите броя на символите в набора (това може да стане чрез избор на език) - Изберете подмножество и изберете необходимите файлови формати - Изберете Формат на шрифта. Когато всички настройки са направени, просто натиснете бутона изтеглете @ font-faceкомплект, за да изтеглите архива.
Не във всички случаи можете да изтеглите комплекта, списъкът съдържа шрифтове с някакъв специален лиценз SIL OFL, който не позволява разпространението им в преобразувана форма, поради което трябва сами да използвате WebFont Generator.
Как може Fontsquirrel да генерира шрифтове за мрежата въз основа на персонализиран шрифт?
На същия сайт отворете раздела УЕБФОНТ ГЕНЕРАТОР и ще видим тази форма.