Трекинг. В чем измеряется.

[virteK]

Хочу спросить у знатоков. Если попал не в ту тему, посоветуйте куда "идти".

Переношу psd-шаблон на web-верстку. У дизайнера для текста во вкладке "символ" в поле трекинга задано 80.
А что это за единицы, что мне прописать в css: px, pt, em, %?

То есть вопрос, собственно, в чем измеряется у вас трекинг и как это переносится в web?

Любой совет будет для меня ценен.

Спасибо.

 

[IPTIV]

1/1000 em (круглой шпации). Т.е. 1/1000 ширины большой буквы "М" данной гарнитуры и кегля. А в WEB, по-моему, проще перенести путём визуального сравнения. Можете установить картинку с макетом в качестве фона, а на слой (div) положить текст и подгонять его трекингом до совпадения с текстом на фоне.

 

[kstati]

Не обязательно на глаз. Можно и точно:
при трегинге 10 получится letter-spacing: 0,010em;

 

[virteK]

Ага, значит если у него стоит 80 то я указываю 0.08em. На глаз и занимался этим вчера и подошел именно к таким цифрам, но засомневался. Сейчас вы мне разъяснили.
kstati, вам тоже спасибо.

Тогда позвольте еще вопрос: в psd стоит кегль 40pt. По метрической таблице это 53px. Я сверстал это в css font-size 40pt. Браузер честно показывает 53px, но вот как раз-таки визуально текст получился выше psd-шного.
Можете здесь что-то подсказать? Почему так?

 

[Dmitrij M]

Пункты бывают разные, постскрипт и традиционные, как минимум. Это что касается ДТП, а веб – не знаю.

 

[virteK]

Ох и тема, пункты типографские и пункты компьютерные...

Спасибо, Дмитрий, абсолютно ничего не понимая в том что вы написали забросил запросы по этим "пунктам" и ответ для меня нашелся здесь: http://htmlforum.ru/index.php?showtopic=32397 до 4 поста включительно (если кому-то будет интересно).

В итоге, алгоритм следующий:

• смотрим разрешение psd-макета;
• если оно 96dpi, то все pt вставляем в css как есть;
• если же 72dpi, то все pt следует уменьшить на четверть.

Я вставлял как есть, а оказалось что данный мне psd-макет сверстан под 72dpi, вот и выходили у меня высокие буквы!

Теперь вставил убавленные значения - все совпало, разночтений нет!
Все шрифты web-страницы визуально полностью совпадают с макетом!


Благодарю всех, принявших участие.