Photoshop межстрочный интервал. Дополнительные настройки оформления текста в фотошоп

Установка межстрочного расстояния для горизонтального текста

Межстрочное расстояние (интерлиньяж) -это расстояние между текущей строчкой текста и строчкой, расположенной над ней. У каждого символа может быть свое собственное межстрочное расстояние; наибольшее значение будет определять межстрочное расстояние для данной строки.

Рис. 17.19. Увеличенное межзнаковое расстояние в заголовке

Рис. 17.20. Выбор межстрочного интервала

Рис. 17.21. Абзацы с одинаковым кеглем, но разными межстрочными интервалами

Совет

Межстрочный интервал по умолчанию рассчитывается пропорционально кеглю. Их отношение указывается в диалоговом окне Justification (Выравнивание), которое открывается с помощью меню палитры Paragraph (Абзац). По умолчанию величина интервала составляет 120% от кегля. Например, межстрочное расстояние для кегля в 30 точек по умолчанию равно 36.

Совет

Для установки межсимвольного расстояния в тексте, который расположен по вертикали, выделите нужные символы и измените значение трекинга в палитре Character (Шрифт). Вы увидите, что текст после этого преобразится.

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

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

Совет

Сказанное выше о форматировании текста относится только к программе Photoshop. Если вы используете другие приложения, возможно, порядок действий при выборе шрифта будет иным. При создании текстов для сети Internet лучше обратиться к программе, предназначенной для Web-дизайна.

В палитре Layers (Слои) выберите нужный слой.
По желанию. Выделите одну или несколько строк, в которых будете менять межстрочный интервал. Если текст был введен в построчном режиме, то необходимо выделить всю строку. Если не выделять строки, то изменения произойдут во всем тексте.
Выберите или введите значение межстрочного интервала в палитре Character (Шрифт) - см. рис. 17.20, 17.21.

В CSS расстояние между строками задать очень просто. Для этого есть специальное свойство. Но, разумеется, есть и много других параметров, которые универсальны, и их можно применить к тексту.

Если никаких настроек не делать, то выставляются значения по умолчанию. При желании вы можете изменить это расстояние. Значение может быть как в процентном соотношении, так и в пикселях.

Высота строк

В CSS расстояние между строками можно продемонстрировать следующим рисунком.

На изображении выше указаны параметры с соответствующими расстояниями. Текст располагается в пространстве font-size. Обратите внимание, что линия текста начинается не на основании, а немного выше. Пространство ниже предусмотрено для букв, у которых есть элементы снизу (g, у и так далее).

Обратите внимание, что пространство между блоками font-size называется leading. В HTML и CSS это свойство никак не фигурирует, но оно есть в других графических и текстовых редакторах. Например, в Adobe Photoshop.

На рисунке выше указано, где в "Фотошопе" можно указать leading. А рядом указывается параметр font-size.

Примеры использования line-height

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

В случае маленького значения пользователю вашего сайта читать будет неудобно.

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

Тонкости оформления

В CSS расстояние между строками можно дополнительно настраивать различными отступами. Рассмотрим пример на рисунке.

В поле "Элемент" в нашем случае будет текст. Padding - это отступ внутри объекта, а margin - отступ за объектом. Border - это рамка. Она может быть 0 пикселей, а может быть и 100.

На следующем изображении показаны сразу все отступы, рамка и высота линии текста.

Если у вас текст небольшой, всего в одну строку, или каждая строка в отдельном абзаце, то расстояние можно настраивать отступами между этими абзацами. То есть maring и padding между строчками в одном элементе не оказывают никакого влияния. Они создают отступы только по краям объекта. Объект - это весь абзац, а не строчки в нем. Здесь важно не запутаться.

В случаях, когда много строк, и всё это расположено в одном объекте, шрифт рекомендуется менять основными параметрами.

Как увеличить расстояние между строками CSS

Расстояние между строками HTML можно прописывать к какому-нибудь классу или для всех абзацев в тексте. Если вы укажете вот так: p { line-height:20px; }, - то абсолютно все абзацы на странице будут со строками размером 20 пикселей. Если нужно в разных местах различные размеры, то рекомендуется делать следующим образом.

Прописываем стили.

Class1 { line-height:20px; }

Class2 { line-height:16px; }

Class3 { line-height:12px; }

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

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

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

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

У поисковика "Гугл" есть специальный инструмент, который помогает в этом анализе. Он очень удобен для веб-мастеров.

Вот пример результатов, которые могут быть.

Палитра Символ (Character) позволяет задавать такие параметры шрифта, как межстрочный интервал, расстояние между символами и т. д. (табл. 6.2). Вы также можете сделать текст курсивным или жирным, оформить текст заглавными буквами или индексами. На палитре Параграф (Paragraph) находятся элементы управления, задающие параметры параграфов текста (отступ красной строки, ширина полей, расстояние между параграфами и т. д.). Используются эти палитры для тонкой настройки текста. Ниже приведено описание некоторых из расположенных на них элементов управления.

Таблица 6.2. Некоторые элементы управления панели Символ (Character)

Элемент управления	Функция
	Задает размер шрифта
	Определяет межстрочный интервал
	Позволяет изменить расстояние между двумя соседними символами. Для изменения этого параметра нужно установить курсор между двумя символами и выбрать из списка нужное значение. Расстояние между символами можно как уменьшать, так и увеличивать
	Предназначен для задания дополнительного межсимвольного интервала в пределах выделенного участка текста. Как и в случае с расстоянием между соседними символами, расстояние между символами в группе может быть увеличено или уменьшено
	Позволяют настраивать высоту и ширину символов
	Используется для настройки сдвига базовой линии шрифта. Это может оказаться полезным для написания индексов или буквиц (букв увеличенного размера, начинающих абзац)
	Отображает цвет текста. Позволяет сменить его при помощи стандартного диалога выбора цвета Фотошоп
	Дополнительная настройка оформления текста. Щелкая мышью по символам, вы можете изменять начертание шрифта и его оформление (подчеркивание, индексы и т. д.)
	Выбор языка для автоматической проверки орфографии. Эта функция впервые введена в Фотошоп
	Выбор режима сглаживания границ символов. В большинстве случаев достаточно использовать значение по умолчанию

ПРИМЕЧАНИЕ. Расстояние между двумя символами принято называть кернингом (от английского слова kerning - межсимвольный интервал). Дополнительное расстояние, добавляемое между всеми символами выбранной последовательности, называют трекингом (от английского слова tracking - установка межсимвольных расстояний).

Эти четыре опции имеются панели параметров и дублируются на панели символов. Не имеет значения, на какой из панелей Вы измените эти опции, значения будут продублированы:

Метод сглаживания (Anti-aliasing) для букв

Сглаживание букв (Anti-aliasing) - технология, применяемая для улучшения визуализации букв текста с целью сгладить резкие края и убрать "зубцы", возникающие на краях букв.

Эта опция также дублирована на двух панелях:

На данный момент в Photoshop существуют семь методов сглаживания текста, включая режим "без сглаживания" (none), на рисунке я привёл русскоязычный и англоязычный интерфейсы Photoshop:

Каждый из методов сглаживания производит собственный эффект на буквы, и к каждому отдельному случаю метод надо подбирать опытным путём, но это в идеале, а на практике в основном я пользуюсь методом сглаживания, установленным в Photoshop по умолчанию - "Резкое" (Sharp).

На рисунке я привёл пример двух видов сглаживания текста Photoshop:

Межстрочный интервал (интерлиньяж, Leading)

Этот параметр текста доступен только из панели Символ, как понятно из названия, он задаёт вертикально расстояние между строк. По умолчанию параметр установлен на "Авто":

В основном, использование Межстрочного интервала в значение Auto даёт неплохие результаты, но вы можете задать Межстрочный интервал самостоятельно перед вводом текста, либо после ввода, выделив весь текст. Вы можете выбрать одно из предустановленных значений (от 6 pt до 72 pt), либо ввести собственное одним из фотошоповских методов ввода параметров, т.е. изменение перетаскиванием мыши или прокруткой колёсика или вводом значения в окно с клавиатуры.

Трекинг (Межбуквенный интервал, Tracking)

Параметр "Трекинг" также доступен только из панели Character, он управляет расстоянием межу буквами или символами. Он расположен непосредственно под Межстрочным интервалом и по умолчанию установлен в 0:

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

Чтобы изменить Трекинг, следует выделить нужный участок текста и ввести значение в поле ввода. На примере я увеличил трекинг в слове "участок" , не затрагивая остальной текст:

Кернинг (Kerning)

Этот параметр также доступен только из панели Символ и расположен слева от Трекинга . По умолчанию он установлен на значение "Метрический" (Metrics), что это значит, я объясню немного ниже. Кернинг регулирует промежуток между двумя конкретными буквами или символами:

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

Для того, чтобы опция стала доступной, следует установить курсор в тексте между двумя нужными буквами. На примере я задал отрицательное значение Кернинга :

Как я уже говорил, по умолчанию опция Кернинг установлен на "Метрический", что означает, что Photoshop использует межбуквенное расстояние, заданное дизайном шрифта. Это часто вариант в большинстве случаев даёт лучшие результаты, хотя и зависит от свойств используемого шрифта. Если вы нажмете на маленький треугольник справа от поля ввода значения Кернинга , вы увидите, что непосредственно под значением "Метрический" находится значение "Оптический" (Optical). При этом варианте Photoshop самостоятельно устанавливает межбуквенный интервал, основываясь на форме букв. Опять таки, зависит от самого шрифта, какой из этих двух вариантов, "Метрический" или "Оптический", даст лучший результат.

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

Масштаб по вертикали и горизонтали (Vertical и Horizontal Scale)

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

Смещение базовой линии (Baseline Shift)

Ниже расположена опция Смещение базовой линии . Базовый сдвиг позволяет переместить выбранные участки текста или отдельные буквы выше или ниже базовой линии шрифта. По умолчанию значение опции установлено в 0 пт. Положительные значения сместят выделенный текст над базовой линией, а отрицательные значения опустят выделенное ниже базовой линии. Опция не имеет предустановленных значений, так что значение необходимо вводить вручную:

Дополнительные текстовые опции

Ниже находятся кнопки дополнительных опций.
Слева направо: псевдополужирный, псевдонаклонный, все прописные, капители (уменьшенные прописные), надиндекс, подиндекс, подчёркнутые, зачёркнутые. На примере я показал действие опций в тексте начиная со второй строки:

Выбор языка

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

В палитре Layers (Слои) выберите текстовый слой.
По желанию. С помощью инструмента Туре выделите тот фрагмент текста, который следует изменить. Иначе трекинг будет применен ко всему тексту.
Щелкните по кнопке Palettes (Палитры), чтобы открыть палитру Character (Шрифт), если она еще не открыта.
Выберите одно из значений трекинга во всплывающем меню Tracking (Tpeкинг) либо введите любое свое значение (рис. 17.19). Воспользуйтесь отрицательным значением, чтобы сблизить символы, и положительным - чтобы увеличить зазор между ними.

Рис. 17.19. Увеличенное межзнаковое расстояние в заголовке

Нажав клавишу Alt при активном инструменте Move (Перемещение) и нажимая клавиши со стрелками «вправо»/«влево», можно скопировать весь текстовый блок.

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

Установка межстрочного расстояния для горизонтального текста

Межстрочный интервал по умолчанию рассчитывается пропорционально кеглю. Их отношение указывается в диалоговом окне Justification (Выравнивание), которое открывается с помощью меню палитры Paragraph (Абзац). По умолчанию величина интервала составляет 120% от кегля. Например, межстрочное расстояние для кегля в 30 точек по умолчанию равно 36.

Для установки межсимвольного расстояния в тексте, который расположен по вертикали, выделите нужные символы и измените значение трекинга в палитре Character (Шрифт). Вы увидите, что текст после этого преобразится.

Сказанное выше о форматировании текста относится только к Фотошопу. Если вы используете другие приложения, возможно, порядок действий при выборе шрифта будет иным. При создании текстов для сети Internet лучше обратиться к программе, предназначенной для Web-дизайна.

В палитре Layers (Слои) выберите нужный слой.
По желанию. Выделите одну или несколько строк, в которых будете менять межстрочный интервал. Если текст был введен в построчном режиме, то необходимо выделить всю строку. Если не выделять строки, то изменения произойдут во всем тексте.
Выберите или введите значение межстрочного интервала в палитре Character (Шрифт) - см. рис. 17.20, 17.21.

Рис. 17.20. Выбор межстрочного интервала

Рис. 17.21. Абзацы с одинаковым кеглем, но разными межстрочными интервалами

Смещение выделенных символов относительно базовой линии

На палитре Layers (Слои) выберите нужный слой.
По желанию. С помощью инструмента Туре (Текст) выделите те символы, которые следует сместить. Иначе изменят положение все символы слоя.
Откройте палитру Character (Шрифт).
Введите значение в поле смещения относительно базовой линии (рис. 17.22) -положительное, если хотите, чтобы буквы были расположены выше базовой линии; и отрицательное - в противном случае (рис. 17.23). Если вы не выполняли шаг 2, нажмите клавишу Enter.

Рис. 17.22. Поле смещения относительно базовой линии

Рис. 17.23. Положение текста при вводе положительного, нулевого и отрицательного значения смещения относительно базовой линии