Веб-типографіка

Що розглянемо

  • Print vs Web
  • Історія
  • Основні правила веб-типографіки

Print vs Web

в чому ж різниця

Полоса / Scroll

на відміну від друкованої продукції у цифровому дизайні практично відсутні обмеження щодо інформаційної місткості. 

За рахунок спеціально підібраного шрифту та якісній типографіці вдалося зменшити обсяг на 25%

31 том / 39 том

+ зменшені виносні елементи;

+ чіткіше накреслення;

+ макс. зменшений інтерліньяж.

Необмежена полоса

- більше повітря між елементами;

- ієрархія та структурування за рахунок пустого простору;

- розстановка акцентів та керування увагою;

- більша свобода дій для креативності та зручності. 

Принципи відтворення 

екрани пристроїв відтворення, на відміну від задрукованого паперу, є джерелами випромінення та викликають втому очей при довготривалій взаємодії.

Втомленість очей

- подавати менше інформації;

- збільшувати розмір (кегль) шрифта;

- менша ширина рядків;

- шрифти без засічок?

- мін. виворотку. 

Історія

передумови виникнення

Піктограми

Ідіограми

Алфавіт

Шрифт Гутенберга

Типографіка

мистецтво оформлення тексту відповідно до конкретних задач,

що постійно розвивається та адаптується до нових методів передачі інформації. 

 

Її особливістю є зручність сприймання інформації у digital дизайні.

Швейцарська типографіка

Особливості:

- виключка по лівому краю;

- модульна сітка;

- універсальні шрифти;

- мін. декорацій;

- піктограми, фотографії;

- вертикальний ритм;

- прості кольори та форми;

- контрастні пропорції. 

Основні правила
веб-типографіки

1. Структурування

процес аналізу текстової інформації з метою виявлення основної та додаткової інформації. 

 

Основний текст

Додатковий текст

 

 

 

Акцент

Заголовок (підзаголовок)

Лід

Текст

Кнопка (посилання)

1.2. Структура

2. Деталізація

процес поділу текстової інформації для досягнення максимальної зручності її сприймання. 

 

Абзаци

Колонки

Блоки

Абзаци

Колонки

Блоки

3. Виключка

спосіб розташування рядків абзацу по горизонталі. 

 

По лівому краю

По центру

По правому краю

По ширині

по лівому краю

по центру

Поліграфія

Це галузь людської діяльності і промисло-вості, в якій виготовляю-ться різні види друко-ваної продукції. І де б ми не знаходилися, там в тій чи іншій мірі, буде присут-ній поліграфічний, друко-ваний матеріал.

За способом застосуван-ня вся поліграфічна продукція...

 

 

Поліграфія

Це галузь людської діяльності і промисло-вості, в якій виготовляю-ться різні види друко-ваної продукції. І де б ми не знаходилися, там в тій чи іншій мірі, буде присут-ній поліграфічний, друко-ваний матеріал.

За способом застосуван-ня вся поліграфічна продукція...

 

 

Поліграфія

Це галузь людської діяльності і промисловості, в якій виготовляються різні види друко-ваної продукції. І де б ми не знаходилися, там в тій чи іншій мірі, буде присутній поліграфічний, друкований матеріал.

За способом застосування вся поліграфічна продукція...

 

 

Поліграфія

Це галузь людської діяльності і промисловості, в якій виготовляються різні види друкованої продукції. І де б ми не знаходилися, там в тій чи іншій мірі, буде присутній поліграфічний, друкований матеріал.

За способом застосування вся поліграфічна продукція...

 

 

4. Ширина рядка

числове вираження протяжності рядку текстового поля. 

 

 

16-22 px осн. текст

55-75 зн. у рядку

 

Ширина міжряддя – це важливий фактор, від якого залежить урожайність сої. Багаторічні дослідження впливу ширини міжрядь на врожайність на середньому заході Америки показують, що зернобобові культури, посіяні з міжряддям <76 см, мають перевагу порівняно з посівами, де відстань ≥ 76 см.

Ширина міжряддя – це важливий фактор, від якого залежить урожайність сої. Багаторічні дослідження впливу ширини міжрядь на врожайність на середньому заході Америки показують, що зернобобові культури, посіяні
з міжряддям <76 см, мають перевагу порівняно
з посівами, де відстань ≥ 76 см.

5. Списки

множина пов'язаних об'єктів, упорядкованих деяким логічним способом. 

 

Тире

Буліти

 

- високий друк; 

- плоский друк;

- глибокий друк.

  • Pre-Press
  • Press
  • Post-Press

6. Компенсація

ручне регулювання оптичної лінії вирівнювання між об'єктами. 

 

 

 

deck

By wassky

deck

  • 226