/impeccable typeset
Typeset
Поправете типография, която се усеща генерична, неконсистентна или случайна.
Кога да се използва
Обърнете се към /impeccable typeset, когато текстът на страницата изглежда като типография по подразбиране вместо като проектирана типография. Мътна йерархия, три размера, които изглеждат еднакво, основен текст на 14px, дисплейен шрифт, който всъщност е само Inter bold, заглавия без внимание към кърнинг.
Чести тригери: “йерархията се усеща плоска”, “четимостта не е наред”, “шрифтовете изглеждат генерични”.
Как работи
Умението оценява типографията в пет измерения:
- Избор на шрифтове: използвате ли невидими подразбиращи се (Inter, Roboto, Arial, Open Sans), съответства ли шрифтовото семейство на бранда, има ли повече от 2 до 3 семейства.
- Йерархия: заглавия, основен текст и надписи ли са ясно различими с един поглед, контрастът в размерите поне 1.25x между стъпките, контрастите в тежест четими ли са.
- Размери и скала: има ли кохерентна типографска скала, отговаря ли основният текст на минимум 16px, скалата фиксирани-rem за приложен UI или плаващи-clamp за маркетингови страници.
- Четимост: дължина на реда 45 до 75 символа, line-height настроен за шрифта и контекста, контраст.
- Консистентност: един и същ елемент използва едно и също третиране навсякъде, без еднократни отмяни на font-size.
След това поправя това, което открие: избира отличителни шрифтове, изгражда модулна скала, разширява контраста на йерархията, задава правилна дължина на реда и водещ интервал.
Пробвайте
/impeccable typeset the article layout
Очакван diff:
- Дисплейният шрифт е заменен от Inter 700 с реален дисплейен шрифт
- Типографската скала е重建ена: 3rem / 2rem / 1.25rem / 1rem / 0.875rem, съотношение 1.333
- Основният текст е увеличен от 14px на 16px
- Дължината на реда е ограничена до 68ch върху колоната на статията
- Line-height 1.6 за основен текст, 1.1 за дисплей
- Премахнати четири еднократни стойности
font-size, разпръснати в стиловете на компонентите
Клопки
- Заявка за нов шрифт без контекст. Typeset ще избере въз основа на гласа на бранда от
PRODUCT.md. Ако не сте изпълнили/impeccable teach, предложението ще бъде генерично. - Обръщане към typeset, когато проблемът е оформление. Ако параграфите са наред, но страницата се усеща тесна, искате
/impeccable layout. - Очакване на плаващи clamp скали за приложен UI. Typeset използва фиксирани rem скали за приложни интерфейси. Плаващата типография е за маркетингови и съдържателни страници, където дължината на реда варира драстично.