Файлы .woff .woff2 .ttf зачем нужны?

Здравствуйте. Я по прежнему разбираюсь с устройством шаблонного сайта.

Подскажите, пож-та, очень много разных файлов с расширениями .woff .woff2 .ttf .eot .svg

В css прописано

@font-face {
  font-family: 'Roboto';
  src: url("roboto-l.eot");
  src: url("roboto-l.eot@") format("embedded-opentype"), url("roboto-l.woff2") format("woff2"), url("roboto-l.woff") format("woff"), url("roboto-l.ttf") format("truetype"), url("roboto-l.svg") format("svg");
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: 'Roboto';
  src: url("roboto-m.eot");
  src: url("roboto-m.eot@") format("embedded-opentype"), url("roboto-m.woff2") format("woff2"), url("roboto-m.woff") format("woff"), url("roboto-m.ttf") format("truetype"), url("roboto-m.svg") format("svg");
  font-weight: 500;
  font-style: normal; }


@font-face {
  font-family: 'OpenSans';
  src: url("open_sans-r.eot");
  src: url("open_sans-r.eot@") format("embedded-opentype"), url("open_sans-r.woff2") format("woff2"), url("open_sans-r.woff") format("woff"), url("open_sans-r.ttf") format("truetype"), url("open_sans-r.svg") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'OpenSans';
  src: url("open_sans-i.eot");
  src: url("open_sans-i.eot@") format("embedded-opentype"), url("open_sans-i.woff2") format("woff2"), url("open_sans-i.woff") format("woff"), url("open_sans-i.ttf") format("truetype"), url("open_sans-i.svg") format("svg");
  font-weight: normal;
  font-style: italic; }

@font-face {
  font-family: 'OpenSans';
  src: url("open_sans-l-i.eot");
  src: url("open_sans-l-i.eot@") format("embedded-opentype"), url("open_sans-l-i.woff2") format("woff2"), url("open_sans-l-i.woff") format("woff"), url("open_sans-l-i.ttf") format("truetype"), url("open_sans-l-i.svg") format("svg");
  font-weight: 300;
  font-style: italic; }
...
и т.д. очень много строк

Не нашел для чего нужны эти файлы.

Я их удалил с сервера (.woff .woff2 .ttf), внешний вид сайта не изменился. Подскажите, пож-та, зачем они нужны и можно ли удалить, у них общий вес, 2Мб, как я понимаю, они подгружаются в css...

Спасибо заранее.