Типографика: секреты оформления текста

Гарнитуры, кегель, интерлиньяж, кернинг - как в этом не запутаться?

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

Некоторые древние книги - непревзойдённый образец гармоничного оформления
Некоторые древние книги — непревзойдённый образец гармоничного оформления
  • Шрифт (гарнитура, font-family)

Шрифт – это набор символов одного стиля. Чаще всего используются гарнитуры Arial, Times New Roman, Helvetiica и Verdana.

Виды шрифтов

  • Размер шрифта (font-size)

Размер шрифта определяется его высотой. В типографике используют две системы: систему Дидо и англо-американскую. Единицей размера литеры выступает пункт. В системе Дидо 1 пункт равен 0,37 мм, а в англо-американской – 0,35 мм.

Для обозначения размера шрифта был введен термин «кегль». Он обозначает количество пунктов. Например, если кегль набранного текста равен 12, то его размер составляет 12 пунктов. В интернет-технологии размер шрифта (font-size) чаще указывают в пикселах (px).

Размеры шрифта

  • Жирность (font-weight) и другие параметры начертания

По начертанию шрифты делятся на светлый-полужирный-жирный, узкий-нормальный-широкий, прямой и наклонный (курсивный).

  • Насыщенность шрифта
  • Промежутки между буквами: трекинг и кернинг

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

10 постулатов типографики

  1. 12 кегль – самый удобный для восприятия размер шрифта на бумажной странице. А для чтения на веб-странице оптимален другой показатель – от 15 до 20 пикселей.
  2. Отбивки между абзацами улучшают восприятие текста.
  3. Громоздкие, с завитушками или другими декоративными элементами шрифты вынуждают глаза сильно напрягаться, поэтому они используются только в плакатах и (редко) в заголовках. В основном тексте применяют только простые по рисунку гарнитуры.
  4. Между словами всегда ставится только один пробел.
  5. Подчеркивание – не лучший способ выделения, а интернет-тексте вообще не допустимый. Для акцентирования внимания на важной информации больше подойдёт изменение насыщенности шрифта.
  6. Не перебарщивайте с количеством жирного или наклонного шрифта и не совмещайте разные способы выделения информации, потому что читатель не сможет сконцентрироваться на сообщении.
  7. Не забывайте включать перенос слов (если он предусмотрен).
  8. Не путайте дефисы и тире и не используйте несколько дефисов в качестве тире.
  9. Используйте правильные символы товарного знака и авторского права, а не алфавитные аппроксимации.
  10. Создавайте абзацный отступ (красную строку), только используя специальную настройку в интерфейсе редактора или меняя свойство text-indent, а не добавляя пробелы в начало строки.

«Я не брошу эту газету и надеюсь, что она не бросит меня»

Дмитрий Муратов уходит с поста главного редактора «Новой газеты»

Главный редактор «Новой газеты» Дмитрий Муратов собирается покинуть свой пост. Эта новость вызвала разговоры о зачистке медиапространства и давлении со стороны правительства. Читатели недоумевали: как после 22 лет работы Муратов впервые не примет участия в выборах на должность главреда.

15 ноября в «Новой газете» вышла объяснительная записка журналиста. В ней Муратов объясняет, что выборы в редакции – это стандартная процедура, которая проводится каждые два года, и еще в 2015 году он лично попросил сотрудников не выдвигать его кандидатуру на должность главного редактора на 2017-2019 годы. Сообщения об «усталости» как о возможной причине ухода Муратов опровергнул.

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

 

Сергей Кожеуров - один из кандидатов на пост главного редактора "Новой газеты"
Сергей Кожеуров — один из основателей «Новой газеты», кандидат на выборы главного редактора

Сотрудники «Новой» будут делать выбор между тремя кандидатами: один из основателей газеты, а ныне генеральный директор Сергей Кожеуров, шеф-редактор Алексей Полухин и редактор отдела «Политика и экономика» Кирилл Мартынов.

