Использование логотипов в веб-дизайне
Логотип является лицом «бренда». Логотипы используются в СМИ, а также в любых рекламных объявлениях, которые способствуют продвижению бренда, ну и конечно они используются на веб-сайтах.
Использование логотипа на веб-сайтах, не должно быть банальным, как мы видим, в некоторых из ниже приведенных примеров.
Расположение
Стандарт размещения логотипа на веб-сайте – левый верхний угол страницы. Причина этого в том, что все пользователи уже привыкли видеть его там. Но бывают и сайты исключившие это правило, несколько примеров будет приведено ниже. Однако трудно найти сайт, который совсем не включает логотип в заголовке.
После редизайна «CNN» мы видим как логотип сдвинулся к центру страницы. Это смотрится хорошо, логотип выделяется на фоне всей страницы, соответствует бренду и легко запоминается. Это вполне приемлемо, пока сам логотип остаётся в заголовке.
Размещение логотипа в правом верхнем углу заголовка – большая редкость в веб-дизайне, но на самом деле может смотреться довольно хорошо. Ниже показан пример с сайта duoh! Логотип расположен на белом фоне, выделяется и хорошо виден посетителям.
Дополнительные местоположения
Также как и расположение логотипа в заголовке, мы привыкли видеть и остальные части на своих местах (сайдбары, футеры и т.д.). Хорошая идея поменять их местами или совместить, перемещая логотип в другие места.
Psdtuts понимают важность расположение логотипа в «шапке», так что они даже включили свой логотип в «подвал».
Gowalla располагают свой логотип и на месте сайдбара, и на месте футера.
Размер
Размер логотипа не всегда так важен, как кажется. Могут быть использованы и другие способы привлечения внимания. В двух примерах снизу показано правильное использование большого и маленького логотипов.
Bullet PR используют большой логотип в качестве старта своего сайта. Линия, выходящая из логотипа, проводит нас по всему сайту от пункта к пункту.
Palm включает в себя сравнительно небольшой логотип. Логотип всегда используется на всем сайте.
Трюки
В Интернете вы всегда можете показать ваши творческие способности. В двух приведённых ниже примерах вы увидите логотипы, которые всегда остаются на виду.
Прокручивая страницу вниз, логотип вместе с ползунком перемещается вниз, меняя свой цвет на цвет, подходящий к фону. Это хороший эффект, который сохраняет видимость логотипа на всё время пользования сайтом.
Блог Тим Ван Дамм используют аналогичную технологию, как на примере выше. При прокрутки страницы вниз, основной логотип исчезает из поля зрения, а другой появляется на боковой панели при прокрутки вниз.
При наведение курсора мыши на логотип, отображается подсказка, в которой указано, что кликнув по нему, вы вернётесь на главную страницу. Такой переход — очень полезная функция, но не все о ней знают, поэтому Web Designer Depot и сделали небольшую подсказку.
Amazon используют почти такие же методы. Если вы переходите в определённый раздел сайта, а затем хотите вернуться на главную страницу вам просто надо навести мышь на логотип, при этом логотип становится похожим на кнопку, на которой появляется стрелочка с надписью “homepage”, а затем нажать на неё. И вот вы снова на главной странице.
Аналогичный метод использует «Elliot Jay» на своей сайте, но вместо использование CSS спрайтов, он просто использует SPAN тег, которые содержит слово «Home».
Ваши личные идеи.
Надеюсь эта статья послужит для вас уроком. Вы должны понять, что использование чего-то нового и полезного всегда оценивается. Если у вас есть какие-нибудь идеи, выкладывайте их в комментарии — будем обсуждать. =)
via
Метки: веб-дизайн, логотип, Юзабилити
Опубликовал: Дизайнер от 14 Ноя 2009
Комментарии (2)
