—»     —»   20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2
  Раздел: Web-дизайн   Комментариев: 1  

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2



Продолжаем публикацию перевода статьи Cameron Chapman "20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок" и предлагаем вашему вниманию вторую часть.

11. Орнаментальность шрифта

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Ограничившись декоративным заголовком обычного в остальном сайта, вы сделаете его заметнее.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Сочетание шрифта, имитирующего письмо от руки, с типографским шрифтом с засечками придаёт изысканность любому веб-сайту.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

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

12. Акцентирование фона

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Резкий фон, выдержанный в строгой цветовой гамме, не перетягивает на себя внимание с содержимого страницы.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Фон из фотографий, иллюстрирующих работу вашей фирмы, может сделать обычный сайт намного выразительнее.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Фон из геометрических фигур может быть очень выразительным, особенно, в сочетании с элементами гранжа.

13. Винтаж и ретро-элементы

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

Как ни странно, ретро-элементы, включённые в ваш эскиз, могут обновить и освежить вид сайта. Пока винтажные эскизы только обживают веб-пространство, и ещё не слишком привычны. Решите ли вы вернуться в семидесятые, сороковые годы или даже дальше углубиться в историю, результат может быть очень интересным.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Коллаж из винтажных компонентов смотрится очень выразительно.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Винтажный фон в сочетании со старомодным стилизованным шрифтом и особой цветовой схемой создаёт ощущение '60-х.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

На странице этого сайта винтажное изображение радиоприёмника и стилизация под газетную статью вместе воссоздают атмосферу '40-х годов.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Сочетание изображений старинных канделябров со стилизованным орнаментом рамок создаёт на сайте Rose Fu ощущение викторианской эпохи.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Сочетание винтажных и старинных элементов создаёт на этом сайте цирковую или даже водевильную атмосферу.

14. Бросающиеся в глаза заголовки

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

"Шапка" в виде изображения, созданного сочетанием различных элементов (светотени, фотографий, ярких красок), производит сильное впечатление.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

"Шапка" всех цветов радуги с несколькими простыми рисунками от руки в придачу приковывает внимание к эмблеме и заголовку сайта Дрю Уилсон (Drew Wilson).

15. Элементы коллажа

Элементы коллажа - один из наиболее универсальных компонентов эскиза. Их аккуратная обрезка и единичное использование придают сайту лоск и законченность. А неровными их края оставляют, если хотят, чтобы сайт выглядел артистически небрежно, этой же цели служит их большое скопление на странице. "Золотая середина" между этими двумя крайностями может стать настоящим украшением вашего веб-сайта.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Элементы коллажа в цифровой обработке очень хорошо смотрятся на официальных сайтах.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Клочки бумаги - переходный элемент от техники коллажа к гранжу.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Сочетание набросков от руки, обрывков и других атрибутов "бумажной" темы создаёт очень интересный и оригинальный коллаж.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Сочетание псевдо-бумажных элементов с цифровыми компонентами коллажа делает эту "шапку" очень интересной.

16. Фон, имитирующий сплошные поверхности

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Спокойный фон плавно переходящих друг в друга тонов создаёт ощущение матерчатой тканой структуры.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Ровная грязная поверхность фона служит гранжевым элементом в структуре сайта Джейсона Джулиена (Jason Julien).

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

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

17. Навигация посредством вкладок

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

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Вкладки, отображающие логическую последовательность, очень удобны для пользователей.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Вкладки могут быть не только горизонтальными.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Простые, чётко очерченные вкладки хорошо смотрятся на сайте строгого дизайна.

18. Чёрное и белое

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Сочетание насыщенного тёмно-серого цвета с кремовым придаёт этому эскизу слегка "ретро" вид.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Обилие белого придаёт странице лёгкость и обтекаемость, в отличие от почти чёрного эскиза.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Сочетание ровного почти белого тона с тёмным серо-коричневым выглядит очень традиционно и классически.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Чистые белый и чёрный придают странице броскую графичную выразительность.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

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

19. Горизонтальная прокрутка

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Подробная инструкция по навигации в пределах такого сайта делает его гораздо удобнее.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Горизонтальный дизайн особенно хорош для сайтов портфолио.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Сплошной фон вдоль множества страниц сайта горизонтальной развёртки придаёт ему связность.

20. Элементы мульти-анимации

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

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Анимировать вовсе не обязательно именно карикатуры.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Анимированный персонаж очень хорош в качестве талисмана или эмблемы.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Наиболее универсальны однотонные элементы анимации.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Использование рисованных персонажей, вписывающихся в тему вашего сайта (таких, как профессор на сайте университета Спуф (Spoof University), делает страницу приятнее и забавнее.

20 важнейших приёмов и лучшие способы достижения эффективности дизайнерских разработок - Часть 2

Анимированные карикатуры на знаменитостей довольно популярны.

Автор статьи © Cameron Chapman
Русский перевод © CoolWebmasters.Com 2009
Обнаружили ошибку или мёртвую ссылку?
Выделите проблемный фрагмент мышкой и нажмите CTRL+ENTER.
В появившемся окне опишите проблему и отправьте уведомление Администрации ресурса.
Нужна органическая вечная ссылка из данной статьи? Постовой?
Подробности здесь
Вам понравился материал? Поблагодарить легко!
Будем весьма признательны, если поделитесь этой статьей в социальных сетях:

Ключевые тэги: веб-дизайн, дизайн сайтов
Опубликовал Mysterious Master   Прочитано (раз): 9711   |   Оставлено комментариев: 1
Источник материала / оригинал статьи   Распечатать
Другие статьи и новости по теме:
Комментарий #1: 10 февраля 2012 @ 20:49
Написал: arriva — группа: Гости  
На сайте с: --   |   Публикаций: 0   |   Комментариев: 0
ICQ: --- не указано ---
Давно хотел поработать со шрифтами. Ваш материал мне очень помог. Спасибо
Добавление комментария
Уважаемые пользователи!
При добавлении комментариев на сайт Вам следует учитывать следующее - все комментарии проверяются Администрацией на предмет отсутствия спама. При обнаружении признаков спама, в оставленном Вами комментарии, сам комментарий будет незамедлительно удалён, а Ваш IP-адрес будет забанен без предупреждения! Учётные записи пользователей, рассылающих спам, блокируются/удаляются без права последующего восстановления.

С уважением, Администрация сайта.
* = поля обязательны к заполнению
Полужирный Наклонный текст Подчеркнутый текст Зачеркнутый текст | Выравнивание по левому краю По центру Выравнивание по правому краю | Вставка смайликов Выбор цвета | Скрытый текст Вставка цитаты Преобразовать выбранный текст из транслитерации в кириллицу Вставка спойлера
Вопрос : Назовите месяц January по-русски
Подтверждение кода безопасности :

Включите эту картинку для отображения кода безопасности
обновить, если не виден код


Популярные публикации

















Свежие шаблоны сайтов каждый день
С миру по нитке
«    Сентябрь 2019    »
ПнВтСрЧтПтСбВс
 1
2345678
9101112131415
16171819202122
23242526272829
30