15 ноября 2008 в 21:23

Готовим макет для клиента. Часть II: Если гладить, то как?

Готовим макет для клиента. Часть II: Если гладить, то как?


Часть I: Гладить или нет?
Часть II: Если гладить, то как?

Итак, в первой части мы рассмотрели доводы «за» и «против» экранного сглаживания. Теперь давайте обратимся к практическим примерам и поговорим о некоторых тонкостях подготовки макета для демонстрации заказчику.


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

Кстати, в некоторых местах могут всё-таки встретиться и макеты без сглаживания, но в таком случае они почти всегда уменьшены в масштабе (до 50-70% от первоначального размера). Их легко отличить, поскольку макеты с текстом без сглаживания при уменьшении по методу бикубической интерполяции выглядят значительно хуже тех же макетов, где сглаживание было включено. Сравните первый (был без сглаживания) и второй (антиалиасинг включен) образцы (уменьшение до 70%):

image

image

И даже если вас не убеждает опыт известных студий, и вы по-прежнему твёрдо убеждены, что HTML-текст должен оставаться без сглаживания, всё равно будет нелишне ознакомиться с некоторыми из приведённых ниже примеров.

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

Короче говоря, вам нужно делать макет сразу в графическом редакторе. Несмотря на то, что сейчас много хороших редакторов с различными возможностями (GIMP, PhotoImpact, PhotoPaint, Fireworks и т.п.), мы будем рассматривать примеры на основе самого популярного в среде веб-дизайнеров редактора — Adobe Photoshop.

В этой программе отсутствует имитация сглаживания по типу ClearType, и причина этого детальна описана здесь в разделе «Ограничения ClearType». Поэтому потребляем то, что дают.

Работающие с этой программой, знают, что для текста предусмотрено пять видов сглаживания: None (полностью отсутствует), Sharp (резкое), Crisp (жёсткое), Strong (сильное) и Smooth (мягкое):

image

Применительно к тексту это выглядит следующим образом:

image

Сразу напрашивается несколько выводов:
  1. Режим Strong нам вряд ли может быть полезным, ибо делает текст излишне насыщенным, особенно в жирном начертании. Но в определённых случаях можно использовать и его.
  2. Режим None мы тоже будем избегать. Достаточно взглянуть на то, как растеризуются буквы «и» и «м» в обычном и жирном начертании. Во всех видах сглаживания эти буквы существенно отличаются толщиной штриха, как и должно быть в реалистичной типографике. При отсутствии сглаживания на всех кеглях буква «и» оказывается практически одинаковой в обычном и жирном начертаниях (лишь становится чуть толще диагональный штрих), да и с «м» не всё в порядке. Если вас устраивает такой вариант, продолжайте выключать антиалиасинг. Однако, если вы предпочитаете ожидать на экране от шрифта адекватного поведения (жирные начертания более насыщенные в штрихах и т.п.) — подберите для себя оптимальный вид сглаживания.
  3. В режиме Sharp буквы растеризуются несколько отличным способом, нежели чем в трёх других вариантах антиалиасинга. Это заметно на увеличенных фрагментах букв «ш» и «р». В случае Sharp при общей условной толщине штриха в 2 пикселя нижний штрих на «ш» остается однопиксельным, тогда как, например, в Crisp все штрихи стремятся к одинаковой толщине. В режиме Sharp криволинейные участки получаются менее округлыми, что хорошо видно на примере буквы «р». Также в режиме Sharp не очень хорошо смотрится текст, набранный крупными кеглями (14pt и выше). Зато текст 11pt читается более-менее сносно, а мелкий шрифт в 9 пунктов выглядит самым наилучшим образом. Также субъективно кажется, что курсивное начертание на 11pt читается лучше, чем в остальных примерах. В целом текст выглядит ярче и сочнее, чем в других режимах (не считая Strong).
  4. В режиме Crisp лучше всего выглядят крупные заголовки, да и основной текст неплохо смотрится. Кстати, в этом режиме большинство букв, состоящих лишь из горизонтальных и вертикальных штрихов («г», «п», «т» и т.п.), не сглаживаются вовсе. Правда, мелкий текст и курсив выглядят хуже, чем в случае Sharp.
  5. Режим Smooth напоминает Crisp, но буквы приобретают больше «пушистости» по краям. Кстати говоря, в ранних версиях Photoshop было лишь два типа сглаживания — None и Smooth. И, возможно, одна из причин нелюбви дизайнеров к сглаженным текстам кроется именно в этом, поскольку буквы в режиме Smooth выглядят чаще всего наиболее размытыми. Лишь в версии 5.5 добавилось ещё два типа антиалиасинга (а Sharp появился ещё позже). Однако, в определённых случаях нам может пригодится и режим Smooth.

