Layout

Коли використовувати

/impeccable layout призначений для сторінок, де технічно нічого не wrong, але нічого не дихає. Однакові відступи всюди, одноманітні сітки карток, контент від краю до краю, ієрархія, що покладається лише на розмір. Зверніться до неї, коли макет “здається не тим”, і ви не можете сформулювати чому.

Гарні тригери: “все здається тісним”, “це читається як стіна”, “я не знаю, куди дивитися спочатку”.

Як це працює

Навичка проходить через п’ять вимірів макета:

1. Інтервали: чи шкала інтервалів узгоджена, чи є випадкові прогалини по 13px, чи згруповані пов’язані елементи щільно зі щедрим простором між групами, чи є хоч якийсь ритм.
2. Візуальна ієрархія: чи потрапляє погляд на основну дію протягом 2 секунд, чи ієрархія виконує реальну роботу, чи все кричить.
3. Сітка та структура: чи є базова сітка, чи макет випадковий, чи елементи вирівняні до базових ліній.
4. Ритм: чи чергується сторінка між щільними та щедрими інтервалами, чи все одноманітне.
5. Щільність: чи макет перевантажений чи марнотратний, чи відповідає щільність типу контенту.

Виправлення зазвичай включають перебудову шкали інтервалів, введення асиметрії, згортання одноманітних сіток у змішаний макет з hero та підтримуючими елементами, та надання основній дії реального простору.

Спробуйте

/impeccable layout the settings page

Типові зміни:

• Шкала інтервалів уніфікована до 8 / 16 / 24 / 48 / 96px
• Розриви секцій на 48px, міжрядкові проміжки на 16px, групи полів форми на 8px
• Основні дії винесені з потоку форми з буфером 32px
• Декоративні межі видалені, замінені групуванням через інтервали
• Пропорції бічної панелі та основної колонки збалансовані (280 / flex проти 25 / 75)

Підводні камені

• Плутання arrange з distill. Якщо проблема в тому, що забагато речей, спочатку запустіть /impeccable distill. Layout — для розташування того, що вже є правильною множиною.
• Очікування, що це врятує зламану сітку. Якщо на сторінці немає сітки взагалі, arrange побудує її. Просто знайте, що diff буде більшим, ніж ви очікуєте.
• Ігнорування вердикту ієрархії. Якщо arrange каже “ніщо не є основним”, жодна кількість роботи з інтервалами це не виправить. Вам потрібне контентне рішення, а не коригування макета.