Използване на вашия собствен шрифт на вашия уебсайт CSS3

собствен

Персонализираните шрифтове са един от най-завладяващите аспекти на CSS3 за дизайнерите. С новото правило @ font-face можете да добавите произволен шрифт към вашия сайт или уеб страница, независимо дали потребителят има инсталиран шрифт или не. Разбира се, винаги можете да използвате Google Fonts и т.н., но тази статия ще се фокусира върху използването на вашия собствен уникален или закупен шрифт.

Както при повечето CSS3, основният код е доста прост, но на практика трябва да се вземат предвид всички условия, за да се постигне максимален ефект.

В този кратък урок ще ви покажем основите на прилагането на вашия шрифт към вашия уебсайт с помощта на @ font-face CSS3.

Изтеглете шрифта

Първо се уверете, че шрифтовете, които искате да използвате, са лицензирани за използване в Интернет. Почти всички безплатни шрифтове могат да се използват на уебсайтове. Но ако сте купили първокласен шрифт, уверете се, че имате право да го използвате онлайн за вашия уебсайт или проект.

След това качете избрания шрифт на вашия сървър. Можете да го съхранявате в специална папка „Шрифтове“ за простота и организация, но това не е необходимо.

Не забравяйте да включите файлове за всички варианти на шрифта, които планирате да използвате, като получер или курсив. Можете да използвате EOT (Embedded OpenType) файлове за Internet Explorer и OTF (OpenType) или TTF (TrueType) за останалото. (Допълнителните опции включват WOFF (Web Open Font Format) и SVG (Scalable Vector Graphics), но ще се придържаме към най-често срещаните типове)