Теперь вернёмся к нашему примеру, посмотрим на страницу сайта Intel. Это будет нашим эталонным изображением:

image

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

Итак, используя инструмент Type Tool и палитру Character, я сделал несколько текстовых слоёв двух разновидностей: линейных для заголовков (простой щелчок инструментом Type Tool на макете) и блочных для абзацев (щелкнуть и, не отпуская кнопки, выделить прямоугольную область нужного размера для будущего текста).

Наконец, я стёр тексты на слое исходного изображения. При отключении созданных вручную текстовых слоёв это будет выглядеть так:

image

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

Режим Sharp:

image

Отлично! Практически весь текст хорошо читается, буквы выглядят чёткими, а «пушистость» не бросается в глаза. Однако, заголовки в боковых колонках выглядят чересчур насыщенными и как-то не достаточно округло.

Режим Crisp:

image

Основной текст стал чуть более замыленным, зато заголовки, набранные жирным начертанием, смотрятся куда лучше.

Режим Strong:

image

Хотя в этом определённо что-то есть, всё же излишняя насыщенность штрихов снижает уровень реалистичности по сравнению с оригинальным скриншотом и бросается в глаза. Жирные начертания стали выглядеть и вовсе как-то грязно. Зато именно в этом режиме наиболее близко к оригиналу выглядит надпись крупным кеглем (более 18pt в нежирном начертании).

Режим Smooth:

image

В данном случае текст оказался наименее насыщенным, а потому выглядит блекло и как-то неубедительно. К тому же во многих местах обнаружилась излишняя замыленность. Хотя, кому-то именно этот вариант покажется наиболее приемлемым.

Итак, однозначно оптимального и близкого к оригиналу варианта нет. Но что мешает нам сделать комбинацию из различных методов?

Вот что у меня получилось:

image

Основной текст — в режиме Sharp. Подзаголовки, набранные жирным шрифтом — в режиме Crisp. А большой заголовок «Лидерство в области технологий» — в режиме Strong.

Конечно, точно воспроизвести вид как в броузере вряд ли удастся. Но, применяя подобную методику, я получил более-менее похожую версию. Сравните оригинал и этот комбинированный вариант. Приглядевшись, вы обнаружите какие-то мелкие несоответствия. Но если смотреть невооружённым глазом, оба макета кажутся идентичными.

А что же с режимом сглаживания None? Давайте включим его:

image

Стоп. Что случилось с двумя текстовыми блоками? Они странным образом наползают на другие места макета. Увы, но это досадливая особенность шрифта Verdana при растеризации без сглаживания. У других шрифтов подобных проблем не существует, или они не столь значительны. Помните всегда об этом и учитывайте тот факт, что текстовые блоки, создаваемые вами с Verdana без сглаживания, на мониторах с антиалиасингом могут оказаться меньше по высоте, и наоборот.

Менять тип сглаживания, тип шрифта, а также другие атрибуты для всех текстовых объектов в макете можно легко всего лишь при помощи трёх шагов:
  1. Выберите любой видимый текстовый слой в палитре Layers.
  2. Выполните пункт в меню Select > Select Silimal Layers. Теперь у вас выбраны все без исключения текстовые слои.
  3. В палитре Character выберите требуемый параметр. Например, смените сглаживание с Sharp на None.


Не правда ли, удобно? Действительно, прежде чем показывать макет клиенту, следует попробовать различные варианты. Например, заменить Verdana на Arial, увеличить кегль (применится ко всем блокам, но вы сможете оценить изменения для какого-то конкретного). Экспериментируя подобным образом, вы сможете составить для себя список шрифтов, размеров и видов растеризации в каждом конкретном случае. Всего за каких-нибудь несколько десятков минут вы определите оптимальные для вас виды отображения различных блоков. Остается только опытным путём установить какие из подходящих способов максимально соответствуют свёрстанным аналогам. Полагайтесь на собственный вкус и интуицию, и ваши макеты могут существенно обогатиться за счёт более гармонично подобранных атрибутов отображения шрифтов.

