Для начала, привет
Меня зовут Денис, и здесь, в «КитченКодерс», я работаю арт-директором. Мои посты в блоге будут в основном касаться дизайна - как конкретных задач, которые мы решаем по проектам, так и отрасли вообще. По каким-то техническим моментам мне будут помогать Женя и Егор, которые, кстати, тоже пишут много интересного, check it out.
Ну а начать я хочу с довольно известной, но от этого не менее интересной и важной темы, а именно - что делать с контентом при разработке концепции макетов с нуля. Погнали!
Рыба для ленивых
Женя, программист студии
Lingva latina non penis canina ** Латынь - это вам не хер собачий
Женя, конечно, прав, но, пожалуй, не в данном конкретном случае. Lorem ipsum - классический бессмысленный «рыбный» заполнитель, вставляемый в макет страницы. Lorem Ipsum представляет собой искажённый отрывок из философского трактата Цицерона «О пределах добра и зла», написанного в 45 году до нашей эры на латинском языке.
Для чего это нужно
Всё просто - для улучшения визуального восприятия сетки контента. Очень часто, при начале работы, дизайнер сталкивается с ситуацией «нарисуй то, не знаю что» - контента нет, никакой внятной информации от клиент, а макет из чего-то собрать надо. Самый простой способо - везде использовать «текст текст текст текст» - хотя я не видел ни одного заказчика, который бы принял что-то подобное. Одинаковые слова сливаются в кашу, отвлекают на себя внимание от сетки да и просто свидетельствуют о лени дизайнера. А вот Lorem ipsum избавляет от этих проблем - текст издалека не читается, но создает впечатление присутствия контента.
А нужно ли?
Лично я не использую Lorem ipsum, предпочитая от начала до конца продумывать «рыбу». Это отнимает гораздо больше времени, однако на это есть ряд причин:
- Позволяет лучше изучить область работы заказчика. Чтобы заполнить раздел «Статьи» на макете строительной компании, я лезу на сайты других строительных компаний, читаю там новости, узнаю что-то новое о деятельности нашего клиента.
- Повышает шансы на принятие макета/сокращение доработок. Макет с полностью придуманной рыбой выглядит как абсолютно готовый сайт, и очень часто впечатленный клиент готов принять всё с минимальными правками.
- Дает шанс избежать многих переделок макета, если еще на этапе «рыбы» проверить почти все хитрые моменты (о них ниже).
Егор, старший программист студии
А вот я напротив, испрользую Lorem ipsum довольно часто - во время верстки, интеграции модулей управления разделами и т.д. Контент там всё-равно потом поменяется, а тратить время и дёргать дизайнера смысла нет.
Конечно Егор тут прав - «рыба» не всегда нужна, если затраты по времени и деньгам на ее разработку слишком велики, или вообще не имеют смысла - смель пользуйтесь Lorem ipsum.
Хитрые моменты (как и обещал)
За 10 лет работы я нарисовал сони «рыбных» макетов, что позволило мне выделить несколько нехитрых правил, которые если им следовать, очень сильно облегчат жизнь и дизайнеру и его команде:
- Не создаватйе сетку «под линейку». Да, я знаю как круто выглядит 4 новости в строку, под каждой из которых ровные 3 строчки описания. На деле их там будет 4-5 и может даже 10 - зависит от того, кто будет эти новости писать. Если продумать все заранее - избежите выяснений как с заказчиком, так и с верстальщиком.
- Используйте самые длинные данные, какие только можете придумать. Круто, когда в блоке «Менеджер» висит Иванов Иван. А завтра в эту фирму устроится Константинопольский Константин и все, сетке конец. Сделайте список самого длинного - должность, адрес, ФИО, название продукции клиента - это очень поможет.
- Используйте «рыбу» для продвижения своих идей и расширения функционала. Можно предложить заказчику влепить на сайт красивый баннер с его продукцией и он скажет «нет» - потому что не очень представляет. Покажите то же самое на макете и, возможно, появится шанс его уговорить.
Вот, пожалуй, и всё! На все вопросы я всегда рад ответить в комментария ниже! В следующий раз в нашей мини-рубрике «Азы» я попробую рассказать вам про основы форматирования контента - ковычки-«ёлочки», длинные тире, почему нельзя использовать justify (Егор, привет!) - вот это всё!