Приводится данные по использованию типографики в заголовке и основном тексте на сайтах ведущих СМИ по версии медиалогии за ноябрь 2017 года. Исследование проведено в январе 2018 года. Представлены CSS свойства font-weight, font-size, line-height, font-family для отдельного материала - статьи. Выбор обусловлен тем, что это основной материал средств массовых коммуникаций. Метрики сняты для ширины экрана более 1280px.

В таблице основные значение - вычисленные пиксели, в скобках указаны оригинальые единицы измерения шрифтов из CSS кода сайтов.

Для справки: font-weight normal - 400, font-weight bold - 700.

Таблица шрифтовых пар

Заголовок статьи (Обычно h1) Основной текст
Тип Название font-weight font-size line-height font-family font-weight font-size line-height font-family
1 Газеты Известия 700 30 35 Fira Sans 400 16 23 Noto Serif
2 Газеты КоммерсантЪ 400 30 30 Georgia 400 16 24 Georgia
3 Газеты Ведомости 400 48 52 Fedra
Sans Demi
400 19 24 Georgia
4 Газеты Российская газета 700 30 36 Roboto 400 16 30 Roboto
5 Газеты Комсомольская правда 700 30 35 OpenSans 400 15 22 OpenSans
6 Газеты Новая газета 900 25 40 helveticaneuecyr 400 18 25 Georgia
7 Газеты Московский комсомолец 400 25.6px(2em) 35.8px(140%) Roboto
Condensed,Georgia,'Century Schoolbook L'
400 12.8px(0.8em) 20.48px(160%) Verdana,'Geneva
CY',Helvetica,'DejaVu Sans'
8 Газеты Парламентская газета 300 28.8px(1.8em) 37.7px(1.3em) Roboto Slab,serif; 400 16 24 Roboto, Verdana, Arial, sans-serif
9 Газеты Аргументы и факты 700 28px(1,75em) 28px(1) Roboto,
sans-serif;
400 16 20,8(1.3em) PT Serif', serif;
10 Газеты Независимая газета 700 36 36 plumb_condregular, Arial, sans-serif; 400 15 19 Arial, sans-serif;
1 Журналы Forbes 400 39 43 Avenir Next Cyr Arial, serif; 400 18 26 Avenir
Next Cyr Arial, serif;
2 Журналы Star Hit 400 36 39,6(1.1em) FuturaFuturisBold, Arial,
Helvetica, sans-serif;
400 13 18 Arial, Verdana, sans;
3 Журналы Glamour 400 46 50,6(1.1) Kuenstler 480 BT, serif; 400 17 24(1.412) Kuenstler
480 BT, serif;
4 Журналы Tatler 400 57 54(.94737em) ITC Bodoni 72 ML W10,
serif
400 15 24 Pragmatica W10, sans-serif
5 Журналы Сноб 500 50(5rem) 50 Futura PT,Helvetica
Neue,Helvetica,Arial,sans-serif;
400 18(1.8rem) 24,84(1.38) conqueror_text_regular',Georgia,Times
New Roman,Times,serif
6 Журналы Marie Claire 400 34 54 Playfair Display', serif,
Georgia, Times New Roman, Times, serif;
400 16 26 Roboto', sans-serif
7 Журналы HELLO! 400 36 40(2,5rem) MyriadProRegular, sans-serif 400 17 26 MyriadProRegular,
sans-serif
8 Журналы Профиль 700 28 40 verdana,Arial,Helvetica,sans-serif 400 14 18 verdana,Arial,Helvetica,sans-serif
9 Журналы MAXIM 400 24 30 Roboto Slab',sans-serif; 400 15 24 Open
Sans, sans-serif
10 Журналы Журнал РБК 400 42 42 GraphikCy-Semibold,'Helvetica
CY',Arial,sans-serif;
400 18 26 Kazimir,'Helvetica CY',Arial,sans-serif
1 Интернет-ресуры Rbc.ru 400 42 42 GraphikCy-Semibold,'Helvetica CY' 400 18 26 Kazimir,'Helvetica
CY'
2 Интернет-ресуры Gazeta.ru 700 28 36 PT Serif, serif; 400 18 24 PT Serif', serif;
3 Интернет-ресуры Lenta.ru 700 30 30 PT Serif, Georgia, 'Times New Roman', Times, 400 16 20 PT
Serif', Georgia, 'Times New Roman', Times
4 Интернет-ресуры Life.ru 400 44 48 Roboto Slab, serif 400 17 24,2857(1.42857) Roboto, sans-serif;
5 Интернет-ресуры Fontanka.ru 300 32 38 Roboto Slab',Tahoma,sans-serif; 400 16 20,8(1.3em) Arial,
sans-serif;
6 Интернет-ресуры Kp.ru 700 30 35 OpenSans, sans-serif 400 15 22 OpenSans, sans-serif
7 Интернет-ресуры Dni.ru 400 24 36 IntroBoldCaps 400 17 23,8(1.4) IntroCondRegular
8 Интернет-ресуры M24.ru 700 46 46 Lato 400 18 26 Rubik,sans-serif;
9 Интернет-ресуры Meduza.io 400 37 38 PFRegal, Georgia, serif; 400 20 27 PFRegal,
Georgia, serif;
10 Интернет-ресуры Znak.com 700 40 44(1,1) PT Sans, sans-serif 400 17 22,1(1.3) PT Sans, sans-serif
1 ТВ-каналы RT 700 34(3.4em) 40(1.17647em) DIN Pro' 400 18(1.8em) 26(1.4444em) Segoe
UI', Arial, Helvetica, Verdana, Roboto, Calibri, sans-serif
2 ТВ-каналы Рен Тв 700 32 38,4(1.2) PT Sans',sans-serif,Arial; 400 17 24 Arial,
Helvetica, sans-serif
3 ТВ-каналы Россия 24 400 32 36 RussiaLight, sans-serif 400 16 24 OpenSansRegular,
sans-serif
4 ТВ-каналы Россия 1 400 32 36 RussiaLight, sans-serif 400 16 24 OpenSansRegular,
sans-serif
5 ТВ-каналы Первый канал 700 38 40 PT Sans, serif 400 16 normal PT Sans, serif
6 ТВ-каналы НТВ 400 34 normal PTSerifCaption', Arial,
Helvetica, sans-serif;
400 17 26 PTSansRegular', Arial, Helvetica, sans-serif;
7 ТВ-каналы Звезда 700 30 30 PT Serif',serif; 400 15 20 Georgia,
serif
8 ТВ-каналы Дождь 600 32 36 Roboto, sans-serif 400 16 22,7(140%) Roboto, sans-serif
9 ТВ-каналы ТВ Центр 400 30 30 Open Sans, sans-serif 400 15 20 Open
Sans, sans-serif
10 ТВ-каналы Пятый канал 700 24(2.4rem) 24(2.4rem) PT Sans, Trebuchet MS,
sans-serif;
400 18(1.8rem) 22.5(1.25) PT Sans,
Trebuchet MS, sans-serif

