Какой цветовой профиль лучше всего использовать для файла PNG для спрайтов CSS?

Я использую файл PNG в качестве спрайтов CSS, а цветовой профиль заставляет цвета PNG выглядеть по-разному в Firefox и в Chrome (на Macbook Pro)

Какой цветовой профиль лучше всего использовать перед сохранением этого файла PhotoShop (.psd) в виде файла PNG? (или лучше удалить его полностью и как?)

Подробности:

Это Редактирование -> Настройки цвета в PhotoShop CS5: введите здесь описание изображения

Что они должны установить перед сохранением файла в формате PNG? (или можно поменять при сохранении?)

Кроме того, действительно странно, что в Chrome, если я смотрю файл на

http://foobar:9000/images/sprites.png

or

http://localhost:3000/images/sprites.png

оранжевый цвет выглядит темным.

но если я просматриваю то же изображение на

http://foobar.mycompany.com:9000/images/sprites.png

or

http://hello.mycompany.com:8080/images/sprites.png (используя ssh-туннель на мой локальный хост)

теперь оранжевый цвет яркий. Они указывают на один и тот же файл, и даже если я их скачаю и проведу сравнение, они будут равны в двоичном виде. Кто-нибудь знает, почему?


css png photoshop color-profile
person nonopolarity    schedule 13.04.2011    source источник
comment
вы понимаете, что ни одна из этих ссылок не работает, потому что все они локальны для вашей машины?   -  person Mark Kahn    schedule 13.04.2011
comment
ах да... и эти ссылки выдуманы... (ха-ха, разве это не очевидно?) хм... хотите увидеть образец...? Но вам будет сложно сделать его localhost:3000, если вы не размещаете сервер и не используете этот образ...   -  person nonopolarity    schedule 13.04.2011

Ответы (5)


arrow_upward
3
arrow_downward

Обновление: Photoshop CC позволяет снять флажок «встроить цветовой профиль», чтобы не встраивать профиль. Это настоятельно рекомендуется сделать, если только у вас нет веской причины не делать этого.

Краткий ответ: к сожалению, вам не подходит ЛЮБОЙ цветовой профиль. Лучше всего не использовать ничего, но на самом деле вы не можете заставить фотошоп сохранять такие файлы. В этой теме тысячи дискуссий и мнений, но удаление цветового профиля позволяет браузерам интерпретировать цвета PNG так же, как цвета HTML Hex.

Лично я удаляю все свои данные о цвете с помощью пользовательского скрипта, но что-то вроде TweakPNG должно позволить вам сделать то же самое.

person Mark Kahn    schedule 13.04.2011
comment
так что вы имеете в виду, что TweakPNG может удалить цветовой профиль, но PhotoShop не может ... вы знаете, если PNGOUT, Paint.net, IrfranView или GIMP, Fireworks ... любой из них может? - person nonopolarity; 13.04.2011
comment
«Сохранить для Интернета» в фотошопе позволяет снять флажок «встроить цветовой профиль» — это должно помочь... - person fideldonson; 08.07.2015
comment
@fideldonson - Спасибо, этой опции раньше не было (этому вопросу уже 4 года;)) - person Mark Kahn; 08.07.2015
comment
@zyklus чувствует, что я всю свою жизнь занимался проблемами цветового профиля — и до сих пор не понимаю — так что 4 года — это ничто ;-) - person fideldonson; 09.07.2015

arrow_upward
1
arrow_downward

Короткий ответ: вы вообще не должны использовать цветовой профиль и убедитесь, что «преобразование в sRGB» отключено.

См. эту статью для лучшего объяснения почему и как это сделать

person Jon P    schedule 27.04.2011

arrow_upward
0
arrow_downward

Попробуйте отключить политики управления цветом. Я не уверен, что это поможет, но может.

person Trav    schedule 27.04.2011

arrow_upward
0
arrow_downward

Это сложная проблема, поскольку уровень поддержки цветовых профилей различается в разных браузерах.

Использование гаммы sRGB 2.2 — хорошее начало.

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

http://imageoptim.com/color-profiles.html

person Kornel    schedule 19.03.2012

arrow_upward
0
arrow_downward

Я не думаю, что есть ответ. Safari и Chrome предполагают, что все изображения сохраняются в цветовом пространстве sRGB.

Safari будет учитывать другой цветовой профиль, встроенный в изображение, а Chrome — нет.

Firefox ничего не принимает во внимание и просто использует собственные значения RGB.

Это означает, что цвета в Firefox на широкоцветном (P3) экране, таком как Macbook pro, будут выглядеть чрезвычайно яркими по сравнению с цветами sRGB, отображаемыми в Chrome и Safari.

Кроме того, вы можете применить к изображениям профиль P3, и они будут отображаться ярко в Safari и Firefox, но размыты в Chrome.

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

person Andrew Swift    schedule 18.05.2020