Как стать автором
Обновить

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

Осведомлю читателей о том, что на www.tinyurl.com/serverfonts давно предлагается ещё одно серверное решение, но на PHP сочинённое.
Я специально не упоминал в обзоре других серверных решений, так как сложно сказать насколько читателям блога Django Framework будет интересно знать о подобном решении на PHP. К тому же приведённый вами проект, по прежнему требует использования Javascript для подмены на клиентской стороне, а это именно то, от чего хотелось уйти.
А как же еврейское расовое происхождение PHP?
Спасибо, вещь вполне полезная, на мой взгляд.
Это очень круто.
Причем не говорите, что это только для тех, у кого font-face не поддерживается. Картинка еще и весить меньше может.
Это скорее очень частный случай, если бы @font-face умели бы все браузеры, придумывать подобные решения не было бы надобности: средний вес шрифта, из тех что я использовал 60-90 Кб, вес всей графики на странице примера, без оптимизации 38 Кб. На полноценном продакшен-сервере заголовков будет намного больше. Плюс не будет никаких ограничений и однажды закешированный в браузере шрифт не будет грузиться заново при появлении новых заголовков.

Так что это всё в любом случае от «бедности».
На крупных сайтах, на сайтах с огромным графическим оформлением это шрифт 90-350 кб графика 500-3000 кб
Серваку с большой посещалкой ХАНА xD
По какой причине, простите?
Ну представьте себе сайт с огромной посещалкой, и то как будет нагружаться процессор генерируя постоянно картинки?!
Вы думаете это бред? тогда задайте себе вопрос почему подобное не используется на крупных сайтах…

ps/ А вообще помню давненько верстал 5socks.net там использовал JS не так надежно зато нагрузка нулевая.
Если бы вы достаточно внимательно прочитали мою статью, вы бы могли уловить тот факт, что изображения генерируются единожды и впоследствии используются как статичные.

Да, думаю вы действительно правы, на крупных проектах подобные техники не используются, а amazon.com и nytimes.com из ссылки г-на Mithgol — это чистейшей воды случайность. =)
Автор же написал про кеширование…
Я хоть в одном слове упомянул что «Как же так!, без кеширования?!» я знаю что кеширует, я говорю мальца о другом. Что вы придрались то к этому кешированию!? я умею читать не бойтесь.
Просто таким способом не стоит генерировать начертания для текстов, которые часто меняются или персональны для пользователей. Это сугубо для заголовков и подзаголовков страниц или разделов, названий кнопок и т. п. Для интернационализации, например, сгодится тоже. Но не для динамики.
НЛО прилетело и опубликовало эту надпись здесь
На счет кеширования, если надписей мало то сойдет если нет то представьте сколько могут весить PNG 32ух битные ну да пусть мы на память щедрые (как на свою так и клиентов)… DXI фильтр который использует PNG HACK для IE при большом количестве подобных надписей просто убьет клинта (Хотя тут спорный момент у некоторых и тысячи профильтрованых надписей держит)!
НЛО прилетело и опубликовало эту надпись здесь
32-битные png, учитывая их однотонность, весят не так уж и много, а после оптимизации ещё меньше. А DX-фильтр, требующийся только для IE6, уверен, требует не больше памяти, чем explorercanvas, нужный для всей линейки IE.
Вообще-то AlphaImageLoader действительно реально «убивает» IE6 при большом количестве вызовов.

У меня на одном проекте как-то так получилось, что на странице их число достигало около 40-50 (: страница в IE6 загружалась почти 2 минуты (в IE 7 около 30 сек.) причем как я понимаю кеш тут не поможет. Пришлось «пересматривать взгляды на жизнь» XD
А кто с этим спорит? Ясное дело 40-50 подмен на странице — это слишком много для старенького Иа-Иа. При ручном подходе, я всегда стараюсь для избранных подгонять gif-ы под фон. Но диалог то о png против svg. Есть подозрение, что 40-50 объектов типа explorercanvas в IE6 сложит его не менее быстро. Но ведь задача может стоять чуть иначе: на одной странице 3-5 заголовков, а страниц стопицотмилионов.
НЛО прилетело и опубликовало эту надпись здесь
Парсера CSS у меня нет, просто в отдельном файле можно обозначить необходимые классы, подобно CSS-подходу.
НЛО прилетело и опубликовало эту надпись здесь
НЛО прилетело и опубликовало эту надпись здесь
Обязательно, в ответ на парочку разумных примеров, где требуется нечто отличное от 16-ти цветной ASCII-консоли. =)
НЛО прилетело и опубликовало эту надпись здесь
Дизайнер бывает нарисует, а заказчик утвердит — и можно долго упиваца в письмах своей веб-стандартностью, евангелистскостью и т.п. — делать всё равно придётся.
НЛО прилетело и опубликовало эту надпись здесь
А система поддерживает отрисовку ClearType, а также ОТ-фичи такие как кернинг?
Естественно, я не писал собственного рендера шрифтов. Система поддерживает всё, что поддерживает библиотека Freetype2. ClearType не умеет, только обычный AA. По-идее, кернинг должна поддерживать. Более точно на ваш вопрос, увы, ответить не могу.
Не претендую на звание самого лучшего решения, есть только пара возражений по отношению к приведённой ссылке: во-первых, .NET — это хорошо, но не так много ценителей запускать Django на IronPython, во-вторых, это скорее не решение, а техника. В остальном, чтож, я рад что есть решения лучше моего, значит мне есть куда расти и откуда заимствовать идеи. =)
Ваше решение ужасно, мы уже говорили по этому поводу.
Напишите лучше
SkAZi написал.
Право, господа, не стоит ссориться. Моя цель поделиться с теми, кому нужно, и получить фидбэк от того, кто заинтересован, а не помериться у кого длиннее и толще. Лучше ли хуже, решать не нам, а тем кто в конечном итоге будет использовать и помогать в развитии.

