Ланч-тайм 256: краткий перевод свежих статей о digital

#833. Шрифты в контексте кросс-культурного дизайна

Cross-Cultural Design

Источник

Поговорим о том, как культура и самобытность влияют на наше восприятие шрифта.

Стереотипы

Африку часто изображают в западных СМИ как грязную сельскую монокультуру, в которой технологии, образование или урбанизация на низком уровне. Поэтому на западе один из самых узнаваемых графических элементов, применяемых для образа чего-то африканского, племенного или нецивилизованного, — это шрифт Neuland.

На MyFonts шрифт Neuland помечен тегами «Африка», «жар джунглей» и «примитив» — это демонстрирует старый типографский стереотип. Источник.

Эффективная и выгодная реклама с сервисом от МегаФона

Широкий выбор рекламных каналов, более 100 параметров по интересам, подробная аналитика и другие возможности уже ждут в Личном кабинете. А еще кешбэк 100% за запуск рекламы в первый месяц и еще 10% — каждый месяц.

Узнать больше >>

Реклама. ПАО «МегаФон». ИНН 7812014560. ОГРН 1027809169585. ERID LjN8K1P7y.

Шрифт Neuland носил в себе образ дешевизны, уродства, трайбализма и грубости с момента своего создания в 1923 году и продолжительного использования до 1940-х годов в рекламе, ориентированной на афроамериканцев. Сегодня его тоже можно увидеть на постерах фильмов «Тарзан», «Парк Юрского периода» и «Джуманджи». Это фильмы о джунглях, диких животных и страшных зверях, скрывающихся в кустах — ведь всё это символизирует Африку.

Как избежать стереотипов в шрифтах?

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

Fonts.com продаёт шрифт Mandarin Regular со следующим описанием: «Стилизованная азиатская атмосфера создаётся не только формами рисунков, но и самим названием шрифта. Мандарин был высокопоставленным чиновником древней китайской империи». Источник.

Шрифт для всего мира

Самый простой способ найти подходящий шрифт — это использовать такие сервисы, как Google Fonts, Fontstand или Adobe Fonts.

Или нет? Например, шрифты Google (и все остальные сервисы, использующие API разработчика Google) заблокированы в Китае. Любой из бесплатных шрифтов просто не будет загружаться. В таком случае, нужно иметь запасной шрифт.

Мультиязычный шрифт

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

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

Сравнение вариантов шрифта в корейской и американской английской версиях SurveyMonkey. Источник.

Несколько советов при выборе мультиязычного шрифта:

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

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

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

Плотность шрифта

Разные культуры ценят разные уровни визуальной плотности.

Давайте сравним то, что обычно называют алфавитами CJK (китайский, японский, корейский) и латинскими (английский, французский, итальянский ). Алфавиты CJK имеют более сложные символы с формами, которые обычно квадратнее латинских букв. Глифы также могут состоять из множества мелких элементов, нежели латинские буквы — это приводит к более высокой визуальной плотности.

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

Факторы увеличения ширины текста

Коэффициент увеличения ширины текста рассчитывает длину строки текста, учитывая разные языки. Используется десятичная (1,8) или процентная доля (180%) для расчёта длины строки на английском языке по сравнению с другим языком. Конечно, расстояние между буквами зависит от фактического слова или фразы, но примите это как очень грубый способ предсказать место для текста при его переводе.

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

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

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

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

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

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

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

Берегите себя.

Читать по теме: Ланч-тайм: краткий перевод свежих статей о Digital (все выпуски)