Как сохранять изображения для web сайта?

Question

[FronzZ]

Всем привет!
Подскажите пожалуйста, нужно ли при сохранении изображения в фотошопе ставить чекбокс (встроенный профиль)? Обычно все проставлял так:



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



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



Так нужно ли ставить этот чекбокс, будут ли норм отображать браузеры фотографии без этого флажка?

Answer 1

[iBird Rose]

это ни на что не влияет. просто в изображение будет добавлен этот профиль. т.е. он просто станет весить на пару КБ больше.
p.s. фотошоп плохо оптимизирует изображения под web. чтобы еще больше выиграть в размере советую прогонять другими оптимизаторами. к примеру, онлайн оптимизатор https://tinypng.com/
если пакетно и автоматически при верстке - ставь и прогоняй через https://www.npmjs.com/package/imagemin

Comments

[FronzZ]

Спасибо! =)
То что весить будет меньше я понимаю. Вопрос, сохраняется ли фотография в srgb, и будет ли она норм отображаться в браузерах, если не отмечать этот пункт?) Как я писал выше, если я не ставлю флажок с встроенным профилем, то фотошоп, да и в самих свойствах фото не указан этот формат. Даже если я проставляю все метаданные.
А по поводу tinypng знаю, но фотошоп не хуже сжимает фотографии. Специально сравнивал.

[Одиночка Айс]

FronzZ, браузеру плевать на профили и метаданные

Answer 2

[Олег]

Думаю, Вы до этого занимались полиграфией.
Точная калибровка цветового профиля для веба утопия. Очень разные устройства у пользователей.
Относительно безопасная палитра намного меньше sRGB.
Врядли Вы застали мониторы, на которых муар с незначительной разницей (буквально в 1/128) между оттенками точек приводил к эффекту мерцания. Сейчас более актуальна динамическая яркость и ночной режим.
Сайты смотрят и на пляже и ночью под звездами.

Тут более важен выбор формата, в котором сохранить изображение.
JPEG - артефакты сжатия. Ну совсем не подходит для изображений с формулами и текстом как у Вас.
PNG - когда нужна четкая картинка. SVG - если должно ресайзиться и это не фотография (фигурами можно описать)
WEBP сравниваешь размеры и качество с исходным jpg/png . Почти всегда меньше. Но тут зависит от сайта, можно ли устаревшие браузеры послать лесом. Или бакенд нужен умный (от юзер агента решается какая версии картинки)