Правильні розміри шрифтів CSS

9 0 Новини високих технологій

До створення HTML/CSS ніякої проблеми з вибором розміру шрифту не існувало. Механізм друкарської машинки мав тільки один набір символів одного розміру. При відсутності інших можливостей люди прекрасно спілкувалися між собою, створювали твори мистецтва, проектували атомні електростанції, літали в космос і за допомогою перфораторів вводили складні програми в пам'ять обчислювальних машин через перфокарти, а це тільки 1 або 0.

Гарний сайт з професійним дизайном

Коли інтернет-програмування зайняло своє гідне місце у житті суспільства і стало нагальною потребою, дизайнери і власники сайтів вважали нормальним створювати веб-шедеври. Розробники стандартів HTML/CSS, браузерів і різних інструментальних засобів відповідали на потреби розробки веб-ресурсів, але досить швидко все повернулося на круги своя. Насправді розробнику сайту важливо виконати роботу швидко і якісно, а відвідувачу сайту - отримати інформацію. Малювати і говорити вміють всі, але набагато важливіше передати/отримати інформацію.


Правильні розміри шрифтів CSS
Практика і реальна потреба - це не мистецтво, а життя, робота чи відпочинок в ефективному, простий і практичному варіанті. Задати будь-який розмір шрифту в HTML/CSS можна без всяких проблем. Але не завжди в цьому є сенс. Гарний сайт - це не професійний дизайн, а професійне виконання, що забезпечує потрібну функціональність в зрозумілому і зручному для користувача форматі.

Можливості CSS з управління шрифтами

У цьому прикладі гранично просто показані основні можливості використання шрифтового арсеналу CSS для опису тегів HTML.
Правильні розміри шрифтів CSS
Опис стилів виконано наступним чином.
Правильні розміри шрифтів CSS
З самого початку HTML пропонував для кодування тексту тег - p. Можна сказати, що тіло веб-сторінки - це тег body, а вже потім безліч p, div, span та інших тегів. З самого початку CSS пропонував правила - задавати шрифт, колір, розмір, вирівнювання та інші.


Сучасна реалізація підтримки HTML/CSS в браузерах дозволяє динамічно впливати на правила CSS: зміна розміру шрифту тут не виняток, а часто вживане дію.

Логіка формального підходу

HTML і CSS - це потужні формальні системи представлення даних. Досвід програмування багатьох десятиліть, знання та вміння сотень тисяч кваліфікованих фахівців привели до створення фундаментальних правил опису і використання даних. Задати розмір шрифту на CSS - не проблема. Змінити його в серверному скрипті при створенні сторінки - елементарно. Як тільки сторінка потрапила в браузер, і він побудував DOM (дерево об'єктів сторінки), за допомогою javascript легко всім керувати, і розмір шрифту - не виняток.
Правильні розміри шрифтів CSS
Для чого, в яких випадках і як змінити розмір шрифту? CSS-правила - це статика, javascript - динаміка. Через DOM і обробник на javascript програміст має динамічний доступ до будь-якого правила CSS. Не просто динамічний: можна міняти по ходу руху відвідувача і за власним таймеру сайту в часі. Можна змінити все, що описано у файлі CSS: розміри шрифтів, сімейства шрифтів, кольору, вирівнювання і будь-які інші правила. Можна все зробити так, що сайт не буде чекати дій конкретного відвідувача, а буде враховувати поведінку всіх відвідувачів сайту і/або логіку розробника.

Логіка природного спілкування і клавіатура

Людина не показує іншій людині в спілкуванні ні кольору, ні сімейства шрифтів, ні їх розміри. Спілкування людей завжди емоційно забарвлене. За період розвитку друкарства друкарська машинка успішно справлялась з потребами людей. До появи комп'ютерів і текстових редакторів з дивовижним різноманіттям примірники опису було створено достатньо наукових, технічних і творчих досягнень. Дані обставини з усією об'єктивністю пояснюють, чому широкі можливості HTML і CSS в сучасному інтернет-програмуванні прагнуть до практичною і комфортною реалізації. Вже немає тієї строкатості тегів, застосування миготливих правил, що обертаються текстових рядків і біжать об'єктів. Досі проста клавіатура (як проста друкарська машинка) має набір символів і знаків, але на ній немає кнопки розміру шрифту. Розробнику не приходить на розум змінити розмір шрифту CSS-правила поля вводу. Його більше турбує те, як забезпечити зручний діалог: введення/виведення інформації.
Правильні розміри шрифтів CSS
Адаптивна верстка, необхідність все гранично спростити так, щоб відвідувач на комп'ютері бачив і розумів усе, як на смартфоні або планшеті - теж істотні обставини. Розміри шрифтів CSS сам може змінювати. CSS - це не тільки правила опису тегів. Це класи, ідентифікатори, псевдокласи і псевдоелементи. Комбінуючи опису CSS, можна відмовитися від використання javascript у вирішенні деяких завдань. Наприклад, змінити розміри шрифтів CSS може допомогою комбінації: a, a:hover, a:visited, a:active
Виконавши основне опис для a, можна уточнити його в hover, відвідали і active. Розробник має масу можливостей, але у нього вже є розуміння достатнього і необхідного в застосуванні цих можливостей.

Розмір вікна, рядка та символу

Принципово вірно, що розмір вікна визначає пристрій, але це не завжди так. Розмір вікна може однозначно визначити правильні розміри шрифтів. CSS-файл описів повинен автоматично налаштуватися на потрібний розмір не тільки шрифту, але і зміст рядка тексту, кожного видимого блоку. Не варто нав'язувати відвідувачу свою комбінацію розмірів елементів HTML-сторінки. За великим рахунком вирішувати, як має виглядати сторінка - компетенція відвідувача. Це в його браузер «потрапляє» розробник зі своїми ідеями функціональності та дизайну сторінки. Розробник функціонує на сервері, а в браузер відвідувача він відправляє код, який може управлятися браузером відвідувача. Останній може впливати на це управління.
Правильні розміри шрифтів CSS
Розміри шрифтів в CSS не визначаються розміром символу. Навіть використання пропорційних шрифтів не вирішує проблему довжини рядка, яку потрібно відправити в той чи інший тег сторінки. У наведеному вище прикладі допущена помилка розробника» - рядки 4 і 5 містять Times 14px, але відображені різними розмірами. Сусідні теги несуть у собі таку ж помилку. Інакше кажучи, немає ніякого зв'язку між:

  • текстом;
  • тегом, у якому він знаходиться;
  • CSS-правилом на розмір шрифту.
  • Фактично, створюючи сторінку, розробник припускає, як і що повинно виглядати, де перебувати, якого розміру бути. Як би це дивно не звучало, але будь сторінка найпопулярнішого і якісного сайту виявляється в браузері відвідувача, як людина в його квартирі, і намагається встановлювати свої порядки.

    Оптимальний розмір

    Об'єктивна дійсність - приклад «доцільності розмірів». Бджола не може бути більше, ніж є, а літак не може бути такого розміру, як бджола.
    Правильні розміри шрифтів CSS
    Віртуальність - це світ безмежних можливостей, але він стає таким тільки тоді, коли керується об'єктивними вимогами необхідності і достатності. Все має бути в межах розумного.