Как скачать и подключить стильный шрифт для сайта

Нашел отличный ресурс, где быстро и удобно можно подобрать для своего сайта понравившийся русский шрифт: http://fonts4web.ru/

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

В самом низу есть кнопка на скачивание этого шрифта.

Всё элементарно: скачиваем, прописываем в CSS, наслаждаемся стильным шрифтом!

Еще архивы со шрифтами можно скачать на сайте: shriftkrasivo.ru

Столкнулся с проблемой, когда искал конкретный шрифт. На многих сайтах для скачивания предоставляется один файлик в формате .otf или .ttf, а нам для соблюдения кроссбраузерности нужны и другие форматы: woff, woff2, eot, ttf, svg. Помимо этих есть еще около 10 форматов шрифтов.

Вот здесь качаются архивы с несколькими форматами шрифтов: https://webfonts.pro/base-web-fonts/sans-serif-grotesque/216-bebas-neue.html

Второй способ подключения шрифтов

Можно шрифты не скачивать, а подключить их, указав путь к шрифтам через <link href= > об этом написано здесь: http://allfont.ru/download/bebas-neue/