Text weight: font-weight — CSS | MDN

Свойство CSS font-weight указывает, насколько жирным должны быть символы. font-weight может быть присвоено значение, кратное 100, от 100 до 900 (900 — самый жирный). Так, например, это правило (добавленное в документ HTML в теге STYLE или во внешней таблице стилей) гласит, что элементы

  h3 {font-weight: 900; }  

, что означает, что элемент

Weighty Matters

Вы также можете использовать слова «нормальный» (то же, что и 400), «жирный» (то же, что и 700), «Смелее» (относительное утверждение, означающее, что текст жирнее, чем окружающий элемент) или «светлее» (делает текст светлее, чем окружающий элемент).Поскольку немногие шрифты имеют девять оттенков жирности, в большинстве шрифтов от 100 до 500 одинаковы, от 600 до 800 одинаковы, а 900 — самый жирный. Одним из ответвлений этого является то, что, хотя «нормальным» является 400, во многих случаях 100 на самом деле не легче. Если вы не используете гарнитуру со многими доступными значениями толщины шрифта, нет практического способа представить текст с массой ниже нормальной. Чтобы узнать больше об этой теме, см. Наше руководство по шрифтам и веб-типографике.

font-weight · WebPlatform Docs

Сводка

Свойство font-weight определяет насыщенность или жирность шрифта (степень их черноты или толщину штриха). Обратите внимание, что некоторые шрифты доступны не во всех размерах; некоторые доступны только с обычным и жирным шрифтом.

Обзорная таблица

Начальное значение

нормальный

Применимо к

Все элементы

Унаследовано

Да

Медиа

визуальный

Расчетное значение

Ключевое слово или числовое значение, как указано, с более жирным и светлым шрифтом, преобразованное в действительное значение.

Анимационный

Да

Свойство объектной модели CSS

шрифт Вес

в процентах

НЕТ

Синтаксис

• начертание шрифта: 100, 200, 300, 400, 500, 600, 700, 800, 900
• font-weight: жирный
• font-weight: жирный
• font-weight: более светлый
• font-weight: normal

Значения

нормальный

Нормальная толщина шрифта.То же, что и 400 .

полужирный

Полужирный шрифт. То же, что и 700 .

зажигалка

На один вес шрифта легче, чем у родительского элемента (среди доступных толщин шрифта).

смелее

На одну толщину шрифта темнее, чем у родительского элемента (среди доступных толщин шрифта).

100, 200, 300, 400, 500, 600, 700, 800, 900

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

Примеры

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

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

  p {font-size: 150%; }

p.example-one {font-weight: bold; }
p.example-two {font-weight: 600; }
p.example-three {font-weight: светлее; }
  

Посмотреть живой пример

Использование

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

600-900 используйте ближайший доступный более темный вес (или, если его нет, ближайший доступный более легкий вес).
100-500 используйте ближайший доступный более легкий вес (или, если его нет, ближайший доступный более темный вес).
Это означает, что для шрифтов, которые содержат только обычный и полужирный шрифт, 100-500 являются нормальными, а 600-900 — полужирным.

Хотя эта практика, также называемая «Faux bold», не очень нравится типографам, полужирные шрифты часто синтезируются пользовательскими агентами для лиц, у которых нет настоящих полужирных начертаний.

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

• 100 — тонкий
• 200 — Extra Light (Ультра легкий)
• 300 — Легкая
• 400 — Нормальный
• 500 — средний
• 600 — полужирный (полужирный)
• 700 — Жирный
• 800 — Extra Bold (Ультра жирный)
• 900 — Черный (тяжелый)

Связанные спецификации

Модуль шрифтов CSS, уровень 3

W3C Рабочий проект

Переходы CSS

W3C Рабочий проект

См. Также

Внешние ресурсы

Атрибуты

Толщина шрифта (Бигелоу и Холмс)

Толщина шрифта

1.Пример: начертание шрифта Lucida Basic.

