Статьи

Что такое текстовые стили и как ими пользоваться

Что такое текстовые стили и как ими пользоваться

Дмитрий Моровов, дизайнер xDesign и преподаватель курсов «Контент-маркетинг» и «Копирайтинг: пишем профессионально», о том, как оформить текст, чтобы читатель в нём не запутался.

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

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

Логика

Текст по своей сути неоднороден: кроме собственно текста, есть общий заголовок и заголовки разделов. В хороших материалах присутствуют ссылки, сноски, цитаты, заметки на полях (или «фактоиды» в терминологии Бюро Горбунова), списки, внутритекстовые выделения и таблицы. Всё это я называю текстовыми сущностями.

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

Стили

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

Чтобы читатель опознавал эти сущности, их стили должны быть достаточно контрастны по отношению друг к другу.

Ссылка на связанный материал выглядит как заголовок на mel.fm

Контраст — это очевидное отличие вещей друг от друга. Контрастные цвета — например, красный и зелёный — невозможно перепутать. Текстовые сущности тоже должны достаточно отличаться друг от друга.

Некоторые студенты страдают болезнью «почти, но не совсем» — про неё хорошо написал Илья Бирман.

У разных сущностей могут быть разные:

  • начертания (жирность и курсив);
  • кегль (размер шрифта);
  • цвет;
  • гарнитуры (PT Sans и PT Serif) или даже шрифтовые семьи (Georgia и Open Sans).

Интерлиньяж, отступы, форматы, буквицы и капитель пока оставим в покое.

Особенности внешнего вида каждой сущности называются её стилем. Студентов я заставляю заучивать мантру:

Каждой сущности — свой стиль.

Например, в блоге Нетологии стиль обычного текста:

  • паратайповская гарнитура «Circe»;
  • начертание — «regular»;
  • размер — 18 px;
  • цвет — #000000, то есть чёрный.

Стили заголовков:

  • Circe;
  • regular;
  • 30 px;
  • #349bdf.

Важно не перебарщивать. Если сделать все сущности яркими и максимально контрастными друг другу — получится каша.

Реализация

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

Дальше я расскажу, как пользоваться стилями в Ворде, Тильде, Фотошопе и разметке HMTL и CSS.

Microsoft Word

Панель так и называется — «Стили». Вордовские шаблоны содержат предустановленные стили для разных сущностей. Можно создавать свои или изменять существующие. Стили заголовков меньших уровней добавляются автоматически при необходимости.

Панель стилей в Ворде 

HTML и CSS

Для верстальщиков вся статья может показаться диким капитанством, потому что  CSS — это «каскадные таблицы стилей», а HTML — разметка логических сущностей веб-страницы.

Так этот параграф выглядит в html и css

В html-документе мы выделяем тегами обычный текст < p >, заголовки < h1 > … < h6 >, цитаты < blockquote > или < q >, ссылки < a > , списки  < ol > и < ul > и другие сущности. В css — назначаем им стили.

Tilda

Тильда — это генератор сайтов из модульных блоков. Каждый блок — функциональная единица. Обычно один блок — это одна сущность, но иногда встречаются комбинации, вроде «текст+цитата» или «заголовок+текст».

Настройка стиля заголовка конкретного блока в Тильде

Стили текста и заголовков настраиваются сразу для всего сайта. Стили отдельного блока можно менять в его настройках в левом меню.

Photoshop

В Фотошопе (начиная с версии CS6) есть две панели, отвечающие за текстовые стили — «Стили символов» и «Стили абзацев». Adobe в туториалах рекомендует использовать «Стили абзацев» для базовых текстовых сущностей документа, а «Стили символов» для изменений в тексте, которые встретятся не больше пары раз в документе. Короче говоря, пользуйтесь «Стилями абзацев».

Панель стиля абзаца в Фотошопе

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

Удобство

Стили стоит использовать по двум причинам.

  • Удобно читать и ориентироваться. Читатель сможет пробежаться глазами по длинной статье и разобраться, стоит ли сохранить её в закладки, чтобы прочесть потом. Сразу понятно, где главная информация, а где второстепенная. Куда нажать, чтобы перейти к более подробному анализу темы или источникам.
  • Легко изменять. Представьте, что вы пишете диссертацию или диплом. Когда ⅔ текста уже написано, руководитель просит «поменять шрифт» во всех сносках. Или арт-директор просит увеличить кегль заголовков на два пункта на всех страницах сайта. Если делать вручную, на это уйдёт три вечности. Со стилями — три клика.

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

