Спасибо за приятный отзыв.
Следуя каноничной верстке по сетке 8px, колоночная сетка тоже должна подчинятся принципам кратности 8px. Раньше я использовал сетку 960px: 8px — боковые отступы, 944px — контентная зона, 16px — расстояние между колонками. Я проверил дизайн на разных устройствах: планшетах, компьютерах, телефонах, широкоформатных мониторах. На всех устройствах кроме мобильников таких отступов между организмами мало — глазу сложно переходить от одного островка к другому. Я поставил отступы в 24px и все стало только хуже — теперь отступы огромны.
Я решил между организмами поставить отступы в 20px. Использовал сетку 960px: 10px — боковые отступы, 940px — контентная зона, 20px — межколоночный отступ. По вертикали отступы между карточками тоже установил в 20px. Читать информацию стало удобнее. Особенно владельцам планшетов, например в транспорте — там постоянная тряска. Высокий контраст в интерфейсах помогает отличать элементы друг от друга.
В будущем я решил не нарушать сетку 8px без необходимости. В конце концов 90% проектов прекрасно проектируются по сетке 8px и проблем не возникает. Но если я вижу что сетка ухудшает восприятие интерфейса пользователем, я введу один дополнительный отступ или что-нибудь нарушу, логически обосную нарушение и введу в правило.
Дизайнер должен создавать человечный интерфейс удобный для пользователя. Если все элементы интерфейса безупречно выровнены по сетке, но интерфейс читать сложно — нужно начинать искать решение за пределами гайдлайнов.
