Форум программистов, компьютерный форум, киберфорум
SlavAz
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск  

Загадка качественного шрифта в web'е

Запись от SlavAz размещена 29.09.2012 в 11:47
Показов 1627 Комментарии 22

Вступление

Для кого-то данный материал может показаться очевидным и давно известным, для меня же это было маленькое открытие. Столкнувшись с задачей создания собственного шрифта под веб я решил докопаться до истины отображения шрифтов в браузере и вот что из этого вышло:


Интернеты говорят!

Почему некоторые шрифты при размерах меньше 20 пикселей выглядят ужасно в браузере? Этот вопрос волнует многих веб-дизайнеров. Особенно актуальным этот вопрос стал последнее время, когда типографика плотно влилась в web. В интернетах незнающие люди пишут, что все дело в сглаживании браузера, мол браузер решает (опираясь на настройки системы или нет, как IE) и все на этом. И эти мнения первые, которые попадаются. Я же считал, что дело в начертании шрифта, с некоторыми оговорками. Так ли это на самом деле?


Рассуждение

Конечно, качество рендеринга шрифта на прямую зависит от начертания букв. Но! Давайте взглянем на, всем известный, шрифт Arial и конкретно на букву "К"

К

Невооруженным глазом видно, что при большом размере к букве применяется сглаживание и это делает её ровненькой и красивой. Так же видна её изящная форма.

А при маленьком: К
Название: K_pix.png
Просмотров: 692

Размер: 3.1 Кб

вдруг "К" становиться пиксельной, и сглаживание пропадает волшебным образом. Но взгляните на её начертание. Та изящная плавная буква "К" стала прямой, такие изгибы не могут так масштабироваться. Все это наталкивает на мысль, что есть какая-то "секретная" опция в самом шрифте.


Разоблачение

Так и есть! И эта чудо-опция называется хинтинг (hinting). Вот, что об этом говорит Википедия:

Хинтинг (хинтование) (англ. hinting, от hint «намёк, совет») — изменение контура шрифта при его растеризации при помощи специальных программных инструкций, заложенных в шрифтовой файл. Используется для обеспечения более чёткой формы букв на устройствах с низким разрешением экрана или при отображении текста в мелком кегле.
Ну а как пользоваться ей - совсем другая история. Будет интересно - напишу.
Размещено в Без категории
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
Всего комментариев 22
Комментарии
  1. Старый комментарий
    при помощи специальных программных инструкций, заложенных в шрифтовой файл
    интересно было бы узнать при помощи каких инструкций
    Запись от za5 размещена 29.09.2012 в 13:49 za5 вне форума
  2. Старый комментарий
    Аватар для SlavAz
    интересно было бы узнать при помощи каких инструкций
    Сейчас, как рас разбираюсь во всем этом. Тонкостей уйма, но результата стоит того. Будет резонанс - напишу и сюда.
    Запись от SlavAz размещена 29.09.2012 в 14:52 SlavAz вне форума
  3. Старый комментарий
    Аватар для Evg
    Цитата Сообщение от SlavAz
    Будет резонанс - напишу и сюда.
    Напиши, а то статья получается незаконченная
    Запись от Evg размещена 03.10.2012 в 09:01 Evg вне форума
  4. Старый комментарий
    Аватар для Илья Федин
    Ну а как пользоваться ей - совсем другая история. Будет интересно - напишу.
    Очень интересно как же сделать её плавненькой!
    А может есть шрифт в котором всё плавненькое???
    Запись от Илья Федин размещена 27.10.2012 в 18:23 Илья Федин вне форума
  5. Старый комментарий
    Аватар для programina
    Цитата Сообщение от za5
    при помощи каких инструкций
    Мне кажется они запатентованы и просто так не получится посмотреть инструкции.
    Запись от programina размещена 27.10.2012 в 22:57 programina вне форума
  6. Старый комментарий
    Аватар для SlavAz
    Мне кажется они запатентованы и просто так не получится посмотреть инструкции.
    Нет, на самом деле проблема в софте. Я нашол только одну вменяемую программу способную редактировать хинтинг. Но создавать в ней шрифт - мука. Собственно статья на подходе. Выкрою ещё пару часиков, доделаю и выложу.
    Запись от SlavAz размещена 28.10.2012 в 00:20 SlavAz вне форума
  7. Старый комментарий
    Аватар для Илья Федин
    SlavAz, так когда же статья выйдет?
    Запись от Илья Федин размещена 05.12.2012 в 00:35 Илья Федин вне форума
  8. Старый комментарий
    Аватар для Илья Федин
    А скоро эти пару часиков пройдут?
    Запись от Илья Федин размещена 02.01.2013 в 15:33 Илья Федин вне форума
  9. Старый комментарий
    Аватар для SlavAz
    Илья Федин, научись читать, что бы задавать правильные вопросы. Впрочем тебе этого никогда не узнать.
    Запись от SlavAz размещена 02.01.2013 в 20:52 SlavAz вне форума
  10. Старый комментарий
    Аватар для Илья Федин
    SlavAz, ???
    Запись от Илья Федин размещена 05.01.2013 в 17:35 Илья Федин вне форума
  11. Старый комментарий
    Аватар для Илья Федин
    Я жду
    Запись от Илья Федин размещена 12.01.2013 в 15:49 Илья Федин вне форума
  12. Старый комментарий
    Аватар для SlavAz
    А мне плевать на тебя. Брысь с моего блога.
    Запись от SlavAz размещена 12.01.2013 в 15:51 SlavAz вне форума
  13. Старый комментарий
    Нет, на самом деле проблема в софте. Я нашол только одну вменяемую программу способную редактировать хинтинг. Но создавать в ней шрифт - мука. Собственно статья на подходе. Выкрою ещё пару часиков, доделаю и выложу.
    а зачем тогда про пару часиков упоминать было
    Запись от za5 размещена 12.01.2013 в 15:58 za5 вне форума
  14. Старый комментарий
    Аватар для SlavAz
    а зачем тогда про пару часиков упоминать было
    глупый вопрос. Очевидно я ещё не выкроил пару часиков, чтобы закончить. Я же не писал, что через 2 часа выложу.
    Запись от SlavAz размещена 12.01.2013 в 15:59 SlavAz вне форума
  15. Старый комментарий
    ладно, напомним через год)
    Запись от za5 размещена 12.01.2013 в 16:09 za5 вне форума
  16. Старый комментарий
    Аватар для SlavAz
    ладно, напомним через год)
    О, можете не утруждать себя.
    Запись от SlavAz размещена 12.01.2013 в 16:14 SlavAz вне форума
  17. Старый комментарий
    Цитата Сообщение от SlavAz
    О, можете не утруждать себя.
    Ничего, выкрою 2 минуты.
    Запись от za5 размещена 12.01.2013 в 16:17 za5 вне форума
  18. Старый комментарий
    Интересная информация. Впервые сталкиваюсь. Надеюсь на продолжение.

    Кстати, бытует мнение, что нечетные значения шрифтов для кириллицы, к примеру 11, 13, 15 px смотрятся лучше, чем четные - может, имеет отношение к этим управляющим инструкциям и алгоритмам сглаживания? Или это просто миф?
    Запись от Taatshi размещена 12.01.2013 в 22:22 Taatshi вне форума
  19. Старый комментарий
    Аватар для SlavAz
    Кстати, бытует мнение, что нечетные значения шрифтов для кириллицы, к примеру 11, 13, 15 px смотрятся лучше, чем четные - может, имеет отношение к этим управляющим инструкциям и алгоритмам сглаживания? Или это просто миф?
    Миф. Все зависит от векторного начертания символа (вдруг канделябры всякие) ну и конечно же сам хинтинг.
    Запись от SlavAz размещена 12.01.2013 в 22:24 SlavAz вне форума
  20. Старый комментарий
    Аватар для Илья Федин
    Всё понятно, пойду тогда в поиск
    Запись от Илья Федин размещена 12.01.2013 в 23:29 Илья Федин вне форума
 