Дмитрий Муратов не сказал, кому отдаст свой голос, но сообщил, как будут проходить выборы:

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

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

Дмитрий Муратов является одним из основателей «Новой газеты», в которой в 1995 стал главным редактором. «Новая газета» — общественно-политическое издание, известное своими расследованиями и репортажами. Журналисты «Новой» писали о действиях официальных лиц во время теракта в Беслане, о «молдавской схеме» отмывания денег, «группах смерти», а также о преследованиях гомосексуалов в Чечне. За годы существования газеты были убиты 5 журналистов и несколько лиц, связанных с изданием. В адрес сотрудников периодически поступают анонимные угрозы.

«Главные кадры» ТАСС: история сквозь объектив

В "Манеже" представлены фотографии, охватывающие историю ХХ столетия

Уникальная экспозиция открылась 1 ноября в московском выставочном зале «Манеж» в рамках масштабного культурно-просветительского проекта ТАСС. Выставка «Главные кадры» — это более тысячи снимков, сделанных корреспондентами ТАСС с 20-х годов ХХ века до наших дней. Фотографии представлены в 20 разных категориях — от архитектуры СССР и кадров Великой Отечественной войны до экспедиций в Арктику и Антарктику и истории развития советской модной индустрии.

Фото из архива ТАСС. Актриса Марлен Дитрих посетила Советский Союз в 1964 году и дала четыре концерта
Фото из архива ТАСС. Актриса Марлен Дитрих посетила Советский Союз в 1964 году и дала четыре концерта

Подготовка выставки началась еще в 2015 году — специалисты оцифровали и систематизировали 850 тыс. фотографий из архива ТАСС, охватывающих вековую историю страны и самые значимые события этой истории. Большинство изображений, попавших на экспозицию, ранее не публиковалось. Генеральный директор ТАСС Сергей Михайлов отметил, что «фотоархив агентства — это биография целой страны, включающая все этапы ее развития, бесценное свидетельство исторических событий». Куратором выставки стала Нина Гомиашвили, основавшая фотогалерею «Победа». По ее словам, важно было «показать работы малоизвестных фотографов, в которых тоже живет история страны. Поэтому «Главные кадры» — это больше про людей, чем про фотографические имиджи».

Помимо традиционно расположенных на стенах фотографий, зритель выставки сможет увидеть настоящие реликвии — альбомы, которые хранятся в «сакральном» стеклянном шкафу в здании фотоархива ТАСС — и даже самостоятельно полистать их. Кроме того, в «Главных кадрах» использованы различные мультимедийные технологии. Так, технология с необычным названием «голосовой душ» позволяет посетителю узнать историю того или иного фото из первых уст — ее расскажут сами фотокорреспонденты агентства. Такой «разговор» с публикой высоко оценил известный фотограф Антон Ланге. «Сейчас выставка должна активно говорить со зрителем, и я уверен, что ТАСС удалось достичь этого эффекта беседы: зритель — снимок — история — фотограф», — сказал Ланге. Фотограф назвал «Главные кадры» колоссальным событием в культурной жизни России.

Фото из архива ТАСС. Фигуристка и чемпионка мира Екатерина Гордеева во время тренировки
Фото из архива ТАСС. Фигуристка и чемпионка мира Екатерина Гордеева во время тренировки

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

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

Выставка будет открыта до 24 ноября. Вход для всех свободный.

Выставка "ТАСС открывает фотоархивы" отражает вехи истории ХХ и ХХI веков
Выставка «ТАСС открывает фотоархивы» отражает вехи истории ХХ и ХХI веков

Твин Пикс: провал или шедевральное возвращение?

Критики насмехаются, а телезрители с упоением смотрят новую версию мистического сериала

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

За что же все так любят Твин Пикс? Во-первых, за неповторимую атмосферу, за обволакивающий дрим-поп, дух американской провинции и мистический сюжет. Во время выхода первых серий, аудитория 90-х считала, что это обычный детектив, каких много. Но невероятная история, в ходе которой Линч вертит героями как хочет, не может называться тривиальной. Игра актеров, прекрасной Шерилин Фенн и утонченного Кайла Маклахлена, заворожила зрителей.

