На многих сайтах логон разрезан на несколько частей, для чего это делается? Действительно ли картинка в целом грузиться быстрее от этого? Или же это для того, чтобы пользователь не ждал загрузки полностью мог увидеть хотя бы часть картинки???

Браузер открывает несколько соединений, а передача по сети это такая вещь, где все когда нибудь да простаивают. Есть идея что в момент простоя другие соединения могу качать, т.е. картинка грузится в целом быстрее.

Или часть рисунка анимирована. Анимация отдельно, статичное - отдельно

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

Большие картинки - лучше резать. Посетитель, не видит как потехоничку, сверху в низ подгружается ваша графика. Лучше маленькими частями. Е можно ещё применить одну технолоию: если есть монотонные куски, то в таблице нужно прописать размеры ячеки и цвет, а картинку просто выкинуть от туда. Ещё быстрее будет!

Mal Hack

Цитата

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

Ты сам то так пробовал?
Полная чушь по моему...
проэкспериментируй и все поймешь...

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

Цитата(ProgrammerBOTANIK @ 21.9.2005, 17:02)

Ты сам то так пробовал? Полная чушь по моему... проэкспериментируй и все поймешь...

Правда? Я делала И это действительно практикуется так как способ себя оправдывает

Mal Hack - не согласен с понижением своей репутации, я не говорю чуш в данном случае - ты хочешь мне сейчас доказать, что если я сжал картинку 300*300 к примеру с 500 до 100 кило -то если я возьму первоначальную картинку в 500 кило - разрежу на допустим 4 части и каждую часть так же сожму, то в сумме у меня оказывается получится не 100 кило, а к примеру 60? так чтоли?

Если кто еще не знает - растровая графика состоит из пикселей и если каждый пиксель занимает определенное место на диске, то от разрезки картинки вес ее не изменяется!!!!!!!!!

Это все равно, что сказать - если я возьму квадратный метр ткани и покромсаю его не мелкие кусочки - он станет весить легче... - полный маразм...

Если маленькие кусочкм сжать сильнее, то качество всей картинки все-равно будет хуже, но всегда будет полным аналогом точно также сжатой большой картинки из которой эти куски нарезаны!!!!!

ProgrammerBOTANIK
Ты не прав... Я уже писал об этом в уроке по созданию сайтов... Вот тебе пример: Есть большой логотип со сложной графикой. Я режу его так, чтобы получились куски со множеством цветов.. а где мало цветов - это отдельные файлы. И если оптимизировать каждый файл в отдельности, то и размер можно уменьшить и качество сохранить

Вот пример нашего баннера. Я его просто разрезал попалам (зелёная часть и светлая часть).

Исходник - 11401 байт
две половинки - 10990 байт

Как видешь разница есть и это ещё без оптимизации

Присоединённый файл ( Кол-во скачиваний: 13 )
 ban_graf2_caramel.gif 11,39 Kb

ProgrammerBOTANIK, давайте поменьше эмоций)
Репутация - это отношение участника к другому участнику. И вовсе ни к чему кричать об этом посреди темы. Тем более что Дракон убедительно доказал что вы не правы.

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

Caramel - кому приятно, когда к нему относятся отрицательно...

Если неприятно - есть ПМ.
Предлагаю на этом обсуждение репутации закончить.

Цитата(ProgrammerBOTANIK @ 26.9.2005, 15:23)

вот только в пнг при просмотре в броузере, я заметил, цвет немножко уходит

Вопрос уже обсуждался и скорее всего это IE не правильно этот формат понимает

Red Dragon -

Цитата

Вопрос уже обсуждался и скорее всего это IE не правильно этот формат понимае

Возможно, но я выкопал еще одно свойство - "наследование цвета", при оптимизации под веб из ПНГ выбиваются пикселы в шахматном или строчном порядке, в зависимости от степени сжатия и при открытии такого файла происходит их достраивание методом наследования цветов соседних пикселов, но наследование для сглаживания картинки происходит не подобным цветом, а лишь близким к нему, поэтому общее восприятие картинки глазом и становится немного другим...
Если посмотреть такую картинку при большом увеличении, видно эти разнородные пикселки, поэтому тут нужно либо все ляпить из пнг, либо не оптимизировать его, вот и стала понятна старая проблема, почему данный формат так редко можно встретить в сети и то только на одиночных элементах...
Добавлено @ 11:33
Caramel - что такое ПМ?

