Как стать автором
Обновить
422.17
Сбер
Технологии, меняющие мир

Как выбрать шрифт для кодинга

Уровень сложностиПростой
Время на прочтение4 мин
Количество просмотров11K

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

Поддержка вашего родного языка

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

Моноширинный или пропорциональный?

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

Источник

Шрифты, с которыми работают программисты, обычно моноширинные. Это значит, что все символы в них имеют одинаковую ширину вне зависимости от начертания. Есть несколько причин, почему используются именно моноширинные шрифты:

  • Читаемость и простота выравнивания. Это особенно важно в языках, где для уровней вложенности используются отступы, типа Python.

  • Чёткое разграничение символов. В моноширинных шрифтах обычно есть четкая разница между похожими символами. Это помогает избежать синтаксических ошибок.

  • Последовательность. Моноширинные шрифты выглядят идентично в разных редакторах и системах, что тоже удобно.

  • Быстрая навигация мышью. Поставить курсор в нужное место проще, если не приходится целиться между зауженными символами.

  • Чёткая видимость пробелов. В моноширинных шрифтах можно легко соотнести, сколько пробелов занимает тот или иной отступ. Кое-где это может быть очень важно.

Есть ли у шрифта разные начертания?

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

Нравится ли шрифт в принципе?

Каждый шрифт сам по себе задаёт некоторое настроение, Helvetica призывает к строгости, а Comic Sans… нет. Кстати, о его интересной истории у нас был отдельный пост. Посмотрите, как выглядит известная английская панграмма в разных шрифтах, почувствуйте разницу:

Источник

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

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

Источник
Источник. Обратите внимание на хвосты у букв g, j и y.
Источник. Обратите внимание на хвосты у букв g, j и y.
Источник. Даже вычурные элементы могут гармонировать между собой, создавая единый образ шрифта. Взгляните на g и k. Или на x и y, если искать схожие элементы в пределах строки.
Источник. Даже вычурные элементы могут гармонировать между собой, создавая единый образ шрифта. Взгляните на g и k. Или на x и y, если искать схожие элементы в пределах строки.

Различия в символах

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

Источник

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

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

Другая подобная пара — это вертикальная черта и восклицательный знак. Первая имеет в программировании важное значение: где-то она задаёт операторы, где-то обозначает последовательность команд. Восклицательный знак тоже может выступать служебным символом, например, в Python. И с этой точки зрения стоит присмотреться к шрифту внимательней, задавшись вопросом…

Путаются ли символы, важные для вашего языка?

Сложно найти шрифт, где каждый символ был бы чётко отличим от похожих. Наибольшего успеха здесь добились, пожалуй, в JetBrains Mono, но не факт, что для вас это будет идеальный выбор. В поисках альтернативы стоит обязательно проанализировать, насколько вам удобны, символы, которые вы будете использовать чаще всего. Далее приведём ряд примеров.

Источник. Так выглядит JetBrains Mono.
Источник. Так выглядит JetBrains Mono.

Обратите внимание на подчёркивания. Выходят ли они за пределы строки? Насколько различим пробел, если поставить подчёркивания рядом? Какова толщина подчеркиваний относительно других шрифтов?

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

Символ «собачки». В моноширинных шрифтах с @ приходится прибегать к хитростям: то хвостик обрежут, то сплющат внутреннюю часть.

Символы хеша и астериски. Нравится ли вам начертание # и *? Не спотыкается ли взгляд об эти символы?

Другие важные нюансы

Есть ещё несколько важных особенностей шрифтов, которые касаются всего набора в целом.

Выравнивание по вертикали. В идеале, знак равенства должен стоять так, чтобы все математические символы были выровнены прямо по нему. Совсем хорошо, когда и перекладины в буквах типа H ведут себя так же.

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

Лигатуры. В некоторых шрифтах соседние символы автоматически объединяются в один. Подчёркивания сливаются друг с другом, < и > сливаются с = , а -> превращается в стрелку. Некоторые говорят, что лигатуры делают код более гармоничным, другие жалуются, что так ухудшается читаемость.


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

Теги:
Хабы:
Всего голосов 24: ↑22 и ↓2+30
Комментарии29

Информация

Сайт
www.sber.ru
Дата регистрации
Дата основания
Численность
свыше 10 000 человек
Местоположение
Россия