Небольшой анализ

В заголовках к моему удивлениею преобладает нежирный текст: 22 результата (300+400+500) против 18 жирных (600+700+900). В основном тексте только "нормальный" шрифт: все 40 сайтов. Во всех журналах, кроме "Профиля", в заголовках не используется жирный шрифт, видимо "жирный" даже в такой мелочи под запретом)).

Медианные значение высоты шрифта и межстрочного интервала для заголовков - 32px/36px, для основого текста - 16px/24px. Что интересно, webkit браузеры по умолчанию делает заголовки h1 равным 2em, при базовом шрифте 16px. Получается, что статистически размер шрифта для заголовка и основного текста совпадает со значением по умолчанию браузеров. Межстрочный интервал не совпадает (по-умолчанию больше): 37,4px и 25.6 px соответственно.

На 13 ресурсах из 40 применяется один и тот же шрифт для заголовков и основного текста.

Часто встречающиеся шрифты заголовка:

  • Семейство Roboto 8
  • PT Sans 4
  • PT Serif 4
  • OpenSans 3

Часто встречающиеся шрифты основного текста:

  • OpenSans 6
  • Roboto 5
  • Arial (Зачем они его выбрали) 4
  • PT Sans 4
  • Georgia 4
  • PT Serif 3
  • Verdana 2