Время идет, актеры стареют, и предпочтения меняются. Но в отличие от неудачного перезапуска «Секретных материалов», рейтинги продолжения «Твин Пикса» на портале IMDb буквально взлетели в ночь премьеры. Режиссер проекта смешал ностальгическую версию 90-х с более холодной и жестокой версией 2017 года.

Не обошлось без резких комментариев премьеры. Например, в издании The Guardian Твин Пикс назвали наркоманским бредом,  а его сюжет — утробной вакханалией. А очерк на сайте Канобу в оскорбительной манере утверждает, что Линч не нужен, лишь потому, что на платном американском телеканале премьеру посмотрело всего 506 тыс. человек.

Для многих «Твин Пикс» остался непостижимым, но он превращает телевизор в портал, из которого может вырваться нечто ужасное или поразительное в любой момент. Именно за это сериал любят и смотрят от мала до велика. Множество новых странных символов и необъяснимых явлений делают сцены в Черном вигваме еще более тревожными, чем в финале второго сезона или даже в приквеле «Твин Пикс: Сквозь огонь». Эти сцены доказывают, что за 10 лет отдыха от кинематографа, Дэвид Линч не утратил ни капли своего воображения. В новых сериях режиссер сохранил и несколько старых образов, чтобы обеспечить зрителю месяц беспокойного сна.

Оригинальный «Твин Пикс» был завязан на двух вопросах: «Кто убил Лору Палмер?» и «Что за чертовщину я смотрю?». Вновь поднимать первый вопрос уже не актуально, но зато создатели знают как заставить вас задавать второй снова и снова.

Третий сезон «Твин Пикс» можно посмотреть на «Амедиатеке».

Азбука современного веб-дизайна

Что такое материальный дизайн, скроллы, синемаграфы и лендинги

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

Материальный дизайн

Компания Google создала «material design» в 2014 году, он встречается и на совсем свежих сайтах. Особенность материального дизайна заключается в  элементах, визуально близких к материальным предметам, которые нас окружают. От плоского дизайна материальный отличается:

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

Градиент стал популярным еще в 2016 году, когда многие компании начали использовать его для разработки иконок с необычными цветами. Наглядный пример — иконка приложения Instagram.

Более того, cочетание контрастных цветов и минималистичного дизайна — одно из самых распространённых дизайнерских решений. Его пустила в ход и компания Google, когда работала над  главной поисковой страницей браузера Google Chrome.

Актуальный дизайн логотипа Instagram
Актуальный дизайн логотипа Instagram
Активный бэкграунд

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

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

Иллюстрации и графические элементы

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

Узоры, геометрические фигуры и абстракция

Узоры, геометрические фигуры и абстрактные элементы подчёркивают минимализм дизайна и работают на привлекательность сайта. 

Анимации, гифки и скроллы

Чем больше визуальной информации и меньше текста — тем меньше вероятность угасания интереса у читателя. 

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

Синемаграфы

Синемаграфы — новый формат визуального контента. Это статичные фотографии или картинки с одним или несколькими подвижными элементами. Они оживляют сайт и привлекают анимированностью.

Лендинги

Лендинг — одностраничный сайт, направленный на точное и быстрое донесение информации. В основном он играет роль медиа-кита или страницы для привлечения внимания аудитории. 

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

 

3D (3 dimensions или 3 измерения)

Словосочетания «виртуальная реальность», «дополненная реальность» и «3D» стали частью нашего лексикона. Подобные эффекты способ создания ощущения присутствия и реалистичности. Их использование в конструировании сайтов доказывает развитие технологий веб-дизайна.

Типографика

Типографика – искусство оформления текста.  К ней можно отнести такие параметры как гарнитура, межстрочный интервал,  расположение на странице, тип шрифта, цвет, его кегль (размер), расстояние между буквами.

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

Нестандартная сетка

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

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