Який вибрати шрифт для сайту

1. Вибір сімейства шрифту

Існує безліч шрифтів, багато хто з них схожі один на одного, але тим не менш у кожного з них є свої відмінні риси. Однак далеко не у всіх браузерах є кожен з них. Нижче представлений невеликий список найпопулярніших шрифтів, які є в кожному браузері:

Наприклад, можна вибрати який-небудь гарний шрифт на Google Font. але щоб обраний шрифт з'явився у користувачів в браузері потрібно буде підключити його. В результаті шрифт буде кожен раз довантажуватися з Google Font, що на мій погляд погано і на це є ряд вагомих причин:

По-перше, з'являється залежність від інших сайтів (в даному випадку від Google). Наприклад, Google з якихось причин може повільно працювати, то в цьому випадку Ваш сайт також загальмується. За прикладами далеко ходити не треба. Я особисто довантажувати скрипт для роботи AJAX (jquery) з сайту Google, але періодично він взагалі не вантажився і це призводило до некоректної роботи всього сайту. Рішення проблеми було простим: просто скопіював весь .js файл до себе на хостинг і довантажувати його з мого хостингу. Тому найкраще, коли весь сайт вантажиться з Вашого ж хостингу. Однак перенести шрифти до себе на сайт не вийде, доведеться завжди вантажити їх з сайту Google.

По-друге, в таких браузерах, як Opera в очах користувача все буде виглядати наступним чином: він заходить до Вас на сайт, контент вже з'явився і приблизно через півсекунди - бам і шрифт змінився. Це станеться, як тільки браузер довантажити його з Google і обробить. На мій погляд, що для серйозних ресурсів це "мерехтіння" стилів у тексту недоречно. Звичайно, така ситуація не на всіх браузерах, але особисто мені і однієї опери вистачає, щоб відмовитися від ідеї використання малопопулярних шрифтів.

Повернемося до сімейств шрифтів. Найкращим (а точніше навіть універсальним) на мій погляд шрифтом є Verdana. На цьому сайті якраз такий шрифт. Він без закарлюк, є строгим і Новомосковскемим, а саме це і треба користувачеві для швидкого отримання інформації.

2. Вибір розміру шрифту

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

3. Вибір кольору шрифту і фону під нього

Дуже популярним також є поєднання: чорний фон і білий текст, але таке поєднанні підійде далеко не для кожного сайту. Все ж більшість сайтів мають світлі дизайни. Я знайшов спеціальний список сполучень кольору шрифту і фону (в порядку убування Новомосковскемості):

  • Синій на білому;
    Приклад - Синій на білому
  • Чорний на жовтому;
    Приклад - Чорний на жовтому
  • Зелений на білому;
    Приклад - Зелений на білому
  • Чорний на білому;
    Приклад - Чорний на білому
  • Червоний на жовтому;
    Приклад - Червоний на жовтому
  • Червоний на білому;
    Приклад - Червоний на білому
  • Зелений на червоному;
    Приклад - Зелений на червоному
  • Помаранчевий на чорному;
    Приклад - Помаранчевий на чорному
  • Чорний на пурпуровому;
    Приклад - Чорний на пурпуровому
  • Помаранчевий на білому;
    Приклад - Помаранчевий на білому
  • Червоний на зеленому;
    Приклад - Червоний на зеленому

4. Інші дрібниці

До цих дрібниць я б хотів віднести наступне:

  • Текст повинен бути оформлений в нижньому регістрі, тому що великий регістр викликає роздратування;
  • Вирівнювання шрифту має бути по лівому краю, оскільки до цього всі звикли;
  • Контент повинен бути за шириною не дуже сильно розтягнутий, оскільки користувачі ледачі і якщо доведеться очам бігати від лівого до правого краю монітора це буде викликати дискомфорт і втрату думки;
  • Шрифт повинен бути звичайним, тобто НЕ курсивним, що не жирним, чи не підкресленим (побережіть ці елементи для виділення головних думок в тексті);