Дмитрий Моровов, Дизайнер xDesign

19.09.2017

на печать


Комментарии

Написать комментарий

 Проверочный код

Архив

Пн Вт Ср Чт Пт Сб Вс

Рассылка

Подписка на рассылку

E-mail:
 

Также нашу рассылку вы можете получать через

E-mail:  

Есть мнение ...

Смартфоны и гаджеты стали самым непопулярным подарком на День святого...Смартфоны и гаджеты стали самым непопулярным подарком на День святого...
Россияне предпочитают дарить съедобные подарки на День Святого Валентина. Такие результаты показал опрос пользователей Одноклассников, проведенный накануне праздника.
Меняется реальность. Меняемся мы. Коммуникация в посткризисный периодМеняется реальность. Меняемся мы. Коммуникация в посткризисный период
Три года все терпеливо ждали, когда завершится кризис и мы заживем по-старому. За это время все успели свыкнуться с новыми экономическими реалиями и даже приняли их, нашли новые способы радоваться жизни.
Талант или навык? Название для бизнесаТалант или навык? Название для бизнеса (3)
Всякому адекватному человеку ясно, что лучшее название для магазина одежды – «Одежда», строительной фирмы – «СМУ» или «Стройтрест», а для кафе-мороженого – «Кафе-мороженое». Но главное – это понятно и неймеру, если он тоже адекватен и не сформировался эстетически и ментально, гуляючи по томным приморским бульварам в шикарном костюме с золотым отливом.
В российские корпоративы пришла мода на самих себяВ российские корпоративы пришла мода на самих себя
В конце 2017 – начале 2018 года среди агентств наблюдался активный спрос на корпоративные мероприятия «А-ля рус». Успехом стали пользоваться тематические праздники с медведями, русскими принтами и икрой с блинами. Гжель, хохлома, башни московского Кремля, звезды, красный и золотой, преобладали в айдентике событий. Тренды прошлых лет на нано-праздники, цифровую трансформацию и тематические корпоративы в стиле «Великого Гетсби» уходят в прошлое.
Реклама не просто опасна. Она доводит до безумияРеклама не просто опасна. Она доводит до безумия (2)
В сети можно узнать все, что угодно, о любом человеке — а особенно о его слабостях. Этим активно пользуются рекламщики: они выслеживают и подслушивают пользователей, а часто доводят своих жертв до клинических состояний. 

Книги по дизайну

Загрузка ...

Репортажи

Выставка, посвящённая 100-летию со дня рождения Георгия ЩетининаВыставка, посвящённая 100-летию со дня рождения Георгия Щетинина (2)
В Государственном музее А. С. Пушкина открылась выставка, посвященная не столь широко известному, но заслуживающему пристального внимания художнику-иллюстратору ХХ века Георгию Щетинину.
ДИЗАЙН и РЕКЛАМАДИЗАЙН и РЕКЛАМА
Выставка рекламной индустрии "ДИЗАЙН и РЕКЛАМА" проходит 22-й раз с 12 по 15 апреля 2016 года в Центральном Доме художника на Крымском Валу. 
Художник-археологХудожник-археолог
ГЦТМ имени А. А. Бахрушина открылась выставка «Кирилл Данелия. Новая археология» — проект, в центре внимания которого Кирилл Данелия, как художник и коллекционер. 
Московское метро - Подземный Памятник архитектурыМосковское метро - Подземный Памятник архитектуры
Открывается выставка "Московское метро - Подземный Памятник архитектуры". Поход за креативом и вдохновением. Возможность посмотреть как выглядели проекты метро. Реализованные или нет экспонаты выставки интересны дизайнерам.
Художественные сокровища РоссииХудожественные сокровища России (1)
Открылась выставка «Художественные сокровища России. Лучшее из российских собраний: от иконы до живописи модерна». Как всякая новая выставка работа получилась спорная. Новая площадка, попытка нового экспонирования, известные и не известные работы русских мастеров. Стоит пойти и составить собственное мнение.

Форум

Вакансии

  • Загрузка ...

на правах рекламы

22.02.2018 - 18:46
RSS-каналы Advertology.RuRSS    Читать Advertology.Ru на Facebookfacebook    Читать Advertology.Ru ВКонтактеВКонтакте    Читать Advertology.Ru на Twittertwitter   
Advertology.Ru - все о рекламе, маркетинге и PR

Вход | Регистрация