Browse commands

/impeccable typeset

Typeset

Поправете типография, която се усеща генерична, неконсистентна или случайна.

Кога да се използва

Обърнете се към /impeccable typeset, когато текстът на страницата изглежда като типография по подразбиране вместо като проектирана типография. Мътна йерархия, три размера, които изглеждат еднакво, основен текст на 14px, дисплейен шрифт, който всъщност е само Inter bold, заглавия без внимание към кърнинг.

Чести тригери: “йерархията се усеща плоска”, “четимостта не е наред”, “шрифтовете изглеждат генерични”.

Как работи

Умението оценява типографията в пет измерения:

  1. Избор на шрифтове: използвате ли невидими подразбиращи се (Inter, Roboto, Arial, Open Sans), съответства ли шрифтовото семейство на бранда, има ли повече от 2 до 3 семейства.
  2. Йерархия: заглавия, основен текст и надписи ли са ясно различими с един поглед, контрастът в размерите поне 1.25x между стъпките, контрастите в тежест четими ли са.
  3. Размери и скала: има ли кохерентна типографска скала, отговаря ли основният текст на минимум 16px, скалата фиксирани-rem за приложен UI или плаващи-clamp за маркетингови страници.
  4. Четимост: дължина на реда 45 до 75 символа, line-height настроен за шрифта и контекста, контраст.
  5. Консистентност: един и същ елемент използва едно и също третиране навсякъде, без еднократни отмяни на 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 скали за приложни интерфейси. Плаващата типография е за маркетингови и съдържателни страници, където дължината на реда варира драстично.