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

Михаил!

При создании макета сайта зарылся в детали и упустил самое главное — он оказался пресным, однообразным. Как вдохнуть в него жизнь?


Иван!

То главное, что вы упустили, — польза.

Во-первых, из страницы очень сложно понять, чем именно занимается компания. Если судить по логотипу и меню, торгует чем-то автомобильным (магазин побеждает безликое «услуги»), по фотографии — что-то делает со старыми машинами, по новостям — рассказывает о праздниках и днях, когда не работает. Перечисленные элементы побеждают маленький заголовок под фотографией Бьюика. А ведь только этот заголовок объясняет, что я на сайте автомастерской.

Во-вторых, на странице не найти информацию, которая нужна, если у тебя сломалась машина (а в другой ситуации никто автосервис искать не будет). Зачем мне читать новости? К чему знать про Бьюик? Меня-то волнует, когда вы работаете, какие машины принимаете и сколько всё будет стоить. Даже адрес и телефон ютятся в незаметной серой строчке наверху страницы. Никто, кроме сео-роботов, не докрутит до конца страницы.

Наконец, на странице нет ответа, почему я должен пойти именно к вам. Чем вы лучше конкурентов? Чем докажете, что не испортите машину окончательно? Какие гарантии даёте? Почему… О, погодите, это же написано в последнем абзаце сеошного текста под заголовком! Но я это не увидел и уже закрыл вкладку.

Хорошая вёрстка помогает направить внимание и подать информацию, однако прежде нужно сформулировать, что вы хотите рассказать и почему читателю это интересно.

Другие ошибки:

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

Серые пункты переключалки не читабельны и не кликабельны

Заголовок страницы должен быть крупнее остальных.

Из-за одинаковой высоты непонятно, в каком порядке читать абзацы.

Имя и подпись директора — хороший способ вызвать доверие. Но сеошный текст и «Контактные данные» убивают эффект.

Бирка и заголовок противоречат друг другу. Первая обещает статьи, второй — график работы

Заголовки отвалились от текста

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

Даты лучше ставить под иллюстрации

Плохая вёрстка плашки. Кажется, что я подпишусь на архив новостей

Конгломерат? :-)

Беда с теорией близости: заголовок стоит ближе к новостям, чем к своему тексту.

Блоки соцсетей — тяжёлые и своенравные элементы. Наивно обозначать их лёгкими прямоугольниками и надеяться, что они встанут как надо

Я разобрал основные ошибки. В следующем совете попробуем нарисовать новую версию страницы.

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

Типографика и вёрстка — дисциплина Школы дизайнеров. Набор открыт. Чем раньше поступите, тем ниже стоимость и выше шанс на бесплатное место.
 

Поделиться
Отправить

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

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

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

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

Как сверстать новостной этаж: фрагмент курса «Типографика и вёрстка»




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

3 Как сделать, чтобы публикация выделялась в ленте: композиция, исправление дефектов, цвет 1 1 1