По теме: особой нужды в ClearType я не ощущаю, а вот ручной кернинг и альтернативное начертание последней буквы отложил на дальнюю полку памяти.
Единственная мелочь  — лучше прикрутить сюда как-то технику CSS image-replacement, ставить фоновыми картинками, чтобы при отключенных картинках был обычный текст.
С помощью последнего тега, модифицирующего контент, можно выводить полученную графику любой интересующей вас техникой. Моё кажется не стоит привязывать библиотеку к каким-то конкретным клиентским техникам. Но, думаю, неплохой идеей было бы, в качестве опции, прикрутить возможность использовать шаблон для вывода.
Добавил возможность использовать собственный шаблон вывода для остальных тегов и фильтров.
Что-то по демо-ссылке не совсем понятно внутреннее строение. Как до уровня броузера опускаются темплейтовые теги?.. Или это у меня сафари что-то не то накачал:

<span style='color:#696969; '>{% block body %}</span>
Хм, у меня 4-ка всё нормально показывает…
Под ссылкой Page source скрывается кусок кода Django-template, который использован для генерации страницы. Стили и всё не относящееся к делу я убрал, оставив только блок вывода центральной части страницы.
И после этого кто-будет говорить, что дизайнер дожен знать вёрстку ибо шрифты и т.п. Надеюсь, красивых сайтов станет больше благодаря django-headline.
НЛО прилетело и опубликовало эту надпись здесь
Да, ещё вы не сможете копировать выпадающие меню, флэш, или ролики с ётюба. Разумеется в реальной жизни мало кто будет заморачиваться с текстовой версией для тех, кому нужно скопировать, но всё же некоторые так делают. В борьбе красоты с копипастом, я на стороне браузеров, которые будут копировать alt в буфер обмена.
НЛО прилетело и опубликовало эту надпись здесь
Имхо было бы интереснее тогда уже рендерить SVG/VML (посмотрев user-agent). А то на сегодняшний день заменять экзотические шрифты растровыми картинками кажется архаизмом, учитывая возможности браузеров.

Для старых браузеров опять же можно откатываться к растровой картинке. Раз уж грузить сервер, так с максимальной пользой.
Если честно, я не вижу реальной выгоды в использовании svg, учитывая насколько для этого должна быть усложнена логика приложения: кеширование с учётом юзер-агента, разные шаблоны, разные технологии и подходы. А смысл то в чём? Просто использовать технологии поновее? Так все вменяемые уже на пороге нормально функционирующего @font-face, а для отстающих костыли и есть костыли, пытаться разогнать IE6 до возможностей Opera 10 я смысла не вижу. =)
С одной стороны решение-как-решение, но вот разбивать фразу на слова а потом заменять каждое слово на картинкой, этож кроме веса еще и отдельный запрос на сервак вроде.

PS: Когда начинаешь задумываться о таких вещах в голову в основном лезет: «я ненавижу дизайнеров» :))
Разбивать фразу на слова нужно только в случае острой необходимости, при помощи специальнообученного параметра all. По-умолчанию строка разбивается только по
, а в случае гарантированной однострочности можно вообще использовать параметр none и тогда любые разделители будут проигнорированы обработчиком.

А по поводу PS, тоже немного поофтоплю: мне наоборот интересно искать элегантные выходы из сложных ситуаций, а шаблонный трёхколоночный-Arial-Georgia-дизайн-с-шапкой порядком набил оскомину. Конечно, стрёмно работать в вёрстке из десятков разных wrapper`ов, которые нужны для всех этих закруглённых уголочков и градиентиков, а сердце постанывает при виде возможностей CSS3 и «ух, как бы я сейчас тут с его помощью!», но другой раз находишь какое-то изящное решение для нестандартной задачи и радость с гордостью просто перехлёстывает через край. =)
* по <br />
Зарегистрируйтесь на Хабре, чтобы оставить комментарий

Публикации

Истории