ProgrammerBOTANIK
Ты что мудришь то, простые картинки свободно делаются в GIF? а как их оптимизировать я писал здесь
http://forum.vingrad.ru/index.php?showtopic=46961
там всё подробно сказано про разнородные пиксели и как с ними бороться

Цитата(ProgrammerBOTANIK @ 27.9.2005, 12:32)

Caramel - что такое ПМ?

ProgrammerBOTANIK
почитай про алгоритмы сжатия, и вот эта фраза:

Цитата(ProgrammerBOTANIK @ 26.9.2005, 04:06)

Если кто еще не знает - растровая графика состоит из пикселей и если каждый пиксель занимает определенное место на диске, то от разрезки картинки вес ее не изменяется!!!!!!!!!

сразу сойдет на нет

Mal Hack - для тебя, если действительно знаешь латынь андрюхин обыкновенный: Ea, quae scimus, sunt pars minima eorum, quae ignoramus!

Пожалуйста! Все алгоритмы сжатия - найди где написано, что картинка состоит не из пикселов!
Лично общался с профессиональными полиграфистами по этому вопросу!

RLE (Run - length encoding) - метод сжатия данных, при котором одинаковые последовательности одних и тех же байт заменяются однократным упоминанием повторяющегося байта (или целой цепочки байтов), и числа его повторений в исходных данных. Например, строка типа 0100 0100 0100 0100 0100 0100 0100 0100, описывающая некую группу пикселов будет заменена на запись типа 0100 х 8, и т.д. Применяется этот тип сжатия в тех случаях, когда изображение имеет большие участки одинакового цвета, цифровое представление которых идентично. В основном, этот тип сжатия применим для монохромных изображний, сохраненных в цветовой модели Bitmap, где при сжатии данных с его использованием можно добиться наилучших результатов. (тоже, что и сжатие трассировкой правдо без гладких участков) Для сжатия других типов данных (в том числе, и не графических) алгоритм применим, но малоэффективен, так как сжимаемые данные должны иметь простую повторяющуюся структуру). Этот алгоритм имеет еще одно важное преимущество, заключающееся в его относительной простоте, что позволяет быстро производить распаковку из этого формата и упаковку в этот формат (как вы помните, все графические данные для их обработки должны быть предварительно распакованы, а любая компрессия или архивация применяется, в основном, для временного или постоянного хранения файла ). В принципе, на основе этого несложного алгоритма, работают более совершенные и более сложные (а также менее быстрые) методы упаковки графических данных, которые мы рассмотрим ниже. Этот метод сжатия графических фанных испольуется в файлах формата PSD, BMP и других.

CCITT Group 3, CCITT Group 4 - Два похожих метода упаковки графических данных, работающие с однобитными изображениями, сохраненными в цветовой модели Bitmap. Основаны на поиске и исключении из исходного изображения дублирующихся последовательностей данных (как в предыдущем типе сжатия, RLE). Различием является лишь то, что эти алгоритмы ориентированы на упаковку именно растровой графической информации, так как работают с отдельными рядами пикселов в изображении. Изначально алгоритм был разработан для сжатия данных, передаваемых через факсимильные системы связи (CCITT Group 3), а более совершенная разновидность этого метода архивации данных (CCITT Group 4) подходит для записи монохромных изображений с высокой степенью сжатия. Как и предыдущий алгоритм, он, в основном, подходит для сжатия изображений с большими одноцветными областями. Его достоинством является скорость выполнения, а недостатком - ограниченность применения для компрессии графических данных (не все данные удается таким образом эффективно упаковать). Этот метод сжатия графических фанных испольуется в файлах формата PDF, PostScript и других.

LZW (Lemple-Zif-Welch) - алгоритм архивации, основанный на поиске и замене в исходном файле одинаковых последовательностей данных, для их исключения, и уменьшения размера архива. В отличие от предыдущих рассмотреных методов сжатия, в данном случае производится более интеллектуальный просмотр сжимаемого одержимого, для большей степени сжатия данных. Данный тип компрессии не вносит искажений в исходный графический файл, и подходит для сжатия растровых данных любого типа - монохромных, черно - белых, или полноцветных. Наилучшие результаты получаются при компрессии изображений с большими областями одинакового цвета или изображений с повторяющимися одинаковыми структурами. Этот метод позволяет достичь одну из наилучших степеней сжатия среди других существующих методов сжатия графических данных, при полном отсутствии потерь или искажений в исходных файлах. Этот метод сжатия графических фанных испольуется в файлах формата TIFF, PDF, GIF, PostScript и других.

