Поделиться через

Типография в Windows 11

  • Статья

Несколько слов, отображаемых в Segoe UI Variable

Основная цель оформления текста как визуального представления языка — передача информации. Система типов Windows 11 помогает создать структуру и иерархию в содержимом, чтобы максимально увеличить разборчивость текста в пользовательском интерфейсе.

Переменная пользовательского интерфейса Segoe — это новый системный шрифт для Windows. Это обновленный подход к классическому Segoe и использует технологию шрифтов переменных для динамического обеспечения большой удобочитаемости при очень небольших размерах и улучшенных контуров при размерах дисплея.

Метрики

Слово Segoe, отображаемое в переменной пользовательского интерфейса Segoe с несколькими аспектами выделенного шрифта

Вес

Имя веса Значение оси веса Визуальный элемент
Светлый 300 Слово Segoe, отображаемое в свете переменной пользовательского интерфейса Segoe
Полусвет 350 Слово Segoe, отображаемое в полусвете переменной пользовательского интерфейса Segoe
Периодически 400 Слово Segoe, отображаемое в переменной пользовательского интерфейса Segoe, регулярно
Полуболд 600 Слово Segoe, отображаемое в переменной пользовательского интерфейса Segoe с запятой
Полужирный шрифт 700 Слово Segoe, отображаемое в полужирной переменной пользовательского интерфейса Segoe

Оптитическая ось

Строчная буква, отображаемая в переменной пользовательского интерфейса Segoe с контурами различных фигур, которые она может иметь в зависимости от контекста, в котором выполняется отрисовка.

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

Использование переменной Segoe Fluent

Тип пандуса

Windows 11 использует следующие значения для различных типов текста в пользовательском интерфейсе.

Пример Вес Высота или размер линии
Пример текста заголовка Небольшой 12/16 epx
Пример текста текста Текст 14/20 epx
Пример строгого текста текста Запятая текст 14/20 epx
Пример большого текста текста Текст 18/24 epx
Пример текста субтитров Отображение с запятой 20/28 epx
Пример текста заголовка Отображение с запятой 28/36 epx
Пример большого текста заголовка Отображение с запятой 40/52 epx
Пример отображения текста Отображение с запятой 68/92 epx

Рекомендации по печати в Windows 11

Windows 11 использует переменную пользовательского интерфейса Segoe со следующими атрибутами в зависимости от контекста, в котором отображается текст.

Атрибут Значение Примечания.
Weight Обычный, Semibold Использование регулярного веса для большинства текста используйте Semibold для заголовков
Выравнивание Слева, Центр Выравнивание по умолчанию в центре выравнивания по умолчанию только в редких случаях, таких как текст ниже значков
Минимальные значения 14px Semibold, 12px Regular Текст меньше этих размеров и весов является неразборчивым на некоторых языках
Оболочка Дело предложения Использование регистра предложений для всего текста пользовательского интерфейса, включая заголовки
Усечение Многоточие и вырезка В большинстве случаев используйте многоточие; Вырезка используется только в редких случаях

Примеры

Совет

Откройте приложение коллекции WinUI 3 и просмотрите принципы оформления в действии.

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