Замінила 27 фактичних розмірів шрифту, сусідні значення яких різнилися лише на 0,6%, шестиступеневою шкалою Major Third і написала лінтер, який відхиляє двадцять восьмий.
Роботу виконано: серпень 2026
27 розмірів шрифту замінено шестиступеневою шкалою
Ситуація. Вимірювання відображеного тексту сайту виявило двадцять сім різних розмірів шрифту, що використовувалися. Деякі відрізнялися менш ніж на відсоток: п’ять значень між 0,8 і 0,85 від розміру основного тексту діяли одночасно, а такої різниці жоден читач не помітить, зате кожен наступний редактор додасть до неї ще одне значення. Двом заголовкам таблиця стилів узагалі не задавала розміру, і вони отримували стандартні значення самого браузера — співвідношення 1,33, яке не збігалося ні з чим іншим на сторінці.
Завдання. Розміри мали скластися в шкалу із задекларованим співвідношенням, і щось мало не допустити появи двадцять восьмого.
Дія. Шкала — велика терція зі співвідношенням 1,25: шість іменованих щаблів від дрібного шрифту до заголовкового, і кожен із них — токен, а не значення. Заголовки явно прив’язано до щаблів, а не залишено на розсуд браузера, і саме це виправило ті два, що не мали власного розміру. Мінімум задано лише для найнижчого щабля, тож дрібний шрифт лишається розбірливим на телефоні, а вся шкала не фіксується. Логотипи виключено явно, за назвою, а не випадково. Тримає все це лінтер: він відображає сайт у браузері й зупиняє перевірку на двадцять восьмому окремому розмірі. Він уже двічі довів свою користь: спіймав заголовок розміром 1,17 від основного тексту, що не є щаблем жодної шкали, і назвав це співвідношення в повідомленні про помилку, а ще спіймав вбудований код розміром 0,9 — саме таке значення, проти якого шкала й існує. Разом зі шкалою з’явилася довжина рядка приблизно в сімдесят два символи замість успадкованої фіксованої ширини, яка давала дев’яносто один символ на сторінці відгуку й сто десять на сторінці контактів.
Результат. Шість розмірів замість двадцяти семи, із задекларованим співвідношенням, задекларованою довжиною рядка й перевіркою, яка відхиляє наступне незаплановане значення. Обмеження реальне й часом незручне: якщо дизайну потрібен розмір між двома щаблями, доводиться або перейти на щабель, або обґрунтовувати зміну шкали, і таку суперечку вже не раз вели й програвали.
Читати далі: Обмежила систему кольорів 28 задокументованими кольорами й написала лінтер, який відхиляє значення, що застосоване, але не задокументоване, задокументоване, але не застосоване, хибно виміряне, переписане як літерал або розташоване в межах перцептивної відстані 0,02 від уже наявного. Або перегляньте повне портфоліо.
Одна частина довшого переліку — і він увесь на цьому сайті.
Кожен запис написано однаково: ситуація, завдання, що ми зробили і що змінилося.