ZIP - метод сжатия данных, аналогичный методу, использованному в популярном алгоритме архивации PKZip. В основу метода сжатия положен метод, аналогичный LZW . Как и предыдущий метод сжатия данных, этот способ не вносит искажений в исходный файл, и лучше всего подходит для компрессии графических данных с одинаковыми одноцветными или повторяющимися областями. Этот метод сжатия графических фанных испольуется в файлах формата PDF, TIFF и некоторых других.

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

JPEG (Joint Photographic Experts Group) - алгоритм, используемый для хранения полутоновых и полноцветных изображений, позволяющий добиться наивысшей степени сжатия и минимальный размер выходного файла. Основан алгоритм на особенностях восприятия человеческим глазом различных цветов, и достаточно громоздок с вычислительной точки зрения, так как занимает много процессорного времени. Происходит кодирование файла в несколько этапов. Во-первых, изображение условно разбивается на несколько цветовых каналов, для дальнейшего анализа. Затем, изображение разбивается на группы, по 64 пиксела в каждой группе, которые представляют из себя квадратные участки изображения размером 8х8 пикселов, для дальнейшей обработки. Затем, цвет пикселов специальным образом кодируется, исключается дублирующая и избыточная информация, причем при описании цвета большее внимание уделяется скорее яркостной, чем цветовой составляющей, так как человеческий глаз воспринимает больше изменения яркости, чем конкретного цветового тона. Полученные данные сжимаются по RLE или LZW - алгоритму, для получения еще большей компрессии. В результате, на выходе мы получаем файл, иногда в десятки раз меньший, чем его несжатый аналог. Однако, чем меньше размер выходного файла, тем меньше степень аккуратности при работе программы - конвертора, и, соответственно, ниже качество выходного изображения. Обычно, в программах, позволяющих сохранять растровые данные, возможно задание некоего компромисса между объемом выходного файла и качеством изображения. При наивысшем качестве, обхем выходного файла в 3-5 раз меньше исходного незапакованного. При наименьшем - меньше исходника в десятки раз, но, как правило, при этом качество изображения не позволяет его где-либо использовать. Как правило, для сохранения достойного уровня качества, используют наивысшую из доступных степень качества. Данный формат предназначен для хранения, в основном, фотографических изображений с большим количеством оттенков и цветовых переходов, и практически не подходит для хранения однотонных изображений типа кадров из мультфильмов (сжатие будет слишком низким, или качество картинки окажется просто неприлично низким). Этот метод сжатия графических фанных испольуется в файлах формата PDF, PostScript, собственно, JPEG и других.

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

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

Изменение цветовой модели файла. Например, файлы в цветовом пространстве CMYK больше аналогичных файлов в пространстве RGB на 33% (так как в CMYK появляется дополнительный четвертый черный канал). Если вы не планируете печать ваших файлов, или уверенны в том, что вы сможете корректно провести цветоделение (переход в субтрактивную модель CMYK) позже, вы можете хранить рабочие файлы в RGB. Однако, некоторые данные при переходе из одной цветовой модели в другую, безвозвратно теряются, так что будьте внимательны .

Изменение разрешения растрового файла. Файл с разрешением 600 точек на дюйм больше своего аналога разрешением в 300 точек в четыре раза, а качество печати при повышенном разрешении не всегда будет выше, нем при номинальном его значении. Так что если разрешение избыточно, можете его понизить. Понижение разрешения растрового файла - необратимый процесс, и никакя интерполяция потом потерянные пикселы не восстановит. Так что при задании необходимого разрешения также будьте внимательны и рациональны . Следует учесть, что параметр разрешения контуров применительно к векторной графике не имеет отношения к объему выходного файла (это уже несколько другое разрешение и несколько другое понятие), а влияет на аккуратность "прорисовки" вектора при его растеризации в устройстве, где производится печать. Так что уменьшение этого параметра для векторной графики не уменьшит объем ваших файлов, а только ухудшит качество печати.

