Hacker News Digest

Автор создал новый шрифт Avería, усреднив все шрифты на своём компьютере. Идея родилась из интереса к типографике и креативному программированию. Сначала он накладывал буквы разных шрифтов с низкой прозрачностью, а затем использовал ImageMagick и PHP для математического усреднения изображений. Выравнивание по базовой линии и началу координат дало более чёткие результаты, чем простое наложение. Автор обнаружил, что строчная буква 'g' имеет две распространённые формы, а большинство шрифтов демонстрируют высокую корреляцию.

Когда простой метод дал размытые результаты, автор начал искать способы сохранить чёткие края. Он экспериментировал с пороговыми значениями для создания монохромных изображений, но столкнулся со сложностью математического усреднения форм. После изучения крив Безье и метрик шрифтов, он выбрал простой подход: разбиение контура каждой буквы на 500 равноотстоящих точек и усреднение соответствующих позиций. За месяц работы над проектом он создал Avería — название, связанное со словом "average" (среднее), но на испанском означающее "поломка".

• Обсуждение началось с демонстрацией шрифта Averia как примера "усреднённого" шрифта, что вызвало обсуждение его визуального качества и ассоциаций с "uncanny valley".
• Участники обсудили, что Averia выглядит мутновато и непривычно, что вызвало дискуссию о том, какие именно параметры делают шрифт читаемым и приятным.
• Были подняты вопросы о том, как средний шрифт может влиять на читаемость и какие именно параметры делают его таким.
• Также обсуждались вопросы авторского права и атрибуции, так как Averia был создан как "усреднение" всех шрифтов в системе.
• Участники также затронули тему того, что именно делает шрифт визуально привлекательным и читаемым, и какие параметры важны для этого.

Минимальный CSS для приятного сайта включает базовые стили, улучшающие типографику и читаемость. Начните с ограничения ширины медиа-контента: img, svg, video { max-width: 100%; display: block; } предотвращает переполнение. Для типографики используйте system-ui как безопасный шрифт, увеличьте размер до 1.25rem и установите line-height в 1.5 для лучшей читаемости.

Добавьте поддержку тёмной темы через html { color-scheme: light dark; }, но учтите, что пользователям может потребоваться ручное переключение. Ограничьте ширину основного контента с помощью main { max-width: min(70ch, 100% - 4rem); margin-inline: auto; } для оптимальной длины строки в 45–90 символов. Этот подход избегает избыточного кода и обеспечивает адаптивность.

• Обсуждаются минималистичные подходы к CSS, включая сброс стилей, базовые настройки для типографики и ограничения ширины контента для улучшения читаемости.
• Поднимается вопрос о реализации темной темы, важности ручного переключения пользователем и проблемах с "миганием" при загрузке.
• Критикуются стандартные системные шрифты и обсуждаются потенциальные проблемы с их отображением в разных ОС и локалях.
• Упоминаются различные инструменты и философии (например, SSG, Tailwind, Every-Layout) для создания простых и эффективных сайтов.
• Высказывается мнение, что пользователь должен иметь максимальный контроль над стилизацией контента, а не сайт.

Основной урок: «A» не обязательно должна быть «A». Кроссбар, который не попадает в центр, делает букву высокопоясной и визуально неуравновешенной. Правило: если выглядит неправильно — значит, так оно и есть. Подчеркнуть: контраст штрихов в местах стыков должен быть заметен.

• Обсуждение началось с цитаты о том, что «недостаточное внимание к промежуткам между буквами приводит к тому, что мы теряем B-образность», и быстро перешло к обсуждению веб-дизайна, шрифтов и их взаимодействия с Hacker News.
• Участники обменялись ссылками на ресурсы вроде ohnotype.co, futurefonts.com и letterspractice.com, а также обсудили, что читабельность и доступность контента важнее, чем кричащие цвета и неуместный скроллинг.
• В итоге, обсуждение свелось к тому, что даже в сообществе, где обсуждают веб-дизайн и типографику, важно соблюдать баланс между формой и содержанием, и что важно не только знать, где рисовать линию, но и понимать, как влияет на читаемость то, что мы оставляем пустым.

Берлинский Музей букв, уникальное учреждение, посвящённое типографике и городской культуре, закрывается после 20 лет работы. Последний шанс посетить его — до 5 октября 2025 года, по четвергам и выходным с 13:00 до 17:00, или в индивидуальные экскурсии. Коллекция, включающая вывески известных универмагов вроде Kaufhof и Karstadt, ищет новое хранилище, для чего организован сбор средств через платформу betterplace.

Среди ключевых экспонатов — выставка «Final Sale», рассказывающая историю исчезающих корпоративных шрифтов и архитектуры немецких торговых центров с 1980-х годов. Музей также известен сотрудничеством с Государственной библиотекой Берлина и мастер-классами по неоновому искусству. Закрытие символизирует конец эпохи сохранения визуального наследия городской среды.

• Закрытие Buchstabenmuseum в Берлине вызвано высокими постоянными затратами и отсутствием финансовой поддержки на фоне общей сложной культурной ситуации в городе.
• Участники обсуждения выражают сожаление по поводу закрытия музея и делятся альтернативными рекомендациями для посещения в Берлине, такими как C-base, Музей компьютерных игр, Технический музей и экскурсии Berliner Unterwelten.
• Обсуждается влияние Эрика Шпикерманна на типографику в регионе DACH и статус Берлина как центра современной типографики и «музея под открытым небом».
• В качестве похожих музеев в других городах упоминаются Музей неона в Варшаве и Музей вещей (Museum Der Dinge) в Берлине.
• Затрагивается тема финансирования культуры, где высказывается мнение, что инвестиции в AI-стартапы не являются прямой причиной недостатка поддержки для музеев.

Современные стековые наборы шрифтов используют системные шрифты, доступные в операционных системах, что обеспечивает мгновенную загрузку без скачивания файлов, отсутствие смещений макета и мерцания. Они организованы по классификации типографики, включая System UI, Transitional, Old Style, Humanist и другие, каждый с оптимизированным списком шрифтов для резервного отображения.

Например, стек System UI использует system-ui, sans-serif, а Monospace Code — ui-monospace, 'Cascadia Code', Menlo, что подходит для кода. Это решение повышает производительность веб-страниц и универсальность, так как шрифты уже установлены у пользователей.

• Использование кастомных шрифтов может привести к неожиданному рендерингу из-за настроек браузера и системных ограничений, особенно при блокировке веб-шрифтов.
• Широкие стеки шрифтов могут негативно влиять на производительность, если первый шрифт в списке не содержит нужных глифов, что особенно актуально для нелатинских шрифтов и эмодзи.
• Веб-шрифты считаются предпочтительным решением для обеспечения консистентности брендинга, а инструменты вроде screenspan.net помогают подобрать системные fallback-шрифты с похожей метрикой.
• Для внутренних дашбордов и инструментов рекомендуется использовать системные стеки (например, system-ui) для лучшей интеграции с ОС, в то время как для публичных сайтов важнее контроль над брендингом.
• На Android многие стеки шрифтов выглядят идентично из-за ограниченного набора системных шрифтов, что требует создания гибридных решений или компромиссов.

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

В архиве представлено 362 сайта с фильтрацией по тегам — от 3D-анимации и типографики до звукового дизайна и глитчей. Примеры вроде rude-captcha.xyz или slingshot.trudy.computer демонстрируют, как можно творчески использовать возможности телефона. Цель проекта — стимулировать сообщество к обсуждению и эксперименту в mobile-first дизайне.

• Пользователи обсуждают нестандартный веб-дизайн представленных сайтов, отмечая как их креативность и ностальгическую ценность, так и проблемы с юзабилити и доступностью.
• Критике подвергаются отдельные элементы, такие как изменение поведения ссылок при наведении и невозможность добраться до нижней части страницы из-за бесконечной подгрузки контента.
• Участники делятся воспоминаниями о легендарных сайтах прошлого (Kaliber 10000) и обмениваются ссылками на аналогичные ресурсы и агрегаторы необычных сайтов.
• Высказываются опасения, что подобный дизайн часто непрактичен для представления реального контента и создания призывов к действию, а также создает барьеры для доступности.
• Часть сообщества ценит представленные работы за их художественную ценность и вдохновляющий потенциал, призывая не зацикливаться на мелких недостатках.

Шрифт Brutalita Sans — это геометрический гротеск с открытым исходным кодом, созданный для смелых заголовков и акцентных текстов. Его дизайн сочетает резкие углы и чёткие формы, что придаёт ему агрессивный, но читаемый характер. Шрифт поддерживает кириллицу и латиницу, что делает его универсальным для международных проектов.

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

• Автор проекта объяснил техническую реализацию редактора: используется прозрачное текстовое поле с SVG-отрисовкой поверх.
• Пользователи высоко оценили саму идею и техническую реализацию проекта, но раскритиковали UX редактора за отсутствие возможности перемещать точки, отменять действия и редактировать существующие символы.
• Обсуждались проблемы с поддержкой акцентированных символов (например, «à», «ñ») и CJK-символов, а также низкое разрешение сетки для их отрисовки.
• Проект вызвал ностальгические ассоциации у пользователей: его сравнивали с пиксельными шрифтами времен ZX Spectrum, Amiga, Teletext, а также с Metafont и шрифтами для ЧПУ.
• Были высказаны пожелания по улучшению редактора, такие как добавление перетаскивания точек, удаления сегментов и возможности создавать несколько независимых контуров (слоев) для одного символа.

Two Slice
2-пиксельный шрифт, всё ещё читается.
Заглавные и строчные буквы различаются, цифры и знаки препинания есть.
Мельче — читабельнее.

Скачать (CC BY-SA, коммерция разрешена с указанием авторства).

