 |
|
04/06/2007
Подскажите технологию сжатия обыкновенной фотографии до необходимых размеров для размещения на сайте.
Спасибо за ответ на мыло trade-yar@yandex.ru
Спасибо за ответ на мыло trade-yar@yandex.ru
 |
|
05/06/2007
Картинке на веб-странице можно задать любые размеры, и браузер автоматически сжимает/растягивает исходное изображение, подгоняя под требуемые размеры
Никаких дополнительных технологий не надо
Никаких дополнительных технологий не надо
 |
|
05/06/2007
Цитата:
Никаких дополнительных технологий не надо
Никаких дополнительных технологий не надо
Качество сжатия фото браузером значительно ниже, чем профессиональными пакетами.
Рекомендую вам ACD See - там есть пакетное сжатие картинок, очень удобно.
|
|
|
05/06/2007
Ну так если приперло, то можно и Фотошопом сжимать 
|
|
|
05/06/2007
Фотошопом вы 3500 картинок, например, будете очень долго сжимать...А в ACD See есть пакетное сжатие, выделить все и нажать пару кнопок...
 |
|
05/06/2007
Цитата:
Фотошопом вы 3500 картинок, например, будете очень долго сжимать...
Фотошопом вы 3500 картинок, например, будете очень долго сжимать...
В Фотошопе переходите на вкладку Actions, создаете новый макрос для записи, например, my_macros. Жмете на запись. Что-то делаете на одном изображении (ваши действия записываются). Останавливаете запись. Вот вам и порядок действий (макрос).
Потом "File"-"Automate"-"Batch" - вот вам и пакетная обработка кучки файлов по вашему макросу (хоть рамки везде делайте, хоть водяные знаки ставьте или резкость настраивайте).
Цитата:
Картинке на веб-странице можно задать любые размеры, и браузер автоматически сжимает/растягивает исходное изображение, подгоняя под требуемые размеры
Никаких дополнительных технологий не надо
Картинке на веб-странице можно задать любые размеры, и браузер автоматически сжимает/растягивает исходное изображение, подгоняя под требуемые размеры
Никаких дополнительных технологий не надо
Браузер лишь отображает то, что вы ему передали.
Т.е. если у вас изображение на 2000 пикселей на 5000 пикселей, а на страницу вставлено с шириной 20 на 50 - то это огромное по размеру изображение загрузится, а потом браузером уменьшится. А это не совсем правильно (точнее - вообще не правильно).
Изображения должны иметь ширину и высоту ровно такую с которой они вставляются на страницу. И в html надо обязательно писать размеры (нужно это вот почему: когда браузер получает страницу (html) он начинает ее строить. И когда везде размеры проставлены (у изображений, таблиц, слоев - он ее быстрее выстроит и, значит, быстрее отобразит посетителю)).
Цитата:
Подскажите технологию сжатия обыкновенной фотографии до необходимых размеров для размещения на сайте.
Подскажите технологию сжатия обыкновенной фотографии до необходимых размеров для размещения на сайте.
1. Определится с размерами. Зависит от сайта (дизайна), но обычно (например, для товаров в магазине) стараются придерживаться Ширины (а Высота плавает (масштабируется)).
...
2. Как определились с размерами - определяйтесь с форматом. Из всего три: gif, jpg (jpeg), png. У каждого свои минусы и преимущества. Png самый лучший, но с ним возникнет множество проблем с отображением в ранних браузерах (в ИЕ).
jpeg используют для фотографий (т.е. когда много-много разных по цвету пикселей. Большой диапазон цветов.
gif - когда много одинаковых пикселей идущих подрят. 256 цветов.
Т.е. какой формат выбрать - определять методом тыка. К этому пункту вернемся в конце.
...
3. Будем считать что изображения у вас подчищены и отцветокорректированы. А то этот третий пункт в книгу превратится =)
..
4. Открываете в Фотошопе свое изображение. переводите его в RGB (если он не в нем). Потом тыкаете в "Image"-"Image Size":
Resolution ставите в 72 (проверяете чтобы было выбрано pixel/inch)
Также проверяете чтобы столяло две галки:
Constrain Proportions и
Resample Image (выбрано Bicubic)
И уже после этого ширину (width) выставляете в нужную вам (высота при этом промаштабируется). Жмете на Ок.
...
5. Тут уже надо смотреть на само изображение. Обычно еще раз требуется небольшая цветокоррекция.
...
6. Резкость. Все опять зависит от изображения (что на нем изображено). Но попробуйте:
"Filter"-"Sharpen"-"Unsmark Mask" и выставите в поля:
70
0.7
1
Стало лучше чем было?
...
7. Сохраняемся (вот тут идет перелинковка с третьим шагом).
В Фотошопе сохранять через меню:
"File"-"Save for web".
Выбираем формат. На вкладке просмотра тыркайте на 4-Up.
Слева в верху будет изображение оригинал. В остальных - в разных форматах при разной степени сжатия (для jpeg), количества цветов (gif) и т.п. Снизу пишется тот размер который получится.
Вообщем ваша задача выбрать формат (и меняя разные настройки). Так, чтобы и изображение выглядело хорошо (не было заметно артефактов после сжатия) и так чтобы размер изображения был меньше. Выбрали? Сохраняйтесь.
...
Возврат к шагу три.
Чтобы выбрать формат - надо открыть штук двадцать изображений вашего сайта, оптимизировать их в одном формате, в другом, и потом сравнивать их все. Во размеру, по качеству. И уже использовать тот формат где будет лучше.
...
Но, думается, вам подойдет такое:
Изображения-оформления для сайта вы будете делать в gif (так как элементы маленькие).
Маленькое изображение товара (50-150 пикслей по ширине) - в gif (256 цветов, ).
Большие изображения товара - в jpeg (500-800 пикселей по ширине) с сжатием 80%.
...
На самом деле это описание такое сложное, а делать изображения для веб очень и очень просто.
...
Если покажите ваши изображения, скажите ваши размеры - по ширине. По-шагово распишу куда жать и где что вбивать для наилучшего качества.
|
|
|
05/06/2007
Зачем вообще GIF использовать, если JPG будет меньше весить
Тем более, всего 256 цветов
GIF вообще устаревший формат, единственный его плюс - это анимация
Тем более, всего 256 цветов
GIF вообще устаревший формат, единственный его плюс - это анимация
|
|
|
05/06/2007
Barlog:
Качество сжатия фото браузером значительно ниже, чем профессиональными пакетами
Качество сжатия фото браузером значительно ниже, чем профессиональными пакетами
Если речь об ИМах, то про качество картинок лучше вообще не рассуждать... Больная тема
|
|
|
05/06/2007
buka:
Если речь об ИМах, то про качество картинок лучше вообще не рассуждать... Больная тема
Если речь об ИМах, то про качество картинок лучше вообще не рассуждать... Больная тема
а при чем здесь ИМ не ИМ...
это факт, что проф пакет выполнит сжатие лучше. и не важно ИМ не ИМ...
|
|
|
05/06/2007
Цитата:
это факт, что проф пакет выполнит сжатие лучше. и не важно ИМ не ИМ...
это факт, что проф пакет выполнит сжатие лучше. и не важно ИМ не ИМ...
Прально. Так как у него алгоритм продуман (как один соседний пиксель наложить на другой и как лучше соседние размыть (точнее: поменять цвет у соседних)).
Да и при сохранении - программы пишут в файл заголовки (в чем сделано, всякие внутренние теги и т.п.). У фотошопа при сохранении через "Саве фор веб" они тоже есть, но их минимум.
Кста, есть программы - которые эти заголовки вырезают безопасно от файла (как для gif, так и для jpeg). Если фоток товаров очень много — срезаный вес будет очень существенный.
Тока buka, наверное, имел в виду другое.
Качественных фоток товаров очень мало. А самому насчелкать иногда не предоставляется возможным.
...
Цитата:
Зачем вообще GIF использовать, если JPG будет меньше весить.
Зачем вообще GIF использовать, если JPG будет меньше весить.
Не факт. Проведите эксперимент (на разных изображениях (с разным сюжетом) и разными размерами). Я в свое время проводил =)
Если есть возможность использовать gif — надо использовать gif (изображение выглядит четче при меньшем весе).
p.s. Вот это изображение:
Гифом. Весит: 0.761 Kb.
Оно же jpeg-ом:
Качество 100: 2.86 Kb
Качество 80: 2.01 Kb
Качество 60: 1.58 Kb (уже появились артефакты от сжатия)
Качество 30: 1.05 Kb (чумазое от сжатия (все в разводах)).
Это всего одно изображение.
У вас таких на сайте - море.
...
Цитата:
Тем более, всего 256 цветов
Тем более, всего 256 цветов
Человеческий глаз смотря на фотку смотрит не на отдельно взятый пиксель, а на пространство в целом.
Так и у гифа - любой цвет отсутствующий в его палитре, формируется за счет соседних (цветом).
 |
