Для подключения шрифтов используется программная вставка в CSS, так называемые @-правило. Итак, в простейшей форме @font-face — это эдакая декларация. Выглядит она следующим образом:

TTF или OTF — привычный нам файл шрифта, но подгружаемый с сервера на время просмотра сайта;

WOFF — незащищенный архив исходника OTF или TTF, пожалуй, самый важный формат, который поддерживают большинство популярных браузеров, а файлы в WOFF обычно 2–2,5 раза легче, чем исходные;

EOT — внедряемый TT OpenType архив, имеющий механизмы защиты, нужен для поддержки старых браузеров Internet Explorer (начиная с IE8 кроме TrueType кривых, поддерживаются и PostScript);

SVG — для поддержки браузера Safari.

Подробности на видео и по ссылкам на материалы…

Ссылки на материалы: