Выбор шрифтов для web

    Когда я изучал основы веб дизайна однажды со слезами на глазх узнал, что мой любимый шрифт Hellios никто не увидит на сайте кроме меня, да и не только его, а много красивых типографических шрифтов.

    Операционные системы диктуют определённые нормативы дизайнерам, отображая шрифты уже имеющиеся в их базе данных, незнакомые шрифты они игнорируют, заменяя их стандартными. Конечно, есть различные расширенные реализации шрифтов, но в данном контексте мы постараемся сфокусироваться на выборе оптимальных шрифтов для распространённого стандарта HTML.

    image

    При интерпретации некоторые браузеры сглаживают шрифты, другие оставляют угловатости. Иногда, для лучшей читаемости более мелкий шрифт не сглаживается, а более крупный или переходящий в жирный – сглаживается. Конечно при базовом построении шрифт-концепции нужно рассматривать именно не сглаженный текст.

    Я приведу сводную таблицу шрифтов которые поддерживаються во всех версиях ОС Windows & Mac

    image

    Как видно из таблицы, не все шрифты одинаково полезны, а именно при одном размере шрифта он может быть либо крупнее либо вообще мелким, даже нечитабельным.

    Для упрощения выбора шрифта я создал PSD файл в котором можно без особых усилий посмотреть как будет выглядеть нужный вам шрифт. Размеры шрифта от 9 до 17 pt Bold и Normal. В файле приведены все поддерживаемые шрифты в большинстве ОС. Так же возле каждого шрифта есть пометка о дате его введения в ОС.
    Я постарался расположить шрифты в последовательном порядке относительно их стиля. Слева – направо более строгие – книжные, рукописные, технические, и комичные.

    image

    Всё довольно просто скачайте PSD файл со шрифтами ( ссылка ) –
    выбирайте нужный слой-шрифт > перетаскивайте его к себе в макет.
    Надеюсь это упросит и ускорит вашу работу. Спасибо за внимание!
    Поделиться публикацией
    AdBlock похитил этот баннер, но баннеры не зубы — отрастут

    Подробнее
    Реклама

    Комментарии 7

      +3
      какая-то страшненькая сводная таблица, в оригинале лучше
        0
        @font-face и картинки
          0
          Таблица шрифтов в jpg, забавно.
            +1
            Не обижайтесь, но в следующий раз имеет смысл изучить, что уже есть на хабре по этому поводу. Был отличный материал про Web типографику, берите пример :)
            0
            Простите, это мой первый пост старался как мог )))

            Таблица шрифтов в ПСД, а не в jpg, это превью
              +1
              незнакомые шрифты они игнорируют, заменяя их стандартными.

              В некоторых случаях чуть меньше чем все перечисленные в Вашем файле :)
              Как быть, если у меня совсем другие шрифты? DejaVu, Sans, Lucida Sans, Nimbus, Monospace?
              Серьёзно, как сделать так, чтобы страница отображалась хотя бы примерно одинаково на разных системах?

              Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.

              Самое читаемое