Lucida Основные названия толщины шрифта сочетают в себе традиционные названия толщины с номерами толщины шрифта CSS.

Комбинация имени + числа определяет веса в каждом стиле Lucida, а также координирует веса и имена между различными семействами Lucida.

Такие названия, как «Ультратонкий», «Тонкий», «Нормальный» и «Черный», указывают на визуальное впечатление от каждого веса. Соответствующие номера CSS 100, 200, 400 и 800 соответственно указывают на то, что каждый вес в списке в два раза темнее предыдущего.

В этом методе именования также можно определить другие прогрессии. Например, в сериях Normal (400), Bold (600) и ExtraBlack (900) каждый последующий вес в 1,5 раза темнее предыдущего.

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

В этой таблице показаны серии названий весов и числовых обозначений.

В этой системе именования, когда установлено несколько весов в одном «наборе» стилей, они обычно сортируются по относительному весу, поэтому пользователи могут видеть упорядоченную гамму весов и легче выбирать желаемый вес.

Другие примеры серии шрифтов Lucida можно увидеть по адресу:

Матрица Lucida

Люсида Санс Люкс

Lucida Sans Texts

Серый тон текста. Отношение толщины вертикальных стержней в таких буквах, как «l», к высоте x шрифта — это способ, которым дизайнеры шрифта измеряют относительный вес. В Lucida Lite (Light) высота по оси x в 7,3 раза больше толщины вертикального стержня.У Lucida нормального веса высота x в 5,5 раза больше толщины вертикального стержня. Высота x, выделенная жирным шрифтом Lucida, в 3,7 раза больше толщины вертикального стержня. По мере увеличения веса отношение выноса к высоте уменьшается. Этот метод является хорошим практическим правилом, но более жирные веса визуально не так полужирны, как указывает число.

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

CSS # вес

