Какой использовать сервис для хранения шрифтов?

Question

[dm]

Использую в вёрстке шрифт, которого нет в GoogleFonts, WebFont, fonts4web.
Скачал в сети ttf и сгенерировал нужные мне форматы здесь - www.fontsquirrel.com/tools/webfont-generator

Куда их теперь загрузить для подключения через link? Какой есть проверенный временем сервис для хранения шрифтов?

Answer 1

[Капитан Какао]

Так а почему их не заливать на сайт для которого вы приминяете эти шрифты?
Я к примеру всегда заливаю шрифты или на сайт на котором эти шрифты применяю.
Или на свой сайт заливаю, и с него подключаю.

Comments

[dm]

Чесно говоря, не знаю почему. Вроде очевидный вариант. ) Спасиб. Иногда очевидное как-то ускальзывает. Опыта мало еще.

[Капитан Какао]

dm: как говоится - "Всё гениальное-просто" ))

[dm]

А вот вспомнил, что не понравилось. На гуглфонт, например, весь набор шрифтов (лайт, болд италик и т. д.) подключаются одной ссылкой. А у меня эти лайт болд, регуляр и т .д. разными файлами и в даух форматах. Получается в хедере будет 10 подключений шрифта? Это нормально?

[Антон]

dm: Я обычно подключенные шрифты в отдельный fonts.css файл выношу

[Дмитрий Королёв]

dm: вы посмотрите, какой код отдает эта "одна ссылка" от Google Font. Там тоже по десять файлов в итоге получается.

[Капитан Какао]

dm: вы заливаете шрифт во всех нужных форматах, на свой сайт к примеру в папку /fonts
В итоге получается типа так

/fonts/arial.ttf
/fonts/arial.woff
/fonts/arial.woff2
/fonts/arial.eot
/fonts/arial.svg

В этуже папку пихаете файл стилей

/fonts/arial.css

В файле CSS пишите примерно такой код

@font-face {
font-family: "arial";
font-weight: normal;
font-style: normal;
src: url("tvoy-sayt.ru/fonts/arial.eot");
src: url("tvoy-sayt.ru/fonts/arial.eot?#iefix") format("embedded-opentype"),
url("tvoy-sayt.ru/fonts/arial.woff") format("woff"),
url("tvoy-sayt.ru/fonts/arial.woff2") format("woff2"),
url("tvoy-sayt.ru/fonts/arial.ttf") format("truetype"),
url("tvoy-sayt.ru/fonts/arial.svg#JournalRegular") format("svg");
}

В корне сайта обязательно создай файл .htaccess
И вставь в него этот код

Header add Access-Control-Allow-Origin *
RewriteEngine on
RewriteBase /

Если не создать .htaccess с такой начинкой, подключать шрифты со своего сайта не сможешь.

Затем в сайт на котором нужно подключить шрифт, подключай его.
При том, что бы не подключать в head, подключайт сразу в CSS сайта.
В любое место в CSS сайта вставляй такой код (лучше в самом верху)

Dmitrijs Balcers url(tvoy-sayt.ru/fonts/arial.css);

Вот рабочий пример такого подключения с моего сайта: jsfiddle.net/0k2j5d5a

[ich_heisse_erich]

Очевидное преимущество подключения шрифта из Гугла это то, что у клиента он может быть уже скачан и повторно загружаться не будет.