Правильно ли применять разный letter-spacing для разных блоков?

Question

[Игорь]

Дизайнер в своем макете использовал разные межбуквенные расстояния (трекинг выделенных слов Photoshop, в каких единицах он задается? в % - от какой величины?).

Правильно ли задавать разный letter-spacing у элементов или это ошибка дизайнера?
Таких строк в css уже более 20.

Answer 1

[Анна Бакурова]

Нужно всегда учитывать что даже перенос строки у фотошопа и во время вёрстки по разному работает. когда на странице более 5-7 letter-spacing различных это уже точно ошибка дизайнера. Чаще всего Я использую letter-spacing: -0.1px (или что то в этом районе). В 90% случаев это выручает и текст встаёт на место. Мне бывало давали макеты где отступ у 2-3 букв другой - это уже явный "косяк" дизайнера, так что не обращайте на это внимания.
Так же не нужно забывать про семантический css - то есть если везде например у всех в контенте line-height: 1.3em и только у одного или двух line-height: 1.35em то это опять же скорее ошибка дизайнера. А вообще по ушам им за такое давать нужно...

Comments

[Игорь]

Просто хочется знать мнение о проверке макета PerfectPixel

Answer 2

[Юрий Лобанов]

Вот прочтите:
artgorbunov.ru/bb/soviet/20110612
Пользоваться межбуквенным расстоянием можно, например для выделения заголовков или какой-нибудь надписи. Однако смущает количество в 20 штук. На ум приходит 4-5 заголовков (тем более, что не все из которых обязательно должны так выделяться), плюс одна или две выделяющиеся надписи. Если задавать в относительных единицах, то больше 7 строчек даже в адаптивном дизайне не нужно.
Но вообще пользоваться межбуквенным расстоянием надо осторожно, и не применять его для обычного текста. Если шрифт нормальный, в нем все эти расстояние строго вымерены, и я сомневаюсь, что дизайнер еще и отличный шрифтовик.

Answer 3

[Kuzzy]

Еще учтите нюанс, подогнать межбуквенное расстояние во всех браузерох идентично дизайну в ПСД практически не возможно, в каких бы единицах измерения оно не было задано, расстояние меньше 1 пикселя не будет работать в большинстве браузеров (только в фаерфоксе по-моему), а шаг в 1 пиксель слишком велик чтобы удовлетворить все фантазии дизайнера.

Comments

[Анна Бакурова]

и расстояние менее чем в один пиксель в хроме работает тоже