После прочтения «Веб-типографика сегодня. Часть V» мне захотелось избавиться от уже приевшихся шрифтов, которые используются на большинстве веб-страниц. Было бы неплохо заменить некоторые из них (например, Arial, Verdana, Tahoma, Times New Roman, Georgia) на более современные (Calibri, Corbel, Constantia).
В любом браузере есть возможность запретить использовать указанные на странице шрифты. Но в этом случае мы получаем одинаковые шрифты везде, что выглядит довольно скушно.
Каким образом заменить один шрифт на другой? Для этого можно использовать локальный фильтрующий прокси-сервер Privoxy, настроив его описанным ниже способом.
1. Установить Privoxy. Перейти в его каталог (C:\Program files\Privoxy).
2. Найти в файле config.txt строчку filterfile default.filter. Подключить пользовательские фильтры следующим образом:
3. Создать файл user.filter с содержимым:
Этот файл определяет пользовательские фильтры, применяемые с CSS- и HTML-коду. Указанные фильтры работают следующим образом. К какдому свойству font-family и font, значение которого начинается с одного из заменяемых шрифтов, в начало списка шрифтов добавляется более интересный вам шрифт. Например,
font-family: Arial, Verdana
преобразуется в
font-family: sans-serif/*Privoxy*/, Arial, Verdana.
4. Добавить в файл user.action строки:
5. Настроить браузер, указав в качестве прокси-сервера localhost:8118.
6. Очистить кэш браузера.
7. В браузере по умолчанию задать предпочтительные шрифты.
8. Для Firefox: рекомендуется установить расширение No Squint. Оно позволит установить масштаб текста по умолчанию. Можно установить, например, 110 или 115%.
На этом примере видно, что текст отображается шрифтом Corbel, который заменил используемую дизайнерами сайта Verdana.
В любом браузере есть возможность запретить использовать указанные на странице шрифты. Но в этом случае мы получаем одинаковые шрифты везде, что выглядит довольно скушно.
Каким образом заменить один шрифт на другой? Для этого можно использовать локальный фильтрующий прокси-сервер Privoxy, настроив его описанным ниже способом.
1. Установить Privoxy. Перейти в его каталог (C:\Program files\Privoxy).
2. Найти в файле config.txt строчку filterfile default.filter. Подключить пользовательские фильтры следующим образом:
filterfile default.filter
filterfile user.filter # User customizations
3. Создать файл user.filter с содержимым:
FILTER: css-font-family Replace some font families
# 'font'
# Value: [ [ <'font-style'> || <'font-variant'> || <'font-weight'> ]? <'font-size'> [ / <'line-height'> ]?
# <'font-family'> ] | caption | icon | menu | message-box | small-caption | status-bar | inherit
# 'font-family'
# Value: [[ <'family-name'> | <'generic-family'> ] [, <'family-name'>| <'generic-family'>]* ] | inherit
s@(font-family\s*:|font\s*:\s*[a-z-]*\s*[a-z-]*\s*[a-z-]*\s*[.0-9]+[a-z%]*(?:/[.0-9]+[a-z%]*)?)\s*"?(Verdana|Arial|Tahoma|Helvetica)"?@$1 sans-serif /*Privoxy*/, $2@ig
s@(font-family\s*:|font\s*:\s*[a-z-]*\s*[a-z-]*\s*[a-z-]*\s*[.0-9]+[a-z%]*(?:/[.0-9]+[a-z%]*)?)\s*"?(Times|Times New Roman|Georgia)"?@$1 serif /*Privoxy*/, $2@ig
s@(font-family\s*:|font\s*:\s*[a-z-]*\s*[a-z-]*\s*[a-z-]*\s*[.0-9]+[a-z%]*(?:/.[0-9]+[a-z%]*)?)\s*"?(Courier|Courier New)"?@$1 monospace /*Privoxy*/, $2@ig
Этот файл определяет пользовательские фильтры, применяемые с CSS- и HTML-коду. Указанные фильтры работают следующим образом. К какдому свойству font-family и font, значение которого начинается с одного из заменяемых шрифтов, в начало списка шрифтов добавляется более интересный вам шрифт. Например,
font-family: Arial, Verdana
преобразуется в
font-family: sans-serif/*Privoxy*/, Arial, Verdana.
4. Добавить в файл user.action строки:
#######################################################################
# CSS filtering
{ +client-header-tagger{css-requests} }
/
{ +server-header-tagger{content-type} }
/
{ +filter{css-font-family} }
TAG:^CSS-REQUEST$
TAG:^(text/html|text/javascript|application/xhtml+xml|application/xml)$
#######################################################################
5. Настроить браузер, указав в качестве прокси-сервера localhost:8118.
6. Очистить кэш браузера.
7. В браузере по умолчанию задать предпочтительные шрифты.
8. Для Firefox: рекомендуется установить расширение No Squint. Оно позволит установить масштаб текста по умолчанию. Можно установить, например, 110 или 115%.
На этом примере видно, что текст отображается шрифтом Corbel, который заменил используемую дизайнерами сайта Verdana.