Статья опубликована в №81 (май) 2020
Разделы: Информационные технологии, Искусствоведение
Размещена 16.05.2020. Последняя правка: 20.05.2020.
Просмотров - 2309

Основные приемы работы с текстом на мобильных устройствах

Крайнова Софья Юрьевна

Бакалавр

Алтайский государственный университет

Студент

Турлюн Любовь Николаевна, кандидат искусствоведения, доцент кафедры культурологии и дизайна. Ткалич Виктория Александровна, бакалавр, студент.

УДК 004.92

Введение

Мобильная типографика - это один из важнейших атрибутов в мобильном дизайне, который включает в себя множество аспектов и правил использования. При этом визуальные коммуникации стали настолько глобальными и интернациональными, что проблема перевода и адаптации (языковой и графической) послания также не является критичной [2, с.14]. Одни из главных правил, которые нужно выполнять следующие: первое – это выбор понятного шрифта, а второе – учитывать то, на каком устройстве люди будут читать текст. Соединив вышеперечисленные шаги вместе, получится создать удобочитаемый текст для любого типа устройств. Это навык, который должен освоить каждый дизайнер в эпоху цифровых технологий.

Актуальность

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

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

Основная часть

Основы мобильной типографики.

У шрифта есть абсолютные единицы измерения – пики (pica) и более мелкие доли пик – пункты (point) [4, с.33]. В отличие от шрифта, предназначенного для печати, и даже для многих проектов веб-дизайна для настольных компьютеров, мобильная и адаптивная типографика часто не измеряется с использованием абсолютной системы измерения размера шрифта. К примеру, вместо того, чтобы выбирать шрифт размером 14 пункт для печати, мобильный и адаптивный тип разработан с использованием таких единиц измерения, как пиксели, em или rem. Эти гибкие единицы основаны на процентах и ​​могут помочь дизайнерам легче создавать шрифты для нескольких устройств.

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

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

С каких устройств люди будут читать текст.

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

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

Также следует учитывать выравнивание. Обычно люди читают слева направо. Особенно на маленьком устройстве нужно сохранять стили выравнивания простыми для максимальной читабельности.

Значение ширины экрана.

Ключевым фактором при разработке шрифта для мобильных устройств, приложений или планшетов является ширина экрана. Стоит помнить о том, есть две ширины: вертикальная (как большинство людей держат свои телефоны) и горизонтальная. Слишком большой шрифт создаст много разрывов в тексте, а если используются переносы, много дефисов. Следует отметить, что немногие веб-дизайнеры используют дефисы. Частые перерывы в текстовом потоке могут привести к тому, что читатель будет останавливаться слишком часто, что и сделает чтение прерывистым и более трудным для восприятия. Тогда слишком маленький шрифт может заставить читателя напрягаться, что помешает ему сосредоточиться на тексте.

При просмотре в максимизированном окне браузера также возникает ряд проблем: картинки растягиваются до невероятных размеров, строчки текста становятся слишком длинными, а сетка выходит за все мыслимые пределы [3, с.74].

Пространство в дизайне текста.

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

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

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

Использование простых шрифтов.

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

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

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

Мобильные пропорции и масштаб.

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

Функциональность.

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

Стоить помнить, за какой бы информацией люди ни приходили на ваш сайт – будь то новости, результаты спортивных матчей, сведению местного характера или другие виды контента, – им нужен немедленный ответ: на то, чтобы изучать карту сайта, у них просто нет времени [1, с.23].

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

Заключение

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

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

1. Вроблевски Л. Сначала мобильные! / Люк Вроблевски; пер. с англ. П. Миронова. – М.: Манн, Иванов и Фербер, 2012. – 176 с.
2. Кумова М. Шрифт в айдентике, рекламе, многостраничниках, упаковке, навигации, вебе и каллиграфия. / Кумова М., Калинкина О., Филиппова А. – М.: КАК проект, 2013. – 396 с.
3. Маркотт И. Отзывчивый веб-дизайн / Итан Маркотт ; пер. с англ. П. Миронова. – М.: Манн, Иванов и Фербер, 2012. – 176 с.
4. Феличи Дж. Типографика: шрифт, верстка, дизайн. / Джордж Феличи; пер. с англ. и коммент. С. И. Пономаренко. – СПб.: БХВ-Петербург, 2004. – 496 с.
5. Шпикерманн Э. О шрифте. / Эрик Шпикерманн; пер. с англ. Л. Лаврухина. – М.: Манн, Иванов и Фербер, 2017. – 208 с.

Рецензии:

17.05.2020, 7:31 Эрштейн Леонид Борисович
Рецензия: Сама тема не предполагает научную новизну. К публикации не рекомендую. Это хорошая статья для 3д ньюс или чего-то подобного, но науки здесь нет и быть не может.

18.05.2020, 21:22 Олевский Виктор Аронович
Рецензия: Сформулируйте научную новизну в сравнении с библиографией. Если она есть, без этого ни как нельзя.

20.05.2020, 10:01 Олевский Виктор Аронович
Рецензия: Содержательная и весьма современная статья, публикацию рекомендую.



Комментарии пользователей:

Оставить комментарий