• Участники обсуждают сверхмелкий 2-пиксельный шрифт: кто-то восхищён, кто-то считает нечитаемым.
• Нужен контекст и тренировка; на случайных строках шрифт «сдаёт».
• Подчёркивают важность пробелов и антиалиасинга, иначе буквы сливаются.
• Вспомнили 8-битные спектрумы, C64, TI-калькуляторы: узкие шрифты были вынужденным хаком.
• Шутят про EULA, шрифт-Морзе и китайские иероглифы в 2 px.

Tufte CSS — стиль для веб-статей, вдохновлённый книгами Эдварда Тафти: простота, боковые заметки, встроенная графика и продуманная типографика. Проект Дэйва Липмана, опирается на Tufte-LaTeX и R Markdown. Предложения приветствуются на GitHub.

Цель — не копировать книги в вебе, а адаптировать приёмы Тафти под экраны.

Быстрый старт

Скопируй tufte.css и папку et-book со шрифтами, добавь в <head>:

<link rel="stylesheet" href="tufte.css"/>

Основы

• Разметка: <article> → <section> → заголовки h1, h2, h3.
• Новая мысль: <span class="newthought"> + неотступный абзац.
• Цвета: фон #fffff8, текст #111111, мягкий контраст.
• Шрифт: ETBook → Palatino → Georgia; жирный и курсив — отдельные файлы.
• Ссылки: цвет текста, подчёркнуты, без hover-эффектов.

• Участники спорят о визуальном устаревании Tufte CSS: кому-то шрифт и отступы кажутся «атrocious», другие всё ещё находят стиль уместным для длинных текстов.
• Критикуют выбор почти-белого фона (#fffff8) и почти-чёрного текста (#111111): считают аргументы о «мягком контрасте» надуманными, особенно на OLED.
• Поднимают тему повторных постов: Tufte CSS регулярно появляется на HN каждые ~18 месяцев, и с каждым разом нравится меньше.
• Отмечают проблемы типографики: узкий сериф, плохой кернинг, «ужасная» open-source копия Bembo.
• Некоторые делятся опытом адаптации стиля под мобильные устройства и предлагают альтернативы вроде tint или Scribe.

Nokia Sans — шрифт, которым пользовались почти все телефоны Nokia с 2002 по 2013, — оказался отличным выбором для интерфейса. Автор статьи, ностальгируя, скачал варианты Nokia Sans и установил их в KDE. Оказалось, что Nokia Sans Wide читается прекрасно на высоких DPI и придаёт интерфейсу характер без излишеств, вытеснив у автора привычный Inter.

Создатель шрифта Эрик Шпикерманн ещё в 2011-м спорил с Nokia, утверждая, что Wide-вариант вполне подходит для UI, но компания предпочла «безликий» Nokia Pure. Автор признаёт: всё субъективно, на Windows/macOS или низких DPI результат может отличаться, а правовой статус скачанных файлов неясен.

• Nokia Sans (и её Wide-вариант) вызывает ностальгию, но как UI-шрифт годится только на HiDPI-дисплеях и имеет лишь один начертание.
• В США Nokia была главным телефоном 1995-2005, несмотря на позднее отступление из-за конфликта с операторами.
• Шрифт напоминает Fira Sans и Meta — все они вышли из-под пера Эрика Шпикермана.
• На сайте мелкие скриншоты и блокировка зума мешают оценить детали; лицензия для коммерческого использования неясна.

Areal — новый шрифт для Are.na, полностью переработанный Dinamo на базе Arial. Он сохранил узнаваемость «дефолтного» шрифта, но стал технически современнее и вывереннее под задачи платформы.

Идея родилась в 2024 г. на ужине в Нью-Йорке: команды Are.na и Dinamo почувствовали родство подходов и решили «обновить, не меняя» — аналогично тому, как ранее переписали фронтенд, оставив дизайн прежним. Arial выбрали в 2014 г. как самый «невидимый» шрифт, не отвлекающий от контента; он ассоциировался с простотой и непритязательностью эпохи раннего веба.

Dinamo рассматривали Arial как «франкенштейна» — клон Helvetica, ставший системным и «невыбором», что само по себе выбор. Перерисовка позволила сохранить привычный образ Are.na, но сделать его точнее и гибче.

• Are.na и студия Dinamo представили «Areal» — перерисованный Arial, который почти неотличим от оригинала.
• Основные изменения: унифицированные толщины штрихов, табличная моноширинная версия, оптимизация для тёмной темы, расширенный набор символов.
• Большинство комментаторов считают проект overkill и «кринжом»: «переделали Arial ради самого процесса».
• Некоторые защищают идею: для дизайнерского сообщества Are.na такие детали важны, а лицензии коммерческих шрифтов зачастую неподъёмны.
• Вопросы лицензии и скачивания остаются без ответа; шрифт пока используется только внутри платформы.

Thanks for sharing! I always love looking at the hand-painted advertisements when I'm back in India. I almost never see it in the cities these days (billboards have taken over), but back in my parents' villages, a lot of older painted advertisements (like Maha Cement) are still t