Верхние и нижние индексы в верстке: функции OpenType

Верхние и нижние индексы в верстке корректнее оформлять не ручным уменьшением кегля, а специальными глифами и функциями OpenType. Такой подход сохраняет пропорции знаков, их положение относительно базовой линии и единый ритм текста. В статье разберем теги sups и subs, дроби и порядковые сокращения, настройку в редакторах и CSS. Материал актуален на 22 июля 2026 года.

Верхний индекс — знак или группа знаков, поднятая над основной строкой и уменьшенная по специальным типографическим пропорциям. Он используется в математических степенях, ссылках на примечания, некоторых сокращениях и обозначениях единиц. Нижний индекс располагается ниже базовой линии и часто встречается в химических формулах, индексах переменных и технических обозначениях: H₂O, x₁ или CO₂.

Индекс — это не просто символ с меньшим размером. У профессионально спроектированного шрифта для него могут быть отдельные глифы: с другой высотой, шириной, толщиной штрихов, апрошем и формой знаков. Поэтому верхняя двойка в математической записи и уменьшенная обычная двойка могут выглядеть похоже, но вести себя по-разному в строке.

Ручное форматирование обычно означает уменьшение кегля, изменение вертикального смещения и иногда дополнительную настройку межбуквенного расстояния. Этот способ требует повторной работы в каждом фрагменте и легко приводит к разнобою: одна степень оказывается слишком высокой, другая — слишком низкой, а цифры начинают выпадать из общего рисунка строки.

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

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

Тег sups предназначен для верхних индексов. Он подходит для записей вроде x², m³, ссылок на примечания и некоторых типографских сокращений. Если шрифт поддерживает функцию, программа заменяет обычные знаки на специально спроектированные верхние варианты. Это отличается от команды «верхний индекс», которая в отдельных приложениях может лишь уменьшать и поднимать исходный символ.

Тег subs активирует нижние индексы. Его основная область применения — химические формулы, физические обозначения и последовательности переменных: H₂O, SO₄, aₙ. Нижняя позиция должна быть достаточно заметной, но не создавать слишком большой разрыв между строками. В многострочном наборе особенно важно проверить, не конфликтует ли индекс с нижними выносными элементами соседней строки.

Тег ordn связан с порядковыми обозначениями, например 1st или 2nd в английском наборе. Он не является универсальной заменой для любого верхнего индекса. В русском тексте формы «1-й», «2-я» и «3-е» обычно зависят от редакционной системы и языка документа, поэтому их оформление нужно проверять по правилам конкретного проекта, а не автоматически поднимать все окончания.

Функция frac может преобразовать запись дроби в типографский формат, где числитель получает верхнее положение, знаменатель — нижнее, а между ними появляется разделительная черта. Теги numr и dnom используются для числителей и знаменателей как отдельных наборов. Дробь 1/2 в обычном тексте и вертикальная дробь в рецепте, таблице или технической формуле требуют разного набора, поэтому автоматический результат нужно оценивать в контексте.

В InDesign, Illustrator и других профессиональных приложениях ищите настройки OpenType в панели символов, меню шрифта или отдельном разделе типографики. Названия команд могут отличаться, но логика одна: выбрать текст, включить верхние или нижние альтернативы и проверить, действительно ли гарнитура содержит нужные глифы. Если активная функция ничего не меняет, это не обязательно ошибка программы — возможно, в шрифте нет соответствующего набора.

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

Практический пример для технического текста: формулу H2O сначала наберите обычными символами, затем выделите цифру 2 и примените subs. Для выражения x2 выделите показатель и примените sups. После этого проверьте соседние знаки: индекс не должен быть настолько маленьким, чтобы теряться при печати, и не должен визуально конкурировать с основным символом.

В CSS для семантически подходящих случаев можно использовать свойство font-variant-position со значениями super или sub. Для прямого вызова OpenType-функций применяют font-feature-settings со значениями sups или subs. Синтаксис сам по себе не гарантирует красивый результат: браузер, операционная система и шрифт должны поддерживать нужную функцию, а конкретный набор символов должен присутствовать в гарнитуре.

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

Для интерфейса проверьте несколько состояний: обычный размер текста, увеличенный масштаб, темную тему, мобильную ширину и переносы строк. Индекс, который хорошо выглядит в заголовке, может нарушить высоту кнопки или обрезаться в компактной строке. При использовании переменного шрифта также тестируйте разные значения начертания: толщина индексных глифов должна оставаться визуально согласованной с основным текстом.

Даже настоящие OpenType-глифы не отменяют визуальную проверку. Разные гарнитуры по-разному строят цифры, высоту строчных знаков и выносные элементы. В одной шрифтовой системе индекс может выглядеть компактно и аккуратно, в другой — оказаться слишком легким или слишком близко к соседней букве. Сравнивайте не отдельную цифру, а целую строку или формулу.

Особое внимание уделите межстрочному интервалу. Нижний индекс с длинным нижним элементом может визуально приближаться к следующей строке, а высокий верхний индекс — к строке сверху. Если формула занимает отдельную строку, допустимы более свободные интервалы; в плотном абзаце лучше выбирать гарнитуру с хорошо сбалансированной метрикой.

Кернинг и трекинг также влияют на восприятие. Автоматическая пара индекса и основного знака может быть рассчитана шрифтом, но в сложной формуле потребуются дополнительные настройки. Не исправляйте проблему увеличением общего трекинга: сначала выясните, не вызвана ли она неподходящим глифом, неправильной функцией или смешением разных шрифтов.

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

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

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

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

Для химической формулы цифру 2 следует обозначить как нижний индекс с помощью семантического элемента sub, а визуальный вид настроить стилями или поддерживаемой функцией subs. После этого проверьте масштабирование и межстрочный интервал. Если формула важна для смысла, не заменяйте ее картинкой или декоративным позиционированием.

Не всегда. Тег ordn предназначен для порядковых сокращений, но его поведение и доступные глифы зависят от шрифта и языкового сценария. В русской верстке сначала установите правило для записи «1-й», «2-я» или другой формы, затем проверьте, соответствует ли ему функция шрифта и редакционная норма проекта.

Наиболее вероятная причина — в шрифте нет нужного набора альтернативных глифов или приложение не поддерживает конкретную функцию. Иногда функция применяется только к определенным символам. Попробуйте другой шрифт из той же типографической системы и проверьте наличие изменений на нескольких цифрах и буквах.

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

Верхние и нижние индексы в верстке требуют не механического уменьшения символов, а точного выбора функции OpenType и проверки результата в контексте. Теги sups, subs, ordn и frac помогают сохранить типографическую логику, но качество зависит от шрифта, редактора, браузера и финального формата.

Если вы разрабатываете собственную гарнитуру и хотите контролировать ее индексы, альтернативные глифы и OpenType-функции, создайте шрифт на fontgenerator.ru. Продуманная типографика начинается с корректно спроектированных знаков.