Предположим, я решил в нашем примере вместо Verdana попробовать использовать какие-то другие варианты. И вот что у меня получилось:

image

  1. Крупному заголовку («Лидерство в области технологий») был назначен шрифт Arial и режим сглаживания Smooth (он в данном конкретном случае оказался наилучшим). То же самое я проделал с боковыми подзаголовками.
  2. Основной текст остался без изменений — Verdana 11pt, Sharp.
  3. Для списка ссылок был использован Arial Italic 11pt, Sharp.
  4. Для текста внизу справа была выбрана гарнитура Corbel 11pt, Sharp.


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

Реально же улучшения можно увидеть только после использования всех мер в комплексе (доработать отступы, подобрать интерлиньяж и т.п.), но об этом мы поговорим чуть позже.

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

Не переключайтесь! ;-)

NB. Хотелось бы снова обратиться к сторонникам отключенного сглаживания, рьяно доказывающим превосходство этого метода. Я, ориентируясь на личный опыт, подразумеваю заказы только с нормальным бюджетом, а не какие-то поточные работы, выполненные за бесценок по меркам ценообразования в IT-индустрии. И априори полагаю, что клиент — персона обеспеченная и продвинутая, так что у него имеется техника адекватного уровня, и никогда — НИКОГДА — не возникает вопросов относительно того, что текст сглажен. Напротив, если он увидит макет с несглаженным текстом, то возникнут неприятные комментарии. Я с такими случаями сталкивался неоднократно, потому для себя вопрос о сглаживании закрыл раз и навсегда. В статьях я предположительно обращаюсь к новичкам и профессионалам, которые способны понять преимущество описанной методики. Если вы с этим не согласны, то мои статьи — не для вас, лучше не читайте продолжения. И ещё относительно дальнейшей работы с верстальщиком. Утверждение о том, что верстальщику обязательно надо показывать, что несглаженный текст надо верстать в HTML, а сглаженный — оставлять графикой, — нелепо и безосновательно. Мне, вероятно повезло, и все верстальщики, с которыми мне довелось работать, люди образованные и разбираются в основах типографики. А потому без всяких вопросов отличают в макете текст, набранный «верданой» от, скажем, шрифта Futuris. Если вы — верстальщик, которому нужно непременно указывать где как верстать, значит вам пора устроить себе повышение квалификации, и научиться различать основные шрифты. Да и к тому же лично в моей практике надписи, выполненные графическими изображениями, почти не встречаются (за исключение логотипа да парочки слоганов в шапке), а толковые верстальщики практически один-в-один переносят в HTML то, что было сделано в Photoshop. Быть может, и вам стоит поискать подобную гармонию во взаимоотношениях дизайнер-верстальщик?
+51
2696
116
despoth 18,8

Комментарии (71)

+17
spaceemangrechko, #
чувак, ты реальный маньяк :)
НЛО прилетело и опубликовало эту надпись здесь
НЛО прилетело и опубликовало эту надпись здесь
+4
flacon, #
С появлением Sharp пользуюсь им в 90% случаев, и не заморачиваюсь. :)
+3
Nightquest, #
Мне не нравится Шарп у маленького ариала, например:
0
flacon, #
На вкус и цвет… мне по душе первый вариант.

Анализ тем не менее заслуживает уважения.
0
Nightquest, #
Он возможно симпатичнее выглядит, но не похож на ариал.
0
flacon, #
Хм, не думал, что целью статьи было достижение узнаваимости гарнитуры на веб-страницах.
+6
sitehound, #
Ты проделал много работы. Молодец! В свое время я это опытным путем изучал, подгонял. Была бы такая статья раньше — много бы времени сэкономил. Статья написана на уровне коммерческого журнала.
+6
Devich, #
А что, действительно еще у кого-то стоит вопрос о необходимости сглаживания?
0
nicothin, #
вот и я удивляюсь…
+1
maDByte, #
Никогда не пользуюсь в контентных шрифтах сглаживанием. И вообще, не пользуюсь Виндовой Сафари только из-за того, что сглаживание там не отключить.
+1
maDByte, #
а что мы минусуем-то? ) я же просто мнение своё высказал.
+1
4g3n7, #
Потому что что есть «контентный шрифт»?

Я представил себе 18-пиксельный жирный Ариал чёрного цвета и несглаженный, и мне стало плохо!

Может быть имеется в виду шрифт эдак 9-13 пикселов? Тут да, можно еще поспорить, сглаживать или нет.

Долго объяснять, почему меряю в пикселах. Вкратце — удобно и с помощью 62.5% в емах нормально эмулировать.
НЛО прилетело и опубликовало эту надпись здесь
0
smmurf, #
Ну не знаю, как у вас так получается, но большие объемы текста предпочитаю читать на дешевом мониторе именно из Сафари, как раз благодаря сглаживанию. Предпочитаю «легкое».
А Сафари — говно не из-за сглаживания ли? Вроде ничего страшного в нем нет…
НЛО прилетело и опубликовало эту надпись здесь
+2
Suomi, #
Твое мнение кому-то не нравится. Вот и минусуют. Кто-то может так же написать Винда говно, маки рулят. И ему наставят минусов. А он просто скажет: «А что такого? Я просто мнение свое высказал»
–2
maDByte, #
Ну тогда это получается детский сад, а не дискуссия. Ставить минусы нужно тому, кто не прав. А тут правых нет, либо нравится, либо не нравится.
+1
Suomi, #
Так я и могу считать, что он не прав. Что его мнение неправильное.
–3
Zibba, #
Иногда лучше жевать чем говорить :)
/> минусы
+3
NecroHill, #
отличная статья. буквально 3 дня назад занимался поиском оптимальных комбинаций сглаживаний. остановился на шарп, чтоб не заморачиваться. хотя к заголовкам тоже Smooth применяю, бывает.
я ожидал что в CS4 появится метод сглаживания «как в браузере»… и нифига… (о кнопке «Сделать красиво» не мечтал)
+2
Nimnul, #
Спасибо за обзоры.
Почитал статейки и включил ClearType в XP-шке :)
+1
Fade, #
Забавно, но поучительно. Хотя, у меня лично пока такой проблемы нет, т.к. для макетов использую векторный редактор Xara, у которого экранное сглаживание почти идеальное (почти, т.к. оно отличаеться от сглаживания браузеров в лучшую сторону и приходиться вручную «ухудшадь» макеты, чтобы добиться совпадения).
+4
4g3n7, #
Я шарпом пользуюсь.
Бывает иногда играюсь с остальными режимами сглаживания, но (о, чудо!) практически всегда выбираю шарп :)

А автор маньяк, да :)
+1
Grayscale, #
Статья хорошая, еще раз убедился в своем древнем выборе. Хотя, на макетах часто для малоразмерных шрифтов не использую сглаживание (например, лично для меня, georgia в 9-12pt выглядит лучше и как то реалистичней в режиме none).
+5
404, #
Кроме Photoshop, макеты для web можно готовить в Fireworks. И вот здесь есть такая вещь, как Custom Anti-aliasing:




не хотите с ним поиграться, выяснить его достоинства и недостатки?
0
energel, #
Вау… Ну всё, теперь точно придется перелезать в fw…
0
nicothin, #
с большим нетерпением жду статьи о шрифтовых сочетаниях :)
0
egorinsk, #
Автор, спасибо огромное)) Очень познавательный материал, наконец то все написано и показано в картинках) Правда, у меня почему-то Опера уменьшила картинки, и они все стали одинаково замыленными, приходится открывать их отдельно((

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

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

p.s. А strong — это явно Линуксовое сглаживание!

p.p.s. Хуже всего выгляджит уменьшенный несглаженный шрифт(
НЛО прилетело и опубликовало эту надпись здесь
0
egorinsk, #
Во всех нормальных ОС вообще-то сглаживание уже включено. Так что ваш макет скорее будет нереалистичным. А если вы сделаете часть картинок, например кнопки, с несглаженным текстом, он будет некрасиво выделяться.
–1
despoth, #
Очевидно, вы не читали статью с самого начала, с первой части. Иначе бы не было этого поста.
НЛО прилетело и опубликовало эту надпись здесь
НЛО прилетело и опубликовало эту надпись здесь
+2
Nightquest, #
Ужас просто.

«Во первых верстальщику будет понятно, что заголовок — текст, а не IMG картинка.»
Верстальщику-идиоту, который не смотрит на слои в фотошопе?
НЛО прилетело и опубликовало эту надпись здесь
–1
despoth, #
> Во первых верстальщику будет понятно, что заголовок — текст, а не IMG картинка.
См. NB в конце статьи.
–2
srDiGer, #
Молодец! Жду продолжения «банкета». И ты реально маньяк :)
0
slavik, #
не в тему, но вопрос давно мучает — давно заметил и не знаю как избавиться: в firefox-е (с предпоследних обновлений 3-ей версии) в блоке текста с align:justify, обычный пробел растягивается пропорционально, а неразрывный —  , так и остается стандартной ширины, что делать? кто-нибудь знает?
НЛО прилетело и опубликовало эту надпись здесь
0
despoth, #
Никогда не использовать justify. В газетах и журналах этот тип выключки работает превосходно, но на сайте всегда смотрится чудовищно. По причине отсутствия системы расстановки переносов, возможности тонко настраивать зоны сужения или расширения трекинга, а также из-за скуднейшего набора эрканных шрифтов. То, что свёрстано в журнале при помощи Caslon или Baskerville при включении полной выключки на экране в исполнении Times New Roman страшно удручает.
НЛО прилетело и опубликовало эту надпись здесь
НЛО прилетело и опубликовало эту надпись здесь
–1
despoth, #
Я сам удивлен. Пришел кто-то (или несколько кого-то), что было в нуле — опустил в минусА, что было с плюсами — опустил до нуля. На многих комментариях. Я вообще раньше не ставил практически минуса, в основном только плюсы. Минуса в крайне редких случаях — грубиянам и пошлякам. В последнее время воздерживаюсь от вообще каких бы то ни было оценок. Но вот удивляет и удручает поведение людей: втихаря вот так вот мелочно мстить или злобу свою проявлять. Как-то это все недостойно, подленько.
0
porqz, #
На то он и неразрывный пробел.)
+2
Nightquest, #
Давным-давно так. Выход — не использовать идиотский justify. Это зло. Нет, правда.
0
snch, #
а кто вам сказал, что он должен вести себя по другому?
–1
serjio, #
капец) не жалко же время на размусоливание сглаживаняи в двух статьях.
предыдущие статьи повеселее были.

что меня волнует и что в этой статье толком не было затронуто — это крайне хуёвое сглаживание в фотшопе, на мелких шрифтах оно очень далеко от реального экранного сглаживания (cleartype в частности) и не понятно как с этим бороться (где-то промелькнула ссылка на плагин, который во-первых платный, во-вторых с кирилицей плохо дружит)…

при чём это выглядит гораздо менее реалистично и более херово чем если мы показываем клиенту просто макет без сглаживания.
–1
serjio, #
т.е. понятно, что именно cleartype имеет смысл только для lcd, но даже простое сглаживание один хрен выглядит по другому, можно убедиться в этом заскриншотив это окно и попробовав написать такой же текст в фотошопе.
–1
Aux, #
Как верстальщик, я хочу заметить, что верстальщику шаблон надо отдавать в следующем виде:

* весь сглаженный текст идёт в результате картинкой;
* весь несглаженный будет в результате текстом.
+1
Hitryi_Pryanik, #
А если абзац с рыбой сглаженным увидите, тоже в картинку экспортить будете? Молодцом, так держать!
–1
Aux, #
Когда я работаю с незнакомыми дизайнерами я всегда выдвигаю такие условия. Если он сгладил весь текст — чтож, сам идиот.
–1
despoth, #
См. NB в конце статьи.
+1
Aux, #
Это безусловно здорово, когда дизайнер понимает что будет делать верстальщик, но, к сожалению, некоторые дизайнеры далеки от этого. И с ними тоже иногда приходится иметь дело. И если подобный чел хочет видить одну вердану картинкой, а другую текстом, то пусть лучше готовит шаблоны так, чтобы у меня не возникало вопросов. К тому же иногда «тексты на картинках» бывают именно текстами, а не картинками. Вобщем, лучше раз и навсегда определится с тем, что сглаживаем, а что нет, чем потом бегать к горе-дизигнеру и спрашивать — а это шозанах?
–1
despoth, #
Любой верстальщик — немного дизайнер. И у него не должно быть никаких вопросов по поводу шрифтов. Если такие вопросы есть, значит верстальщик или капризный, или недостаточно образованный. Попробуйте выключить претенциозность, а включить знания и умения, и вы вообще перестанете задавать вопросы дизайнеру, равно как и он вам. Уверяю — производительность увеличится, а макеты станут лучше.
0
Aux, #
Ну я иногда верстальщик, но ни разу не дизайнер. И отличить вердану от тахомы не могу. И нах оно надо?
0
despoth, #
Ты прав. Тебе не надо.
0
multik, #
вопрос может не по адресу но всё же — как сверстать текст в режиме сглаживания?
+1
Hitryi_Pryanik, #
По поводу макета верстальщику: его банально нужно структуировать, создавая группы и подгруппы в иерархии слоёв. Когда слоёв под сотню, кидать их в одну ленту по меньшей мере неразумно и работу это тормозит. Что говорить, если уже готовых групп иногда набирается под два десятка
+2
Hitryi_Pryanik, #
Я почитал, посмотрел примеры. Маньячество — эт конечно хорошо в профессионализме. Я тоже люблю поманьячить. Возможно поэтому у меня не фотошоп.

Так вот у меня методика попроще: верстаем всё сглаженно, потом уже на финальной картинке выделяем области разного текста и подгоняем точную меру резкости, используя уровни (levels) вручную, если уж чильно придирчивый заказчик. А вообще хорошему макету и вёрстке столько шаманства не требуется для показа заказчику, ведь итоговый сайт может выглядеть и хуже у него в браузере, тогда есть вероятность проблем.

А для портфолио можно и поманьячить, вылизывая весь дизайн. Однако честнее сделать скриншот и показывать именно его :)
+1
energel, #
Настоящий сенсей по вырезанию человечков из правды-матки… :)
Всё больше благодарен Хабрахабру — инкубатору хороших авторов и, соответственно, отличных статей!
Спасибо.
+1
xmagnusx, #
ещё раз спасибо, жду продолжения.
ещё есть проблема с подчеркнутым текстом в режимах сглаживания текста.
+1
Chesheer, #
Мое пятикопеечное imho насчет того что верстать текстом, а что графикой: просто выделяю графические слои цветом в панели слоев и все. Дополнительные замечания по верстке я всегда включаю в сам шаблон с использованием note — так сразу все под рукой и не забудется.
–1
gauss, #
гр. Колпиков, после просмотра вашего портфолио несколько странно читать ваши статьи по типографике и дизайну.
0
despoth, #
Дык и не читайте, я ж вас к этому не принуждаю.
А что до портфолио, то тут дело вкуса. Нравится — не нравится. Не следует потакать банальной вкусовщине. Тем более, что в оном портфолио нет ни одной работы старше 2006 года. Так что не будем разводить грязные инсинуации, последите лучше за своими работами.
–1
despoth, #
Какие-то озлобленные клоуны понаставили на все мои комментарии минусов. Детский сад :)
0
EugeneKudashev, #
Благодарю за ценный материал, обе части было прочитать очень интересно. Вы планируете писать ещё статьи о типографике?
0
despoth, #
В планах у меня следующий материал:
1. Окончание статьи о сглаживании третьей частью с окончательным анализом всех вариантов для основных веб-шрифтов.
2. Окончания цикла статей «Веб-типографика сегодня» шестой частью со схожим материалом, но там акцент будет не на выборе типа сглаживания для разных шрифтов, а анализ и поиск оптимальных шрифтовых сочетаний для наборов заголовок-подзаголовок-текст-мелкий текст.
3. Продолжения статей о подготовке макета для клиента (пока задумки на 3-4 части, может будет больше) — о том, как в готовом лэйтауте лучше расставлять блоки, как манипулировать абзацными атрибутами (когда шрифтовые атрибуты выбраны), как наилучшим образом готовить «рыбу», а также как делать пост-продакшн драфтов.
0
sashock, #
Спасибо, за статью, хорошая работа!
Сам использую сглаживание только в заголовках и текстах больше 18 pt (а в некоторых шрифтах — 17 pt), т.к. все же сглаживание в фотошопе мелких шрифтов меня не устраивает, хотя в системе использую ClearType и там все шрифты выглядят классно в любых кеглях.
0
KynuMHe6y6EH, #
А как заставить винду гладить по-клиртайповски только указанные шрифты только указанного диапазона кегля?

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