Полезное

Как использовать логотип в веб-дизайне

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

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

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

Нужны доказательства? Просто просмотрите такие сайты как YouTube, Vimeo, Amazon, Instagram, eBay, Adidas, BBC, Wikipedia, Reddit, Dribbble, Netflix, Ford, BP, Levis, Shell, O2, Sony, NASA и даже этот сайт ниже.

Веб-сайт McDonald's следует этому правило, поэтому он расположил свой логотип в верхнем левом углу страницы

В этих конкретных примерах логотипы являются словесными. Однако то же самое правило действует и для знаковых логотипов, доказательством чему служат сайты Airbnb, Spotify, Nike, Facebook, Pinterest и Apple.

Но прежде чем поступить так же, подумайте хорошенько, должны ли вы следовать за толпой и размещать свой логотип в том же месте, что и все остальные?

Логотип в центре для газетного вида

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

Принцип данного подхода заключается в том, чтобы повторить хорошо знакомый вид печатной версии газеты и ее названия. Примеры сайтов, которые следуют этому принципу, включают такие знаменитые издания как Washington Post, The New York Times, Los Angeles Times, The Boston Globe, The Times, Financial Times, The Spectator, New Statesman, British Vogue, Radio Times и Wired.

Интернет-журналы, такие как Wired, повторяют опыт печатных изданий, центрируя свой логотип на своей веб-странице

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

Примеры этой стратегии можно увидеть на сайтах для отеля Virginfield Smithfield Station, организации художника Ричарда Дибенкорна и дома моды Sunspel.

Однако давайте будем предельно ясными: печатные издатели никоим образом не объединены тем, что абсолютно все они размещают логотип по центру. Большинство британских газет, например, придерживаются веб-стандартов, размещая свой логотип в верхнем левом углу, включая The Sun, The Mirror, Daily Telegraph, Mail Online и Daily Express. Это означает, что печатные издательства двигаются вперед и полностью погружены в разработку своих цифровых предложений.

Выделение расположения логотипа

Если отойти от традиционных печатных издательств, то примеров других веб-сайтов, где логотипы расположены по центру или размещены вверху справа, немногочисленны. 

Samsung является одним из редких веб-сайтов, где логотип расположен в центре

Есть, конечно же, и другие сайты, которые центрируют свои логотипы, включая Samsung, в то время как сайты типа Amnesty International и Guardian предпочли расположить лого справа. Но в основном это единичные случаи.

Другим весьма заметным исключением из этого правила являются поисковые страницы, в том числе Google, Bing, Yahoo, Duck Duck Go, Wolfram Alpha и Baidu, где логотип появляется справа от панели поиска или же сверху нее, хотя это может быть рассмотрено как элемент особой категории веб-сайтов.

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

Итак, что стоит за этим подавляющим правилом относительно того, где разместить логотип?

Почему логотипы обычно расположены слева вверху?

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

Размещение логотипа в левом верхнем углу имеет долгую историю

Смещение влево также связано с тем, как в Европе и на Западе (в отличие от азиатских и арабских культур) печатный контент традиционно читается: слева направо и сверху вниз. Эти глубоко укоренившиеся привычки, естественно, перешли к чтению на цифровых устройствах, как показали исследования Nielsen Norman Group.

Зачем следовать тренду размещения логотипа?

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

И вы можете подумать, что все в порядке: в конце концов, вы же не собираетесь запутать пользователей, перемещая окно поиска, кнопку меню или основную навигационную панель с их стандартных мест расположения, что никоим образом не относится к логотипам, потому что они не имеют функциональной цели, не так ли? Неправильно!

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

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

Возможно, если логотип расположен в центре страницы, но кнопка «Главная» находится в верхнем левом углу, как это сделало агентство JAMstudio, пользователи не будут чувствовать себя настолько запутавшимися.

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

Логотипы в нескольких местах

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

Сеть Envato Tuts + усиливает свой брендинг, разместив  логотип в футере, а также в верхнем левом углу

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

Если говорить об удивительных использованиях логотипа на странице, то, пожалуй, это то, что сейчас делает Google на многих своих сайтах-сателлитах, таких как Gmail или Google Drive. Несмотря на то, что логотип Google в значительной степени ассоциируется со своей страницей поиска, нажатие на него внутри этих служб фактически возвращает вас на главную страницу для «родственной» службы, а не на google.com.

Где бы вы ни находились в экосистеме Apple, логотип Apple возвращает вас к apple.com

Напротив, на всех веб-страницах в сети Apple, включая iTunes, нажатие на логотип Apple всегда возвращает вас обратно к локальной версии apple.com.

Источник: How to use logos in web design

 

  • 5705