| Порівняння попередніх версій Попередня ревізія Наступна ревізія | Попередня ревізія |
| subjects:basic:informatika:graph:typohrafika [26.04.2025 11:44] – [Форматування для приємного читання] Адміністратор | subjects:basic:informatika:graph:typohrafika [04.05.2025 12:53] (поточний) – [Типографіка] Адміністратор |
|---|
| ====== Типографіка, шрифти і шрифтові пари. Прийоми каліграфії та леттерингу. Поєднання шрифтів ====== | ====== Типографіка, шрифти і шрифтові пари. Прийоми каліграфії та леттерингу. Поєднання шрифтів ====== |
| ===== Типографіка ===== | ===== Типографіка ===== |
| **Типографіка** - найсильніший інструмент для вираження посилу в веб-дизайні. З його допомогою ви можете об'єднати текстову і візуальну складові, що допоможе вам достукатися до відвідувача. Правильне використання типографіки допоможе уникнути типових помилок, що допускаються дизайнерами при створенні чергового шедевра. Постараємося зрозуміти, що ж ми робимо не так, і як уникнути помилок в майбутньому. | |
| |
| **Типографіка** - звід законів, правил і норм оформлення тексту, заснованих на вивченні сприйняття набору читачем. Знання і розуміння типографіки перетворюють текст в інструмент побудови композиції, роблять його живим, надають характер і здатність передати ідею не тільки за допомогою змісту, а й графічно. | **Типографіка** - звід законів, правил і норм оформлення тексту, заснованих на вивченні сприйняття набору читачем. Знання і розуміння типографіки перетворюють текст в інструмент побудови композиції, роблять його живим, надають характер і здатність передати ідею не тільки за допомогою змісту, а й графічно. |
| | |
| | **Типографіка** - найсильніший інструмент для вираження посилу в веб-дизайні. З його допомогою ви можете об'єднати текстову і візуальну складові, що допоможе вам достукатися до відвідувача. Правильне використання типографіки допоможе уникнути типових помилок, що допускаються дизайнерами при створенні чергового шедевра. Постараємося зрозуміти, що ж ми робимо не так, і як уникнути помилок в майбутньому. |
| |
| ===== Гарнітура ===== | ===== Гарнітура ===== |
| |
| <callout type="info" icon="fa fa-info"> | <callout type="info" icon="fa fa-info"> |
| Внутрішній просвіт літери або **замкненй елемент шрифту** (англ. **Counter Typography**) — простір, цілком або частково обмежений штрихами знака. Розрізняють закриті та відкриті просвіти. Приклади закритих просвітів: у кириличних літерах «А», «а», «б», «в» тощо; у латинських літерах «D», «d», «g», «q» тощо; у цифрах «6», «8» тощо. Приклади відкритих просвітів: у кириличних літерах «П», «п», «с» тощо; у латинських літерах «G», «m», «n» тощо; у цифрах «3», «5» тощо. Деякі знаки мають різні накреслення, що відрізняються закритими та відкритими просвітами, наприклад, латинська літера '' та '', цифра '' та ''. | **Внутрішній просвіт літери** або **замкненй елемент шрифту** (англ. **Counter Typography**) — простір, цілком або частково обмежений штрихами знака. Розрізняють закриті та відкриті просвіти. Приклади закритих просвітів: у кириличних літерах «А», «а», «б», «в» тощо; у латинських літерах «D», «d», «g», «q» тощо; у цифрах «6», «8» тощо. Приклади відкритих просвітів: у кириличних літерах «П», «п», «с» тощо; у латинських літерах «G», «m», «n» тощо; у цифрах «3», «5» тощо. Деякі знаки мають різні накреслення, що відрізняються закритими та відкритими просвітами, наприклад, латинська літера '' та '', цифра '' та ''. |
| Текст набраний трьома шрифтами з різними апертурами: Corbel (зверху), Helvetica (посередині) та Haettenschweiler (знизу). | Текст набраний трьома шрифтами з різними апертурами: Corbel (зверху), Helvetica (посередині) та Haettenschweiler (знизу). |
| |
| * [[https://sites.google.com/view/distance-informatics-10/%D0%BC%D0%BE%D0%B4%D1%83%D0%BB%D1%8C-%D0%B3%D1%80%D0%B0%D1%84%D1%96%D1%87%D0%BD%D0%B8%D0%B9-%D0%B4%D0%B8%D0%B7%D0%B0%D0%B9%D0%BD/%D0%B3%D1%80%D0%B0%D1%84%D1%96%D1%87%D0%BD%D0%B8%D0%B9-%D0%B4%D0%B8%D0%B7%D0%B0%D0%B9%D0%BD/%D1%83%D1%80%D0%BE%D0%BA-4|Інформатика, 10 - Урок 4]] | * [[https://sites.google.com/view/distance-informatics-10/%D0%BC%D0%BE%D0%B4%D1%83%D0%BB%D1%8C-%D0%B3%D1%80%D0%B0%D1%84%D1%96%D1%87%D0%BD%D0%B8%D0%B9-%D0%B4%D0%B8%D0%B7%D0%B0%D0%B9%D0%BD/%D0%B3%D1%80%D0%B0%D1%84%D1%96%D1%87%D0%BD%D0%B8%D0%B9-%D0%B4%D0%B8%D0%B7%D0%B0%D0%B9%D0%BD/%D1%83%D1%80%D0%BE%D0%BA-4|Інформатика, 10 - Урок 4]] |
| * [[https://www.toptal.com/designers/typography/web-typography-infographic|www.toptal.com]] | * [[https://www.toptal.com/designers/typography/web-typography-infographic|www.toptal.com]] |
| | * [[wp>Внутрішній просвіт літери]] |
| |
| {{tag>інформатика типографіка шрифт дизайн}} | {{tag>інформатика типографіка шрифт дизайн}} |
| Теги: {{tagpage>інформатика}}{{tagpage>типографіка}}{{tagpage>шрифт}}{{tagpage>дизайн}} | Теги: {{tagpage>інформатика}}{{tagpage>типографіка}}{{tagpage>шрифт}}{{tagpage>дизайн}} |