Якщо ви блогер, то вже отримали багато порад про правильний копірайтинг. Ви також завжди в курсі останніх тенденцій SEO і вже вибрали потрібну тему для свого сайту WordPress. Ви встановлюєте один за одним різні плагіни, щоб покращити функціональність та зручність використання свого блогу. Тепер настав час поговорити про ще один аспект ведення блогу WordPress: друкарні.
Типографіка – це візуальне мистецтво створення писемних слів. Якщо ми говоримо про блог WordPress, це визначення може вводити в оману, оскільки визначення в основному зосереджено на художній друкарні. Якщо ви подивитеся на найпопулярніші блоги, то помітите, що в писемних словах немає нічого художнього.
Коли йдеться про друкарню блогу, чи це означає, що ми фокусуємося тільки на шрифті? Ні. Але те, як шрифт реалізується серед блогу, так само важливо. Ми говоримо про всі текстові елементи, кольори та комбінації шрифтів, які ви збираєтеся використовувати для створення відомої та зручної типографіки блогу.
Чому така важлива типографіка WordPress
Повернемося до визначення типографіки: створення писемних слів є найбільшою його частиною.
Люди відвідують блоги, тому що хочуть щось читати, навіть якщо ми говоримо про інфографіку. Друкарня – це все, що стосується представлення цього писемного слова. Залежно від того, як ви його використовуєте, воно підкреслюватиме моменти, на які ви хочете звернути увагу ваших читачів.
Коли ви граєте зі шрифтами та квітами всередині пропозиції, ви можете кардинально змінити його значення. Графічні дизайнери часто покладаються на цю концепцію. Вони прагнуть створення сенсу у вигляді візуального оформлення текстів і зображень.
У 2012 році Smashing Magazine опублікував статтю про те, як типографіка може маніпулювати змістом посту у графічному дизайні. Автори проілюстрували цей факт на простому прикладі: слово привіт представлено у двох різних варіантах:
Перший дизайн представлений як величезне сміливе слово важко ігнорувати. Ви чуєте це привіт у своїй голові як голосний і домінуючий голос людини, яка радий вас бачити. На другій ілюстрації те саме слово, але розташування і масштаб роблять його здається нерішучим.
Як бачимо, розташування букв і спосіб їх відповідності решти дизайну можуть змінити зміст посту. Це очевидно в графічному дизайні, але це показує нам, наскільки важливою є друкарня в будь-якому вигляді тексту, включаючи пости в блозі.
Погляньте на Портняжник, один із популярних блогів WordPress. Ви бачите чисту друкарню. Текст дуже невеликий, але це тому, що фокус цього блогу на візуальному контенті. Блог використовує менш читальний курсивний шрифт у розділі Twitter. Однак це має свою причину: ви відчуваєте, що це рукописні нотатки, тому вони дають вам відчуття, що автор написав власноруч цей текст.
Проблема з випадковим вибором типографіки WordPress
У чому полягає проблема, якщо ви вибираєте випадковий шрифт у випадковому масштабі та кольорі, не узгоджуючи його з іншими шрифтами та їх кольором?
Найбільша проблема полягає в тому, що неправильна друкарня вплине на читання вашого посту.
Дослідження Nielsen Norman Group показало, що люди не читатимуть онлайн-контент, якщо текст не зрозумілий, стиль складний та інформацію важко зрозуміти. Усі блогери знають це! Ось чому вони використовують більш короткі абзаци, і виражаються якомога ясніше.
Тим не менш, багато блогерів не розуміють, що шрифт, його розмір і контраст між текстом і фоном відіграють величезну роль у легкочитанні. Як зазначено в дослідженні Nielsen Norman, розбірливість – це «першорядний рівень зручності використання контенту». Це перше, що люди помічають на вашому веб-сайті. Якщо друкарка не буде добре зроблена, користувачі не будуть читати ваш контент, а підуть на більш комфортні сайти.
При виборі шрифту ви маєте дуже багато варіантів для експериментів. Однак важливо знати, які конкретні шрифти краще не використовувати:
Тихий океан. Він здається художнім, і це може виглядати чудово для графічного дизайну. Але це виглядає недоречно як домінуючий шрифт на сайті блогу WordPress.
Імпакt. Нормально для заголовків, і ми часто бачимо його в цій якості, але це занадто вузький для тексту на вашому сайті.
комікс без МС. Ви пишеш комікси? Тоді вам дозволено використовувати цей шрифт у дизайні. Але краще не розглядати його для посту у блозі.
омар. Уявіть собі, що ви читаєте довгий бланк у блозі, написаний чиїмось прекрасним, але нечитаним почерком. В точку!
Франклін готичний. Можливо, цей чистий шрифт добрий для газети. Але він виглядає трохи застарілим для використання у блозі. Хоча він не такий поганий, як попередні шрифти в цьому списку, але все ж таки краще уникати цього.
Ось як вони виглядають візуально:
Є багато шрифтів на вибір. Можливо ви відчуєте, що Franklin Gothic вписується в атмосферу вашого сайту. Тим не менш, ви насамперед повинні мати на увазі читача. Тому обов'язково виберіть шрифт, який буде привабливим та читаним для середнього відвідувача веб-сайту.
2. Використовуйте комбінації шрифтів
Замість того, щоб думати про окремий шрифт, який був би універсальним для вашого сайту, зверніть увагу на вибір комбінації шрифтів, які працюють разом. Якщо ви подивитеся на деякі сайти WordPress, які легко читаються, ви помітите, що вони використовують різні шрифти для заголовка, підзаголовків, тексту та інших текстових елементів на веб-сайті. Це робиться тому, що легко підкреслити деякі аспекти, якщо просто змінити шрифт.
Якщо ви хочете, щоб коментарі не відволікали увагу від тексту, виберіть менш помітний шрифт і зменшіть його. Якщо хочете підкреслити певні моменти, такі як підзаголовки, підберіть сміливіший шрифт, ніж той, який ви використовуєте в тілі посту.
Тож які комбінації працюють? Це складне питання. Все залежить від загального дизайну вашого веб-сайту. Поекспериментуйте з різними комбінаціями, і ви прийдете до переможної версії, яка дасть відчуття вашому сайту.
FontPair – чудовий інструмент для використання, коли ви хочете побачити, як різні шрифти працюють разом. Це дозволяє заощадити багато часу на експерименти, тому що не доведеться змінювати шрифти на вашому сайті знову і знову.
3. Підберіть розмір
Вибір шрифтів – це не єдиний аспект типографіки. Потрібно також враховувати розмір шрифту. Ви знаєте, як утомливо читати пости з невеликим текстом. Є рішення: можна збільшити масштаб сторінки, але часто порушує її дизайн. Ви не хочете, щоб ваші читачі робили такі додаткові дії з вашим сайтом?
Надто великий шрифт також є проблемою. Це робить ваш сайт незручним. Може здатися, що ви кричите.
Який розмір має бути у шрифтів
Визначити це можна, усвідомивши, як ви читаєте електронні книги на планшеті. Горизонтальний вигляд складніший для очей. Справа не в тому, що ви звикли до стандартних книжкових форматів. Це тому, що в горизонтальному поданні занадто багато символів в одному рядку, тому ваше око втрачає фокус.
На думку більшості дослідників, які вивчали проблему, 50-60 символів на лінію є ідеальним співвідношенням і до 75 символів вважається прийнятним. Ці символи включають прогалини та інтерполяцію. Дуже зацікавлений читач прочитав би ваш текст, навіть якщо йому було надано більше 150 символів в одному рядку. Однак, якщо ви встановите шрифт до 60 символів у рядку, цей пост буде набагато приємнішим для читання.
Калькулятор Golden Ratio Typographyє гарним інструментом для вибору оптимального розміру шрифту. Ви можете ввести ширину вмісту (у пікселях) та потрібні символи у рядку, та отримайте пропозиції щодо розміру шрифту.
Ви можете змінити шрифти в налаштуваннях теми, але можна заплутатися. Деякі теми дають відмінний контроль над шрифтами, розмірами та кольорами тексту. Однак теми WordPress за промовчанням не пропонують цю розкіш.
Якщо такої можливості немає, використовуйте плагін! Ось кілька пропозицій для плагінів, які допоможуть розібратися з друкаркою вашого блогу:
Styleguide - Користувацькі шрифти та кольори
За допомогою цього плагіна можна швидко редагувати шрифти та кольори у своїй темі WordPress Customizer. Ви отримаєте попередній перегляд у реальному часі, перш ніж приймати остаточне рішення. Styleguide дозволяє у будь-якій темі вибирати серед набору шрифтів Google. Цього більш ніж достатньо для вас, оскільки Google Fonts – одна з найчисельніших та найзручніших бібліотек шрифтів. Безкоштовно, тому це величезний бонус.
Початковий лист
Цей плагін дозволить вам встановити відомий стиль для ваших постів, створивши красиву велику букву. Такий метод використовується в класичній друкарні вже давно і може підійти і для вашого блогу.
Шрифт білка
Якщо вас не влаштовують шрифти Google, вам може сподобатися Font Squirrel. Цей плагін дає безліч вибраних вручну шрифтів, які є безкоштовними для комерційного використання.
Zeno Font Resizer
Очевидно, що друкарня – це не лише стиль шрифту. Це також розмір. Отже, скажімо, ви вибираєте розмір і думаєте, що це ідеально. Що робити, якщо це не працює для одного чи кількох ваших читачів? Zeno Font Resizer дозволить своїм відвідувачам змінювати розмір шрифту для комфортного прочитання постів блогу.
5. Погодьте фон та колір шрифтів
Ідеальна типографіка втратить свою унікальність, якщо ви виводитимете її на невідповідне тло. Важливо мати високий контраст між тлом та текстом. Звичайне біле тло і темний шрифт – найбезпечніший варіант, і в той же час найефективніший. Ви бачите багато білого простору та читаного тексту в найуспішніших блогах WordPress. На це є причина.
Візьмемо блог TED в якості прикладу. Чорний текст на білому тлі. Нічого революційного у цьому дизайні. Але вам не потрібно бути революційним, коли справа доходить до друкарні WordPress. Вам потрібно запропонувати читачеві те, що працює.
Хоча типографіка в блогах здається досить простою проблемою, але коли почнете копатися в ній, виявите її багаторівневість. З використанням різних шрифтів, розмірів, кольорів та друкарського акценту ви можете досягти ідеального варіанта надання ваших постів у блозі.
Найважливіший вихід: незалежно від того, наскільки ви граєте з дизайном, текст має бути максимально зручним для читання.
Вивчає сайтобудування з 2008 року. Практикуючий вебмайстер, який спеціалізується на створенні сайтів на WordPress. Задати питання Олексію можна на https://profiles.wordpress.org/wpthemeus/
Коментарі до запису: 0