Стандартные шаги веса CSS кратны 100, включая 200, 300, 400, 500 и т. Д. До 900.Однако для некоторых случаев использования, особенно в основном тексте, требуются более мелкие приращения для точной настройки тона и удобочитаемости. Поэтому несколько шагов веса Lucida предлагаются с более мелкими приращениями: 150, 250, 350, 375, 425, 450, 550, 650, 999 (последнее действительно 1000, но некоторые системы и приложения не распознают четырехзначные числа веса CSS.

Почему шрифты Lucida предлагают больше градаций веса?

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

Крайности. Ultrathin (100) на светлом конце и UltraBlack (999) на темном конце — это нынешние крайности весовой гаммы Lucida. Максимальный вес в десять раз превышает минимальный, предлагая впечатляющий диапазон выразительности, от модно тонкого до очень яркого.

Основной текст.Шрифты Lucida предлагают тонкую градацию веса для основного текста, также называемого бегущим текстом или основным текстом в нормальном диапазоне чтения. Центральные веса — это книги (350), текст (375), нормальные (400), толстые (425) и сверхтолстые (450). Эти тонкие градации позволяют дизайнерам точно настраивать тон текста в различных технических и выразительных контекстах, для разной полярности (черный на белом по сравнению с белым на черном), цветов и фона, а также для разных разрешений и технологий экранных дисплеев, а также различные технологии печати и качество бумаги.Визуальное воздействие шрифта может существенно различаться в разных контекстах. Например, текст с обратной полярностью, выпавший из черного или цветного фона, более эффективен, если его вес немного темнее, чем вес черного на весе. Тонкая градация гирь Lucida допускает тонкую настройку.

CSS # по сравнению с% пикселей. Приращение веса, измеренное отношением стержня к высоте x, выраженное в весовых числах Lucida CSS, не совсем то же самое, что приращение, выраженное количеством пикселей.В нумерации веса CSS для Lucida Sans вес Lite (легкий) 300 составляет 75% от нормального веса 400, а жирный шрифт 600 на 150% темнее обычного веса, в то время как черный вес 800 составляет 200%. (вдвое) вес Нормального 400. Все очень точно.

Однако тональные значения, измеренные в процентах пикселей, показывают меньшую прогрессию веса. Вес Lucida Lite (легкий) составляет примерно 75% от нормального веса, но жирный шрифт только на 132% темнее обычного, а черный только на 158% темнее, чем обычный вес, а не на 200%.

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

Восприятие веса. Как однажды сказал Адриан Фрутигер, окончательное восприятие шрифтового дизайна — это изображение в сознании читателя.То же самое и с шрифтом. Числа необходимы в практической типографике, но в конечном итоге цель типографского дизайнера — создать образ в сознании читателя, а это все еще остается сложной и загадочной задачей. Вот почему нужны опытные типографы-альтруисты, чтобы оценивать визуальные впечатления от типографских композиций. Чтобы представить себе опыт читателя и оценить удобочитаемость текста, дизайнеры не всегда правы, и расчет веса не всегда точен, но дизайнеры и инженеры должны делать все возможное для читателей.Как писал известный швейцарский преподаватель типографики Эмиль Рудер почти 50 лет назад: «У типографики есть одна простая обязанность — передавать информацию в письменном виде». И он написал это предупреждение: «У типографа есть постоянное искушение использовать свой шрифт в первую очередь как оттенок серого и, таким образом, отвести ему чисто эстетическую и декоративную роль. Использование серой поверхности или серого тона в качестве основы для дизайна, в который типографика должна вписываться как можно лучше, — признак незрелости ».

2. Краткая история типовых весов

Различия в плотности шрифтов признаются и именуются печатниками и типографами на протяжении более пяти столетий. В английской типографской терминологии самое раннее различие в весе было между готическими стилями, называемыми «черными буквами» (или «черными буквами», «черными буквами»), используемыми в ранней английской печати Уильямом Кэкстоном, по сравнению с римским стилем, разработанным в Италии. в частности, Николасом Дженсоном в Венеции 147–1480 гг., который ранние английские печатники называли «белой буквой» (или «белой буквой»).Некоторые шрифты с черным шрифтом были немного светлее или темнее других, а некоторые шрифты с черным шрифтом немного светлее или темнее других, но в целом черные буквы были темнее, чем белые буквы — больше чернил на странице. Однако выбор типографов между готическим или римским шрифтом, черным или белоснежным шрифтом был мотивирован не весом, а стилем.

По культурным причинам, главным образом из-за интеллектуальной и художественной гегемонии типографской моды итальянского Возрождения, на протяжении двух столетий готический стиль в нескольких странах сменил роман: в Италии к концу 15 века; во Франции с начала до середины 16 века; и в Англии к концу 16 века, и в Нидерландах, Бельгии и Голландии, примерно в то же время, что и в Англии, или вскоре после этого (за исключением пива :-).

Сегодня большинство читателей в Америке и Европе привыкли к латинскому шрифту. Большинство читателей латинского алфавита сказали бы, что он более разборчив, чем готический, но готика оставалась популярной в немецкоязычных странах и регионах до 20 века. Готические шрифты выжили и во многих случаях процветали в нескольких контекстах, особенно в пивных этикетках и вывесках во фламандских, голландских и немецкоязычных странах, а также в Мексике. Во время рождественских праздников типографика в англоязычных странах становится готической и черной, тогда как древнеанглийская текстура и другие стили английского черного письма, такие как бургундский батард, используемый Caxton, возвращаются ежегодно.Начиная с Дня благодарения и до Нового года в Америке блэклеттер становится удивительно разборчивым для читателей, читающих римским шрифтом. Дай бог вам счастья, господа.

В XIX веке, когда в Англии набирала обороты промышленная революция, появились новые способы использования типографики в маркетинге и рекламе промышленных товаров. Создатели шрифтов ответили тем, что создали больше лиц для «дисплейной» типографики, включая рекламу, плакаты, рекламные листовки, этикетки и эфемеры. Среди новых рекламных стилей были римские лица более тяжелого веса, превосходящие старые готические черные буквы в темноте, но все еще римские по структуре.В авангарде были так называемые «толстые лица», которые имели ярко выраженный контраст толстого и тонкого, как рисунки Бодони или Дидо на стероидах. Затем последовали тяжеловесы с плоскими засечками, «Антиквариат» и «Египтяне», почти монотонные по толщине мазка. Также были тяжелые шрифты без засечек, структурно больше похожие на шрифты с засечками без засечек, чем на шрифты римской книги с обрезанными шрифтами. У египтян был стиль с засечками под названием «Ионический», который заключал в скобки засечки и немного больше контрастировал между толстым и тонким шрифтом, чем египтяне.Вслед за Ionic первые шрифты «Clarendon» были выпущены в 1845 году. Он был тяжелым, как и многие шрифты с плоскими засечками, но его шрифты с засечками имели брекетинг, как и Ionic. Грифы Clarendon стали использоваться с шрифтами обычного шрифта для заголовков, выделения и других отличий от начертаний римского текста. В начале 20-го века основатели шрифтов начали интегрировать полужирный шрифт в семейства ромбов и курсивов с нормальным шрифтом. Семьи Челтнем и Сенчури, написанные Моррисом Фуллером Бентоном для американских основателей шрифтов, являются яркими примерами.

К середине 20-го века большинство семейств новых шрифтов включали по крайней мере один полужирный римский шрифт, а к концу 20-го века большинство семейств новых шрифтов, а также возрождение старых классических шрифтов, таких как Garamond или Baskerville, включали два или более жирных шрифта. веса с такими названиями, как «полужирный» и «полужирный» или «полужирный и экстра-полужирный» с курсивом соответствующего веса. В 21 веке новые семейства шрифтов часто имеют четыре или более градаций веса.

Название шрифта

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

Немецкая типографская номенклатура двадцатого века включала несколько названных градаций веса, включая «mager» (тонкий), «leicht» (легкий), «buch» (книжный [вес]), «normal» (нормальный), «stark» (сильный). , «Kräftig» (жирный), «viertelfett» (полужирный шрифт), «halbfett» (полужирный шрифт), «dreiviertelfett» (полужирный шрифт в три четверти), «fett» (полужирный) и «extrafett» (дополнительный смелый).Не все из них использовались в данной семье. Как и в случае с английскими названиями весов, не существовало стандарта использования немецких названий весов между семьями. Это были и остаются импрессионистские гири без числовой калибровки.

Жир. Немецкие термины веса были заимствованы из обычных товаров, особенно пищевых и, в частности, молочных продуктов. «Dreiviertelfett» на немецком языке используется для обозначения маргарина, сыра и других продуктов, содержащих жир или вес, а также шрифтов с визуальной насыщенностью (например.грамм. Венера, Фолио, Футура. Фиртельфетт использовал сыр, маргарин и шрифты (например, Helvetica). Halbfett также о сыре, маргарине, шрифтах (например, Helvetica, Neuzeit, Optima, Palatino и т. Д.). Экстрафетт мог описывать кремы, а также шрифты (например, Syntax, Folio, Helvetica и т. Д.).

В традиционной французской типографской номенклатуре весовые выражения аналогичны. «Graisse», означающее «упитанность» в целом, эквивалентно английскому «weight» в типовых терминах, а весовая гамма включает несколько терминов, основанных на прилагательном «gras» для жира: «maigre» (тонкий), «нормальный» ( normal), «demi-gras» (полужирный), «gras» (полужирный), «extra-gras» (полужирный).Похоже, что в последние годы произошли некоторые сдвиги, поэтому, возможно, наши французские коллеги сообщат нам последнюю информацию.

Может показаться странным приравнивать количество черного в шрифте к количеству жира в сыре, но как только мы примем во внимание антропоморфную терминологию традиционных печатников, говоря о типе «лицо» или «тело», то получится метафора между «весом» по типу и весом по человеку кажется естественным.

Но вес шрифта не обязательно зависит от жира. В итальянском языке, из которого мы получаем прекрасные термины искусства, такие как «светотень», типографские названия веса обозначают степени светлого и темного, например, «chiaro» (светлый), «neretto» (жирный), «nero» (черный), «nerissimo». ”(Ультрачерный).

Универсальные десятичные веса. В своем семействе шрифтов Univers, выпущенном в 1957 году и предназначенном для универсального использования во многих странах, Адриан Фрутигер отказался от традиционных весовых названий, которые варьируются от языка к языку, и разработал двузначную десятичную систему именования для единообразия между языками и культурами. , и нации. В Univers легкий римский шрифт обозначается «45», нормальный «55», жирный «65», черный «75» и дополнительный черный «85». Почти два десятилетия спустя семейство Frutiger было запущено с той же системой обозначений, добавив «95» как ультра-черный.Linotype запустила семейство Neue Helvetica, используя ту же систему, в которой «25» обозначает сверхлегкие, «35» тонкие, а «95» — черные. В Univers Next, запущенном в 1997 году, весовая гамма и система десятичной нумерации были расширены дополнительной цифрой: «130» стало сверхлегким, «230» — тонким, «330» — легким, «430» — основным, «530» — средним, «630». Жирный, 730 жирный, 830 черный и 930 дополнительный черный. Для типографов, привыкших к прежним двухзначным именам, трехзначная система требует некоторого дополнительного обучения.Neue Frutiger, выпущенный в 1999 году, и Frutiger Next в 2000 году не продолжали использовать десятичную номенклатуру.

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

«Нормальный» вес, тем не менее, попадает в довольно узкий диапазон. Для латинских шрифтов их «черный» охват находится в диапазоне от 15% до примерно 22%, что измеряется по черной области (чернилами или пикселями) букв внутри белой области вокруг и внутри букв при их номинальном размере основного текста без интерлиньяжа. или дополнительный межстрочный интервал.

Для старых шрифтов с засечками, таких как Garamond и Caslon, процент черного составляет около 16%, плюс-минус несколько процентов. Для шрифтов без засечек 20-го века, таких как Helvetica или Lucida, и для недавних шрифтов, предназначенных для отображения на экране, которые, как правило, имеют большую высоту по оси x и более толстые тонкие штрихи, нормальные веса имеют тенденцию быть темнее, около 20% -22% черного , плюс-минус несколько процентов. Книжные лицевые стороны в старом стиле были разработаны для высокой печати, которая наносит больше чернил на бумагу и делает изображение более толстым, хотя печатные тексты с высокой печатью немного темнее, чем показывают современные контуры шрифтов.Некоторые современные шрифты без засечек, которые стали популярными в офсетной литографической печати, темнее классических книжных шрифтов, потому что их немного больший вес не ослабляется более тонкими красящими пленками и небольшим ослаблением литографической визуализации.

В зависимости от технологии обработки изображений и алгоритмов сглаживания шрифты на экране могут быть немного затемнены или светлее. Например, на цифровых дисплеях высокого разрешения с яркой задней подсветкой может потребоваться немного затемнить шрифт, чтобы он больше походил на напечатанный рендеринг.Когда Apple перешла на дисплеи Retina, которые на ноутбуках имеют разрешение 220 пикселей на дюйм вместо старых разрешений ЭЛТ около 72 пикселей на дюйм, Бигелоу и Холмс создали для дисплеев Retina немного более темный цвет Lucida Grande Bold. Новый жирный шрифт был всего на 4% темнее старого, но этого было достаточно, чтобы восстановить видимую степень «жирности».

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

Связанные с открытиями в психофизике сенсорных величин, таких как физический вес, яркость или громкость, различия в «жирности» шрифта, кажется, следуют прогрессии, основанной на множительном множителе. Для многих шрифтов минимальный коэффициент разницы между нормальным и жирным шрифтом составляет около 1.От 3 до 1,5, в зависимости от метода измерения. Измеряемый отношением толщины стержня к высоте x, минимальный шаг для заметно жирного веса примерно в 1,5 раза превышает нормальный стержень / высоту x. То есть, если нормальный вес стержня равен 1,0, то жирным шрифтом будет около 1,5 единиц. Следующий важный шаг в весе, скажем, между жирным и черным, примерно в 1,5 раза больше жирного, или между 2,0-кратным весом «нормального» до примерно 2,25-кратной нормальной толщины стержня.

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

С учетом соотношения выноса к высоте, Lucida Grande Bold в 1,5 раза больше обычного Lucida Grande. Palatino Bold — это 1,54 x Palatino normal. Arial Bold в 1,6 раза больше обычного Arial. Размер шрифта Times Roman Bold в 1,7 раза больше обычного шрифта Times Roman. Baskerville Bold — это 1,8 x нормальный Baskerville (в зависимости от версии Baskerville). Verdana Bold — это 1.9 x Verdana regular. Шрифты Microsoft ClearType, разработанные для усовершенствованной технологии отображения на экране, обычно имеют жирный шрифт в 1,5–1,7 раза превышающий соответствующий нормальный вес.

Если мы переключимся с измерений, основанных на соотношениях ножки / x-высоты, на покрытие от черного к белому, основанное на процентном соотношении черного / белого пикселей, измерение будет немного сложнее (каламбур не предполагается), но даст результаты в десятичных процентах.

Тональные значения, измеренные в процентах пикселей, показывают меньший коэффициент увеличения. Например, вес Lucida Lite (Light) на 25% легче, чем вес Normal, как по соотношению стержень / высота, так и по проценту черных пикселей, но при переходе от нормального к более черному весу полужирный вес только на 28% темнее. чем нормальный вес, а не 50%, и черный вес только на 37% темнее, чем нормальный вес, а не на 100%.На точные проценты влияют структура дизайна, высота по оси x, детали терминалов и засечок, подгонка букв и другие факторы, определяемые дизайнерами шрифтов.

Определенно смелее, чем заметно смелее. Как обсуждалось выше, гиря, которые «определенно более жирные», чем нормальный вес, примерно в 1,5–1,3 раза больше нормального, в зависимости от типа измерения. А как насчет «едва заметной разницы» или JND, используемой психофизиками? Насколько малая разница в толщине шрифта едва заметна для пользователей или читателей? В небольшом исследовании мы обнаружили, что едва заметная разница в весе для строчного шрифта без засечек составила примерно 3%.Некоторые испытуемые не заметили такой маленькой разницы, но многие из них заметили. Это довольно хорошо согласуется с нашим производственным опытом. Когда наша студия разработала минимально более темный «жирный» вес Lucida Grande для дисплеев Macintosh «Retina», увеличение темноты составило примерно 4%. Небольшого увеличения веса было достаточно, чтобы дизайнеры интерфейсов могли заметить и предпочесть разницу, но не настолько, чтобы обычные пользователи заметили что-нибудь неправильное.

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

Итак: что мы знаем?

Знаем ли мы, какой вес является идеальным «нормальным»? №

Знаем ли мы, какой вес является идеальным жирным шрифтом? №

Знаем ли мы, сколько весов можно использовать для всех желаемых оттенков авторского значения, позволяя читателям понять все различия? Нет.

Знаем ли мы, какая идеология дизайна должна быть нашим единственным ориентиром? Вряд ли, как сказал бы Джон Уэйн.

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

Бигелоу и Холмс

Примечание. Мы благодарны Рольфу Рехе за его полезные и забавные комментарии по поводу прилагательных «fett» в повседневном и типографском немецком языке.

© 2015

font-weight | CSS-уловки

Свойство font-weight устанавливает толщину или толщину шрифта и зависит либо от доступных начертаний шрифта в семействе шрифтов, либо от веса, определенного браузером.

  пролет {
    font-weight: жирный;
}  

Свойство font-weight принимает либо значение ключевого слова, либо предварительно определенное числовое значение. Доступные ключевые слова:

• нормальный
• полужирный
• полужирный
• зажигалка

Доступные числовые значения:

• 100
• 200
• 300
• 400
• 500
• 600
• 700
• 800
• 900

Значение ключевого слова normal сопоставляется с числовым значением 400 , а значение жирным шрифтом сопоставляется с 700 .

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

Если шрифт имеет жирную («700») или обычную («400») версию как часть семейства шрифтов, браузер будет использовать это. Если они недоступны, браузер будет имитировать собственную полужирную или обычную версию шрифта. Он не будет имитировать другие недоступные веса. Шрифты часто используют такие имена, как «Обычный» и «Легкий» для обозначения любых альтернативных весов шрифта.

Следующая демонстрация демонстрирует использование альтернативных значений веса:

  Оцените эту ручку! 

В приведенной выше демонстрации используется бесплатный шрифт Open Sans, встроенный с помощью Google Web Fonts API. Шрифт загружается со всеми доступными весами шрифтов, и поэтому, используя свойство font-weight , различные доступные веса отображаются, как описано в тексте каждого абзаца. Недоступные веса просто отображают логически ближайший вес.

Распространенные шрифты, такие как Arial, Helvetica, Georgia и т. Д.не имеют веса, отличного от 400 и 700 . Таким образом, та же демонстрация, отображаемая с одним из этих шрифтов, будет отображать только два веса в девяти абзацах.

Использование ключевых слов «жирнее» и «светлее»

Значения ключевых слов полужирный и светлее относятся к вычисленному весу шрифта родительского элемента. Браузер будет искать ближайший «более жирный» или «более легкий» вес, в зависимости от того, что доступно в семействе шрифтов, в противном случае он просто выберет «400» или «700», в зависимости от того, что имеет наибольший смысл.

Дочерние элементы не наследуют значения ключевых слов «смелее» и «легче», а вместо этого унаследуют вычисленный вес.

Сопутствующие объекты

Прочие ресурсы

Поддержка браузера

Помощники по типографике | Bulma: бесплатная современная CSS-фреймворк с открытым исходным кодом на основе Flexbox

 text_db = ['проблема зла', 
 'злая королева', 
 'проблема горизонта'] 

 import math 
 tf_1_evil = 1/3 
 D_all = 3 
 D_evil = 2 
 tf_idf_evil = tf_1_evil * math.log (D_all / D_evil (t_evil) 
 ) 

 0,135 

 импортировать панд как pd 
 из sklearn.feature_extraction.text import TfidfVectorizer 
 vec = TfidfVectorizer () 
 text_db = ['проблема зла', 
 'злая королева', 
 'проблема горизонта'] 
 tf_idf = vec.fit_transform (text_db) 
 print (pd.Data_frame) .toarray (), columns = vec.get_feature_names ())) 

 злой горизонт проблемной королевы 
 0  0,517856  0,000000 0,680919 0,517856 0,000000 
 1 0,605349 0,000000 0,000000 0,000000 0,795961 
 2 0.000000 0,795961 0,000000 0,605349 0,000000 

 import math 
 tf_1_problem = 1/3 
 tf_1_of = 1/3 
 tf_1_evil = 1/3 
 D_all = 3 
 d_problem = 2 
 d_of = 1 
 d_evil = 2 
 tf_idf_problem = tf_1_problem * (math.log ((D_all + 1) / (d_problem + 1)) + 1) 
 tf_idf_of = tf_1_of * (math.log ((D_all + 1) / (d_of + 1)) + 1) 
 tf_idf_evil = tf_1_evil * (math. log ((D_all + 1) / (d_evil + 1)) + 1) знаменатель 
 = math.sqrt (tf_idf_problem ** 2 
 + tf_idf_of ** 2 + tf_idf_evil ** 2) 
 результат = tf_idf_evil / знаменатель 
 print (" evil result: ", result) 

 плохой результат: 0,517856