15.12.2018     0
 

8 элементов дизайна, которые делают ваш блог старым и убогим


8 элементов плохого древнего дизайна

Не хотите, чтобы ваш блог выглядел древним как говно мамонта? Тогда всеми силами избегайте использовать эти штуки в дизайне своего блога. Осторожно, картинки из этого поста могут привести к рефлексу типа «рука-лицо».

Заранее прошу прощения у всех блогеров, изображения с блогов которых я взял для демонстрации тех или иных эффектов. У меня нет цели кого-либо обидеть, я просто хочу сделать нашу блогосферу чуть лучше. Все скриншоты приведены в образовательных целях.

«Серые человечки»

Уверен, что вы их не раз видели.

Это привет родом из нулевых, когда нормальной практикой было тырить из поисковика первую попавшуюся картинку. Под «серыми человечками» я подразумеваю картинки из клипартов с характерными одноцветнами фигурками, обычно серого цвета. Такие человечки изначально предназначались для оформления презентаций, но чем-то приглянулись блогерам, которые стали их повсеместно использовать в качестве заглавных картинок постов о бизнесе и саморазвитии.

Скриншот из блога, посвящённого презентациям

Скриншот из блога, посвящённого презентациям. Тоже достало…

Картинки с серыми человечками легко находятся в поисковиках и на сайтах с бесплатными изображениями. Их действительно удобно использовать и можно присобачить чуть ли не к любой теме статьи.

Но, если в 2010 году это было всё ещё модно, то в 2018 году выглядит как безвкусица.

Проблема с человечками в том, что они всех давно задолбали как в блогах, так и в презентациях, и не отвечают тому, что ожидают видеть пользователи. Они слишком абстрактны, за них не цепляется глаз, вокруг них нет никакой истории. В наше время, когда сайты борются за то, чтобы удержать внимание пользователя хотя бы на несколько секунд, абстрактные картинки со свистом проигрывают фотографиям или дизайнерской графике.

Если вы не хотите выглядеть как блогер-старпёр из нулевых, не используйте серых человечков.

Вырвиглазные шаблоны инфопродуктов

Последние годы в интернете бал правит «плоский» дизайн (flat design). Главные его принципы – простота, граничащая с минимализмом, и утончённость форм, а эффект объёма достигается с помощью расположения элементов, теней и анимации.

Эра плоского дизайна началась с того момента, как Microsoft представила своей публике Windows 8 в плиточном metro-стиле. Тренд подхватили Apple и Google, после чего flat design ушёл в народ, а использование «объёмного дизайна» в сайтах и приложениях с 2015 года практически прекращено. Подробнее об этом можно почитать в Википедии.

Тем не менее, в инфобизнесе до сих пор активно используются объёмные картинки инфопродуктов — книги, коробки, стопки дисков. Такие объёмные картинки довольно просто сделать с помощью специальных скриптов – экшенов – в Фотошопе.

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


3D-инфопродукт

3D-инфопродукт номер 2

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

Что делать? Заказывать нормальный дизайн (это всё-таки обложка вашего коммерческого продукта, а не запись в блоге) или уходить от объёма на плоскость.

Использование резких цветов и выделения текста

Когда я делал на коленке свою первую домашнюю страничку в 2001 году, меня восхищало разнообразие цветов, фонов и их комбинаций, которые я мог использовать.

Язык HTML, на котором пишутся сайты, делает использование цветов крайне удобным. В нём было аж 17 стандартных цветов, которые понимали все браузеры, и каждый из которых можно было использовать по названию. Хочешь сделать шрифт красным – напиши

color="red"

хочешь синим – напиши

color="blue"

Так все и делали. Вот, например, прекрасный образец реального сайта, наглухо застрявшего в ТОМ времени:

Олдовый сайтик

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

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

Скрин

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

Шрифт Comic Sans

Питер Пэн

В продолжение темы шрифтов. Есть такой шрифт – Comic Sans, который, как нетрудно догадаться из названия, изначально был придуман для написания текстов в «облачках» героев комиксов, означающих речь. До сих пор он иногда используется в комиксах, но редко.

К его несчастью, шрифт был включён в базовый набор шрифтов Microsoft Windows 95 и ещё в девяностых прописался на офисных компах, а в начале нулевых перекочевал в блоги. Блогеры, которым понравился симпатичный округлый шрифт, начали массово использовать его для логотипов, для оформления заголовков, а некоторые особо упоротые товарищи – и для написания основного текста в записях.

У Comic Sans есть ровно две проблемы: он совершенно нечитаемый, когда его чуть больше, чем несколько слов, и его ненавидит всё дизайн-(и веб-дизайн)-сообщество. Как кто-то заметил: «Применять Comic Sans это всё равно что одевать трусы поверх штанов – не смертельно, но считается признаком дурного тона».

comic-sans

Лурк всё знает

Если вам по приколу использовать шрифт, не предназначавшийся для набора текстов, и вы хотите казаться олдовым блогером, то попробуйте.

Низкое разрешение

Когда блогер заливает на сайт картинку в низком разрешении или сильно сжимает её для уменьшения веса и увеличения скорости загрузки, может получиться что-то примерно такое:

Пережатые картинки

Водяные знаки, которые портят всё

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

Водяной знак

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

Про то, как надо, а как не надо делать ватермарки, хорошо написал Лебедев в своём «Ководстве». Рекомендую!

Самодельный дизайн

Я просто оставлю здесь эту картинку (заголовок к реальному посту). Как сказал бы тот же Артемий Лебедев, здесь прекрасно всё:

Комбо!

Комбо!

Дизайн надписей в Microsoft Word

Ну и на закуску — ещё один привет из девяностых. Кого-то до сих пор приводят в восторг объёмные надписи из Ворда (это называется «объекты WordArt»), и они с радостью используют их в оформлении статей. Пару раз я видел это порно в логотипах сайта, жаль, сейчас не могу найти. Наверное, что-то всё-таки в этом мире изменилось.

Лучший в мире блог

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


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


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

Об авторе: Михаил Соловьёв

Делаю красивые, современные сайты на WordPress и пишу для них тексты, интересные как читателям, так и поисковым системам. Занимаюсь блогами почти 10 лет, и считаю, что каждый человек в сети должен иметь свой личный или профессиональный сайт.

Оставить комментарий

avatar
  Подписаться  
Уведомление о