Кирилл Богатов
29 июня 2016
Советы почтой каждую неделю
Пожалуйста, получите наше письмо, чтобы подтвердить свой адрес:
Вы подписаны на «Советы за неделю»:

Делаю визитку для хозяина автомастерской. Чувствую, что элементы «съели» всё пространство. Не знаю, что с этим делать. Подскажите что-нибудь.

Вторая часть: перерисовка.


В прошлом совете я рассказал о недостатках вёрстки визитки. В этом нарисую новую.

Чтобы не скатиться в распихивание элементов, сначала добавлю в макет только главное — полезное действие, имя и контакты. Согласно правилу якорных объектов расположу элементы по углам:


Ещё вариант — картинка вместо слов:

Иллюстрация сделана из двух иконок Герда Арнца. Так можно делать в образовательных целях, но нельзя в коммерческом проекте

На левой визитке элементы заняли углы и стороны прямоугольника, на правой — активировали прямоугольник, встав в центр.

Введём компанию. Добавляя новые элементы, я слежу за соотношением полей и расстояний между элементами. Согласно правилу внутреннего и внешнего расстояния между элементами должны быть меньше внешних полей. Чтобы вёрстка была выразительной, вертикальные и горизонтальные поля должны различаться:


Напоследок — обезличенная корпоративная визитка:


В жизни:


P. S. Это был совет по средам о вёрстке и типографике в вебе. Хотите знать всё об интерлиньяжах, полях, отступах, кеглях, выравниваниях и модульных сетках? Присылайте вопросы.

P. P. S. Дата следующего набора в Школу стажёров пока неизвестна.

 
Мы напишем вам, когда будет открыт набор. Без спама.

Поделиться

Комментарии

Глеб Михальченков
29 июня 2016

Я думаю, что где-то по пути потерялся смысл. Мне кажется, что на исходном варианте неспроста были упомянуты диагностика и ремонт двигателей и электрооборудования. Есть мастерские с узкой специализацией: глушители, КПП, двигатели и так далее.

Если я никогда не обращался в эту мастерскую, а визитку сохранил на случай «авось пригодится» — через несколько месяцев я и не вспомню, чем конкретно мастерская может быть мне полезна.

Валентин Денников
29 июня 2016

Я не угадал шрифт и напорол с типографикой, но починить можно так.

ФФФ, йоу

Максим Розов
29 июня 2016

Глеб, совет ведь об общих принципах верстки. Никто же не мешает написать под названием сервиса «Ремонт и диагностика двигателя и электрики».

На такие вопросы невозможно полноценно ответить без полного видения задачи.

Михаил Рыкун
30 июня 2016

А ещё важное требование было — оставить 2 номера телефона.

Айдар Шакиров
1 июля 2016

Как я понял, важно, чтобы верхнее и нижнее поле были разными. Необязательно, чтобы нижнее поле было больше верхнего.

Михаил, а что будет, если сделать такие отступы в визитке?

Александр Калашников
6 июля 2016

Айдар Шакиров, нет ощущения, будто что-то не так? Кажется, нижнее поле — это про поправку на гравитацию.


Цель рубрики — обсуждение вопросов дизайна всех видов, текста в дизайне и взаимоотношений дизайнеров с клиентами.

Мы публикуем комментарии, которые добавляют к уже сказанному новые мысли и хорошие примеры. Мы ожидаем, что такие комментарии составят около 20% от общего числа.

Решение о публикации принимается один раз; мы не имеем возможности комментировать или пересматривать свое решение, хотя оно может быть ошибочно. Уже опубликованные комментарии могут быть удалены через некоторое время, если без них обсуждение не становится менее ценным или интересным.

Вот такой веб 2.0.

3 3 2




Недавно всплыло

Расскажите об обратной связи в интерфейсе 1 Что такое модальность и почему её принято ругать? Вторая часть 4 Собеседница психует и кидает трубку. Причём до этого дама была вполне адекватной, и мы нормально работали 1 Это я неправ, что долго думал, или магазин, что допустил такую ситуацию? 3