Откуда и зачем лишний пиксель в Фотошопе?

Question

[Нерон Лордов]

Решил в кои-то веки попробовать фотошоп для веб-диза (до этого юзал люстру).

Сразу наткнулся на какой-то мутный косяк, который мне теперь покоя не даёт. Слева на скриншоте - квадратик 20х20, прибитый к левому краю артборда. По правой стороне квадратика проходит направляющая, в координате х=20 (легко проверить по линейке наверху). Рядом текстовый слой, с той же самой координатой. Так почему между текстом и направляющей есть пустота толщиной в пиксель?! Пробовал создавать текст и в виде Point type (клик по пустой области текстовым инструментом), и в виде Area type (оттягивание текстовой коробки зажатым текстовым инструментом) - ситуация не меняется.

Самое смешное, что если этот текст подвинуть влево, вплотную к направляющей, — у него координата будет х=19, а мне надо 20, и чтобы пустоты этой не было

Answer 1

[GreatRash]

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

Comments

[Jimmy Neutron]

А что юзать?

[Нерон Лордов]

Александр Власов: Иллюстратор, скетч.

GreatRash

Не нужно его юзать для веб-дизайна вообще.

Абсолютно согласен, плюнул и вернулся к люстре.

[Pavel Designer]

Вы это еще верстальщикам объясните, которые хотят макеты только в Фш =(

[Нерон Лордов]

Pavel Designer: а нельзя AI в PSD конвертнуть, случайно?

[Pavel Designer]

Nekto_Habr: конечно можно. В меню Ai есть формат PSD, а вот результат мало кого будет устраивать) Можно через Fw, но идеально тоже не будет.

[Lorri]

я делаю в чем просит заказчик, а почти всегда просят фш и ничего кроме.

[Jimmy Neutron]

Nekto_Habr: вот скетч доступен только для мака, в сети много чего лежит по поводу конвертации макетов скетча в PSD, но опять же все идет через Mac, мол ты "должен" иметь Mac, если ты PRO дизайнер или разработчик.
На счет того, что заказчики чаще просят в PS делать, это факт, особенно учитывая то, что многие заказчики не умнее табуретки в этом плане. (Пример: делаешь видео и заказчик говорит, "ну вы же отфотошопите его".)

[Azat GM]

Nekto_Habr: а где можно увидеть Ваши работы?

[Нерон Лордов]

Azat GM: а вы с какой целью интересуетесь?

Answer 2

[Pavel K]

Перфекционист 85 левела.
Вы же в растре работает, соответственно расстояние может появляться при сглаживании векторного шрифта в растр ( ограничительная рамка считается вместе с полутонами на краях, да же если вы не видите- он может там быть) а так же если изменяете ширину текста не настройкой межбуквенного интервала, а растягиванием ограничительной рамки. Попробуйте порастягивать - увидите как буквы скачут. Ну и докучи - при большом зуме объект позиционируется попиксельно (т.к. у пикселя нет дробного значения - это наименьшая единица), а ограничительная рамка служит лишь для показа области при "зуме" поэтому она не обязана позиционироваться попиксельно. Вот как-то по-моему так.

Comments

[Нерон Лордов]

Я тоже что-то подобное предполагал, НО с другой стороны - у такой точной штуки, как растр, и отображение должно быть предельно точным. Любой графический редактор (даже ПЕЙНТ, карл!) умеет отражать реальные границы объекта. А великий и могучий фотошоп - не может, значит. И ведь он позиционируется как инструмент для веб-диза (то есть, понятно, что корни у него совсем другие, но Эдоуби сама его развивает в этом направлении).

Дело даже не в перфекционизме, а в энтропии макета. В макете сайта будут десятки и сотни элементов, и общая кривожопость будет зашкаливать с такими мелкими косяками.

[Дмитрий Евграфович]

Nekto_Habr: Да-да, а потом окажется, что браузер шрифты сглаживает немного не так, как фотошоп (причем каждый браузер по-разному), что некоторые детали макета нельзя сверстать один в один в виду "ограниченности" css... не забивайте голову ерундой, следуйте правилам, описанным на i-love-psd.ru и в статьях типа https://habrahabr.ru/post/311800/ и не забейте на мифическую энтропию.

Answer 3

[Pavel Designer]

«Откуда и зачем» можно предположить лишь типичное для Adobe «ну, вот так вот у нас оно работает».

Не раз видел подобные мелочи, но сначала просто не обращал на них внимание, а затем нашёл простое решение: с недавних пор я для всех блоков или объектов делаю bounding box. Всегда можно посмотреть какие границы должны быть у объектов даже если есть какие-то глюки.


Может это не совсем то, но вдруг поможет.

Comments

[Нерон Лордов]

Можно поподробнее про bounding box? Я ФШ использую в основном по прямому назначению, как редактор растровой графики, веб-диз еще не лабал в нём)

[Pavel Designer]

Nekto_Habr: просто прямоугольник для обозначения границ. Если в макете, например, границы текстового блока могут быть неровно, то всегда можно померить расстояние по этой ограничительной рамке. Быстро показать/скрыть их можно легко и удобно через Layer comps.

Answer 4

[dom1n1k]

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

Comments

[Нерон Лордов]

Дык я текст в Area type тоже загонял, а это по сути чёткий контейнер..

Answer 5

[Андрей]

Поиграйтесь с масштабом, наверняка граница текста будет скакать на +/- 1 px

Comments

[Нерон Лордов]

Неа, при любом масштабе виден зазор.

Answer 6

[Алексей]

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