Новые блоги и статьи
Когда логика программы не спасает от человеческих ошибок
Maks 18.08.2026
В последнее время всё чаще и чаще сталкиваюсь с таким явлением, как абсолютная невнимательность (или глупость) пользователей. Проявляется это чаще всего на работе в коллективе. Допустим, человек с. . .
Лето уходит
kumehtar 17.08.2026
Мысли в слух
kumehtar 17.08.2026
Забавно, насколько сейчас стала доступна информация. Например о магии, духовном развитии, медитациях, и других подобных направлениях, ранее зачастую тайных, передаваемых от учителя к ученику. Хотя. . .
Перемещение строк из ТЧ в другой документ с учетом текущего пробега
Maks 17.08.2026
Реализация из решения ниже выполнена на примере нетипового документа "Автозапчасти", с ТЧ "Шины". За основу взят алгоритм отсюда: https:/ / www. cyberforum. ru/ blogs/ 359708/ 10838. html Задача: . . .
Саморегулирующийся социальный контракт для сервера cross-section.
Hrethgir 14.08.2026
С кодом конечно таких глубоких размышлений пока не было, впрочем я уже привык к алгоритмизации. Суть предмета записи: снова в диалоге с нейросетью (я взял пока себе ник для учётки админа - Rector). . . .
Часы электронные
Uhbif79 12.08.2026
Выкладываю программу часов. Программа позволяет: 1. Использовать системное время и дату, 2. Есть возможность вводить время и дату вручную. 3. Реализованы 2 будильника: начало и конец рабочего дня. . . .
Часы с будильником на основе класса QLCDNumber
Uhbif79 12.08.2026
Всем добрый день, выкладываю программу часов с будильником на основе класса QLCDNumber. Здесь я пробовал самостоятельно создавал классы, впервые столкнулся с видимостью переменной одного класса из. . .
Установка MinGW GCC 16.2 и CMake
8Observer8 10.08.2026
VK Видео: https:/ / vkvideo. ru/ video-240781534_456239017 YouTube: eY5-5PyI9NM Текстовая версия
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru