Заставить текст вести себя в Photoshop так же, как в HTML/CSS

Я выкладываю шаблон в PS 1280x700 px 300dpi (я знаю, что web 72, но мне нравится больше четкости при работе в PS).

Моя главная проблема заключается в том, как отображается текст; Я использую Helvetica Neue Light 15px, и он получается довольно неровным. Есть ли способ сгладить / использовать его в качестве шрифта вместо того, чтобы следовать пиксельной сетке, чтобы он выглядел так, как в Интернете?

Мой второй вопрос: при настройке навигации есть ли лучший способ разделить текстовые заголовки? На данный момент я либо просто использую пробел 5 или 6 раз, чтобы разбить их (что очень плохо, когда вы хотите вернуться и внести изменения, поскольку вам нужно изменить их все), либо я делаю каждый заголовок текстовым слоем и разместить их в сетке, опять же, не очень удобно, когда я хочу внести изменения.

Ваш "второй вопрос" действительно не связан с первым. Это законный вопрос, поэтому, пожалуйста, удалите его отсюда и сделайте его отдельным вопросом, чтобы мы могли на него ответить.
@lauren ispum, подойдет
Изменение DPI изображения с фиксированным размером в пикселях не улучшает или снижает «четкость». Что касается сглаживания шрифта, это опция в палитре шрифтов. Всегда есть вариант.
@ da01 Есть ли метод сглаживания, который предпочтительнее, чтобы он выглядел так, как в Интернете, или это нужно делать только на глаз?
@sem нет «одного способа», как это выглядит в Интернете. Он будет отличаться от устройства к устройству, от браузера к браузеру, от операционной системы к операционной системе, от шрифта к шрифту.

Ответы (2)

хм, хорошо, в параметрах персонажа, когда текст выделен, есть параметр «Сглаживание», который вы можете изменить с гладкого на резкое, четкое, сильное и ничего.

Но это немного странно, что вы получаете эту проблему.

Убедитесь, что вы смотрите на текст в масштабе 100%. Я иногда замечал это в своих проектах, особенно когда я использую OpenType PostScript (файлы otf).

Поэтому, если вы увеличиваете масштаб до 100%, сначала посмотрите, не в этом ли проблема. Кроме того, поскольку вы работаете над более крупным дизайном, вы можете уменьшить масштаб до 50 %, и вы также не получите эффект Jaggedy, но что-то среднее между ними будет...

Если ни один из них не работает, это может быть проблема с файлом. Если ни один из них не работает, то я не вижу, чтобы он работал правильно в CSS/HTML. Вы заметили, что он правильно отображается в CSS/HTML? Если да, то да, это Zoom или Anti Aliasing.

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

Удачи, приятель.

РЕДАКТИРОВАТЬ: Что касается вашего второго вопроса, зайдите в доклет / меню «Персонаж». Если он не виден справа рядом с вашими слоями, вам нужно включить его, выбрав рабочий процесс «typogrpahy» вместо «Essentials», ИЛИ перейти в главное меню и выбрать «Window> Character», после чего он должен появиться. вверх. Там же можно сделать сглаживание. Но что вы хотите сделать с этим, так это выделить заголовок и выделить первую строку следующего текста. Как только вы это сделаете, войдите в окно персонажа и измените «Интерлиньяж» (это первая опция с правой стороны. Наведите указатель мыши на него, и он скажет «Изменить интерлиньяж», чтобы быть уверенным. Это эквивалентно строке CSS). Высота.

Почти все, что вы делаете в Photoshop, в этом меню символов, вы можете делать в CSS.

Кроме того, на вашем месте я бы использовал pt (точки) для текста. Кажется, у меня всегда возникает проблема смещения с пикселями, когда я переношу дизайн в код. Баллы меня никогда не подводили.

Вы можете изменить свои линейки и весь документ для остальной части дизайна на точки, если хотите, в главном меню, в «Редактировать> Настройки> Единицы и линейки».

Бутон удачи.

спасибо, это расширено в cs5, чтобы подтвердить, что он отлично отображается в html / css, просто при работе в PS он, кажется, ограничивает текст сеткой пикселей, а не позволяет ему быть плавными линиями.
Бутон без проблем. Вы имеете в виду настоящую сетку? или просто сетка, которая была задана в начале с помощью DPI. Потому что, если вы имеете в виду только сетку, установленную в настройках, вы можете отключить ее в главном меню «Просмотр> Привязать к> Сетка».
я имел в виду сетку, установленную при создании холста, поэтому сетка 300x300 dpi

Вы можете попробовать проверить свой файл Photoshop на наличие проблем с веб-типографикой через https://www.oss-usa.com/web-preflight?promo=psd-parser.

Заставить текст вести себя в Photoshop так же, как в HTML/CSS
СпросиСетьПолитика конфиденциальности1y, 0v