Яндекс Санс
Костя Горський
7 червня 2016 · 13 хв читання
Ось англійська версія посту. Оригінальна російська версія знаходиться тут: пост на русском
Деякі з вас, можливо, чули про Яндекс. Для тих, хто цього не зробив, ось короткий вступ. Яндекс - одна з найбільших інтернет-компаній у Європі, яка працює з найпопулярнішою пошуковою системою Росії та своїм найбільш відвідуваним веб-сайтом. Деякі люди можуть навіть називати це "російським Google", що для нас звучить дуже дивно, оскільки Google є нашим прямим конкурентом.
Яндекс як компанія з’явився у 2000 році, через три роки після запуску веб-порталу yandex.ru. На той момент у фонді оплати праці нової компанії було лише 25 імен, і всі оброблені Яндексом дані могли вміщуватися на одному сервері. Зараз Яндекс має офіси та представництва у семи країнах, в яких працює понад 6000 людей.
У квітні минулого року на практичній конференції, яку Яндекс проводить для дизайнерів, ми представили власний шрифт Yandex Sans. Попрацювавши над цим два з половиною роки, ми із задоволенням нарешті поділилися результатами. У цьому дописі я розповім вам, чому і як ми це зробили, як це вийшло і що далі.
Навіщо морочитися з гарнітурою?
Безпосередньо я вибачуся перед дизайнерами, які читають цю публікацію, бо частково я обговорюватиму деякі очевидні для нас речі. Але серед наших читачів можуть бути і недизайнери, тому я почну з основ.
Шрифт або шрифт - це один із основних голосів графічного дизайну, рівноцінно кольору, формі тощо. Це впливає на те, як сприймається письмова інформація. Під час виступу Джона Маеди на TED я побачив чудовий спосіб це продемонструвати. Це історія про форму та зміст. Візьмемо певний фіксований вміст і змінимо його форму - скажімо, нашим вмістом буде "пошук Яндекса".
Ось як це виглядає написано на гарнітурі «Букварна» (підручник) - гарнітурі, яку ми використовуємо для всіх комунікацій компанії в Яндексі:
Так говорить Яндекс. Це наше ім'я, сказане в нашому голосі.
Але що, якби ми сказали те саме, використовуючи цей шрифт?
Не можна заперечувати, що це не виглядає переконливо. Це ледь читабельно. Це занадто дизайнерсько. Цей вид пошуку може сподобатися дизайнерам або хіпстерам, але це все.
Тепер це серйозно. Цей вид пошуку може працювати для мегамагазину або розділу оголошень у газеті. Вигідних пропозицій! Займіть угоду!
А як щодо цього?
Це несерйозно і безглуздо; все, що ви можете тут шукати, буде несерйозним.
Зараз це більше схоже на щось із запрошення на весілля чи меню в шикарному ресторані. Підходить, якщо вам потрібно знайти устриці, трюфелі та шампанське.
Спробуємо також це:
Це нагадує мені заправку з прикріпленим магазином. Тут ви будете шукати багато: мийка автомобілів, ключі та домкрати, навіть дешеві закуски.
Виявляється, один і той же вміст, в різній упаковці, може передавати зовсім інший зміст. Ось чому важливо правильно вибрати гарнітуру. Він повинен правильно наголосити на змісті, допомагаючи правильно виражатись, не спотворюючи його.
Отже, що зараз говорить Яндекс і як це говорить?
Тарас Шаров, керівник відділу прототипування продуктів в Яндексі, витрачав купу часу, збираючи фрази, що містяться в наших комунікаціях з продуктами, щоб створити вибір, який би ілюстрував нашу власну мову, наш стиль та голос (російською мовою). Ось деякі типові представники наших інтерфейсних фраз, написаних на Arial (з англійськими перекладами праворуч):
Arial повинен бути знайомий нашим російськомовним користувачам - це шрифт, який ми сьогодні використовуємо у всіх наших веб-сервісах:
Чому Arial? Для дизайнерів це відома історія. Arial заснований на пропорціях Helvetica, одного з найвідоміших і навіть культових шрифтів 20 століття. Helvetica з’явилася в 1957 році під ім’ям Neue Haas Grotesk. Якщо ви пропустили фільм «Гельветика», принаймні перегляньте цей трейлер (але, звичайно, краще було б переглянути весь фільм):
Цей шрифт є повсюдним у всьому світі. Незліченні бренди використовують його як основу своєї візуальної мови. Простіше кажучи, жива класика.
У 1980-х роках, коли Microsoft вибрала шрифт для своєї операційної системи Windows, чомусь компанія вирішила не платити за ліцензування Helvetica, а натомість попросила компанію Monotype створити власну версію гарнітури. Так і народився Аріал - «Гельветика бідної людини», як влучно висловився один із наших дизайнерів типу. Я не буду далі вдаватися до порівняння між Arial та Helvetica. Будь-хто, хто зацікавлений, може легко поглянути на них разом і побачити подібність:
Безперечною перевагою Arial є широкий діапазон розповсюдження - він попередньо встановлений майже на кожному комп’ютері - і величезний набір гліфів, що містять літери будь-якої мислимої мови та практично все, що вам може знадобитися. Але у дизайнерів виникають проблеми щодо багато іншого з цим шрифтом:
- Форма та пропорція літер часом сумнівні - особливо кирилицею, де багато літер виглядають просто дивними.
- Йому не вистачає різноманітності в діапазоні ваг, доступних для більшості комп’ютерів, - просто звичайних і жирних (і існує окремий Arial Black). Для сучасних інтерфейсів цього недостатньо. Потрібні різні ваги - тонкі та легкі, напівжирні тощо.
- Погана розбірливість у невеликих розмірах крапок: через закриту форму отворів літер нижче 12 пікселів символи починають згортатися, і читабельність страждає. У веб-інтерфейсах Яндекса для найменшого типу ми використовуємо більш відкриту апертуру Verdana, яка не має цієї проблеми.