|
05/06/2007
altsupport
И у Вас на ПОЛНОЦВЕТНОМ gif размер получился менее чем на jpg ? "не верю" (с)
И у Вас на ПОЛНОЦВЕТНОМ gif размер получился менее чем на jpg ? "не верю" (с)
|
|
|
06/06/2007
Цитата:
И у Вас на ПОЛНОЦВЕТНОМ gif размер получился менее чем на jpg ? "не верю" (с)
И у Вас на ПОЛНОЦВЕТНОМ gif размер получился менее чем на jpg ? "не верю" (с)
Надо смотреть на изображение.
Если фотография (занимает все пространство (т.е. каждый соседний пиксель от предыдущего отличается по цвету существенно)) - jpeg будет меньше.
Если это объкт, вокруг которого однородный фон - то гиф будет меньше.
Опять же при условии - размера фотографии.
Тока тут слово ПОЛНОЦВЕТ смущает. Цветное в смысле?
А то полноцветом в полиграфии цветовую модель CMYK обазначают.
|
|
|
06/06/2007
altsupport:
Так и у гифа - любой цвет отсутствующий в его палитре, формируется за счет соседних (цветом).
Так и у гифа - любой цвет отсутствующий в его палитре, формируется за счет соседних (цветом).
Ладно, допустим, гиф в некоторых слчаях меньше весит... Но качество картинки у него полюбому хуже, из-за убогой палитры. ИМХО сейчас в вебе размещать низкокачественные картинки - дурной тон и себе в убыток, так что jpeg рулит
При нынешних скоростях интернет-соединений, плюс-минус один-два килобайта при загрузке сайта роли не играет...
Я вот недавно попробовал PNG формат, понравилось. Прозрачность/полупрозрачность делается легко. Вместо квадратных фото-блоков на сайте можно размещать картинки любой формы
Жесть.
|
|
|
06/06/2007
Цитата:
Я вот недавно попробовал PNG формат, понравилось.
Я вот недавно попробовал PNG формат, понравилось.
А в браузерах как? И также - как в них с полупрозрачностью?
PNG хороший, только активно пользоватся им начнут через года два-три.
Цитата:
Но качество картинки у него полюбому хуже, из-за убогой палитры
Но качество картинки у него полюбому хуже, из-за убогой палитры
Повторюсь: зависит от изображения.
А может даже получится что и лучше (из-за четкости)
Вот попугай: http://stream.ifolder.ru/2255020
В jpeg и в gif. Откройте одно и второе браузером. И, если бы вы не знали где в каком формате (когда изображения просто вставлены на страницу) - смогли бы сходу определить формат?
При этом один от второго отличается почти в два раза (18 kb против 34). При этом еще учитывайте что попугая брал из-за того что он цветастый. Холодильник, телевизор или еще что-нить - однотонные.
Цитата:
При нынешних скоростях интернет-соединений, плюс-минус один-два килобайта при загрузке сайта роли не играет...
При нынешних скоростях интернет-соединений, плюс-минус один-два килобайта при загрузке сайта роли не играет...
По-мимо скоростей есть еще и трафик. Т.е. посидев немножко и над изображениями и над html - вес страницы может срубится минимум на 5 kb.
Средний посетитель минимум просмотрит две страницы. А у вас их, например, 5 000 в сутки.
Получается - 50 000 kb, т.е. в сутки почти 49 мегабайт. Это брали по минимому.
Хотя, конечно, большая тормознутость возникает когда html-кривой (браузер долго строит), и из-за работы скриптов сайта.
|
|
|
06/06/2007
altsupport:
А в браузерах как? И также - как в них с полупрозрачностью?
А в браузерах как? И также - как в них с полупрозрачностью?
В браузерах - ок
IE6 имеет некоторые проблемы с этим, но все решается одной строчкой джаваскрипта
Другое дело, что PNG не сжимает почти нифига (по сравнению с jpeg разница в разы)... Несмотря на то что именуется "Portable Network Graphics"
Ответить
последние материалы
25/11/2024
Новое на форуме
09:48
09:39