Ресемплирование (изменение глубины цвета растрового изображения) - это изменение начальной глубины цвета файла. Некоторые оцифровывающие устройства выдают растровую информацию с глубиной цвета, превышающую достаточное для печати значение 8 бит на канал(об этом мы тоже уже говорили ). Это иногда оправдано, так как большее значение бит на канал позволяет задавать большее число градаций цвета, что требуется, например, при сильной, "кардинальной" цветокоррекции - сильном осветлении или затенении отдельных участков. Однако, в большинстве случаев для хранения растровых данных в различных цветовых моделях с лихвой достаточно глубины цвета 8 бит на канал. Кроме того, один из стандартов JPEG - сжатия для RGB изображений подразумевает использование разного количества бит для разных цветовых составляющих (наименьшее количество бит используется для зеленого канала, так как человеческий глаз различает в нем минимальное число оттенков). Также большинство фильтров Adobe Photoshop рассчитано на работу с изображениями с глубиной цвета именно 8 бит (с изображением, использующим нестандартную глубину цвета, становится практически невозможно работать, так как большинство фильтров рассчитаны на значение глубины цвета в 8 бит) (отсюда и невозможность сохранения в нужном формате... ).
Для различных типов изображений, которые могут быть составляющими частями файла PostScript - полноцветные (color bitmap), полутоновые черно-белые (grayscale) и для штриховых объектов (bitmap, 1 bit per pixel) указаны различные установки параметров сжатия, являющиеся оптимальными для создания PDF - документа, оптимизированного для печати и сжатого с минимальными потерями качества. В качестве параметра сжатия изображения выбрана альтернатива JPEG с максимально возможным качеством. Выходное разрешение растровых полноцветных изображений выбрано не более 300 точек на дюйм, и в случае превышения указанного предельного разрешения к изображению будет применен алгоритм бикубической интерполяции с понижением разрешения (bicubic downsampling) - это наиболее медленный, но и наиболее качественный алгоритм интерполяции, т. е. получения пиксела на основе цветов окружающих этот пиксел участков. (и это тоже терли! ) Кроме этого алгоритма, возможно указать алгоритмы Average downsampling (усреднение значения цвета пикселов) и Subsampling (полное отсутствие интерполяции, берется один из пикселов, и его цвет устанавливается как увет всего участка изображения ). Естественно, последний вариант работает быстрее всех, но и с наименьшим качеством выходного изображения. Для черно - белых полутоновых изображений (grayscale) установки интерполояции, предельного разрешения и метода сжатия аналогичны прерыдущему примеру. Для монохромных изображений, заданных в цветовой модеди Bitmap с глубиной цвета 1 бит на пиксел параметры несколько другие.
Во-первых, значение предельного разрешения установлено на уровне 1200 точек на дюйм, что является корректным для изображений в этой цветовой модели (напомню, что спектр разрешений для изображений в этой цветовой модели обычно задается в пределах от 800 до 2540 точек на дюйм). Метод интерполяции в случае превышения разрешения также бикубический, как и в предыдущих примерах, а вот метод сжатия выбран именно ZIP (возможен также выбор CCITT Group 3, CCITT Group 4, или RLE). При этом не происходит никаких потерь качества в выходном изображении. Кроме того, с учетом специфики цветовой модели, невозможно задание алгоритмов сжатия типа JPEG. Опция - Compress text and line art - подразумевает сжатие текстовых и векторных данных по одному из алгоритмов, подобных ZIP или LZW. Естественно, подразумевается полное восстановление данных при распаковке файла.

Ну вот думаю и все об алгоритмах сжатия!

Но почему-то фраза:

Цитата

Если кто еще не знает - растровая графика состоит из пикселей и если каждый пиксель занимает определенное место на диске, то от разрезки картинки вес ее не изменяется!!!!!!!!!

На нет не сходит, т.к. она правильная!
Может ты сам не читал про алгоритмы сжатия? Или объясни, может и я туп как дерево?

ProgrammerBOTANIK
я же тебе доказал обратное в своём примере что ты не прав Ты хоть читаешь то, что тебе пишут и на что дают ссылки?

Ведь сам только что говорил о сжатии, а теперь вернулся к обратному

ProgrammerBOTANIK вот представь себе картинку. Разбей на 4 части. Каждая чать в своих отттенках. Так вот, при сжатии каждой части поотдельности, палитра уменьшиться только до тех цветов, которые нужны на эьтой картинки, тобишь до оттенков конкретного цвета...
Добавлено @ 10:54
Латынь я не знаю, так что удосужься фразу перевести.

Mal Hack - То, что мы знаем, есть ничтожная часть того, чего мы не знаем.

Цитата

уменьшиться только до тех цветов, которые нужны на эьтой картинки, тобишь до оттенков конкретного цвета...

Наконец-то дошло до идиота! Спасибо ребята, иногда не видишь очевидных вещей, которые лежат у тебя под носом, обидно Ладно спишем на поразм...
спасибо что объяснили!
Как говорится: errare humanum est - человеку свойственно ошибаться...