Какой формат изображений для небольших веб-сайтов?GIF или PNG?[закрыто]
https://stackoverflow.com/questions/115818
-
02-07-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianВопрос
При создании небольших значков, графики заголовков и т. п. для веб-сайтов лучше использовать GIF или PNG?
Очевидно, что если требуются эффекты прозрачности, то PNG определенно лучший вариант, а для более крупных и фотографических изображений я бы использовал JPEG, но для обычной веб-мебели что бы вы порекомендовали и почему?Возможно, это просто инструменты, которые я использую, но файлы GIF обычно кажутся немного меньше, чем сопоставимый PNG, но их использование кажется чем-то вроде 1987 года.
Решение
Как правило, PNG никогда не бывает хуже, а часто даже лучше, чем GIF, из-за превосходного сжатия.Могут быть некоторые крайние случаи, когда GIF немного лучше (поскольку формат PNG может иметь немного большие накладные расходы из-за метаданных), но на самом деле беспокоиться не стоит.
Возможно, это просто инструменты, которые я использую, но файлы GIF обычно кажутся немного меньше, чем сопоставимый PNG.
Это действительно может быть связано с используемым вами инструментом кодирования.
/РЕДАКТИРОВАТЬ:Ух ты, кажется, существует много заблуждений относительно размера файла PNG.Цитирую Мэтта:
Нет ничего плохого в GIF-файлах для изображений с небольшим количеством цветов, и, как вы заметили, они, как правило, меньше по размеру.
Это типичная ошибка кодирования, не присущая формату.Вы можете контролировать глубину цвета и уменьшить размер PNG-файла.Пожалуйста, обратитесь к соответствующий раздел в статье в Википедии.
Кроме того, отсутствие поддержки в MSIE6 чрезмерно преувеличено Chrono:
Если вам нужна прозрачность и вы можете обойтись GIF-файлами, я бы порекомендовал их, потому что IE6 их поддерживает.IE6 не очень хорошо работает с прозрачными PNG.
Это неверно.MSIE6 делает поддержка прозрачности PNG.Он не поддерживает альфа-канал (без некоторых хаков), но это другое дело, поскольку в GIF-ках его вообще нет.
А только Техническая причина использования GIF вместо PNG заключается в том, что для использования требуется анимация и вы не хотите полагаться на другие форматы.
Другие советы
W3C упоминает три преимущества PNG перед GIF.
• Альфа -каналы (переменная прозрачность),
• Кроссплатформенная гамма-коррекция (контроль яркости изображения) и коррекция цвета
• Двумерное взаимодействие (метод прогрессивного дисплея).
Также ознакомьтесь с этими ресурсами для получения рекомендаций:
Ух ты, я действительно удивлен, что здесь все неправильные ответы.PNG-8 всегда будет меньше GIF при правильной оптимизации.Просто запустите файлы PNG-8 через PNGCrush или любую другую процедуру оптимизации PNG.
Ключевые вещи, которые нужно понять:
- PNG8 и GIF без потерь <= 256 цветов
- PNG8 всегда может быть меньше GIF.
- GIF никогда не следует использовать, если вам не нужна анимация.
и конечно,
- Используйте JPG для черно-белых или полноцветных фотографических изображений.
- Используйте PNG для низкоцветных, штриховых рисунков и изображений типа скриншотов.
Основная причина использования PNG вместо GIF с юридической точки зрения описана здесь:
http://www.cloanto.com/users/mcb/19950127giflzw.html
Срок действия патентов, очевидно, истек в 2004 году, но идея о том, что вы можете использовать PNG как открытый исходный код вместо GIF, нравится многим людям.
(ссылка на открытый исходный код png: http://www.linuxtoday.com/news_story.php3?ltsn=1999-09-09-021-04-PS)
Будьте осторожны с изменением цвета при использовании PNG.Эта ссылка дает пример и содержит еще много ссылок с дальнейшим объяснением:
http://www.hanselman.com/blog/GammaCorrectionAndColorCorrectionPNGIsStillTooHard.aspx
Изображения GIF не подвержены этой проблеме.
Я не думаю, что это имеет большое значение (клиентов это не волнует).Лично я бы выбрал PNG, потому что они являются стандартом W3C.
Будьте осторожны с эффектами прозрачности PNG:они не работают с IE6.
Что касается изображений в Интернете, каждый формат имеет свои плюсы и минусы.Для изображений фотографического типа (т. е. с большим количеством цветов, без резких краев) используйте JPEG.
Для значков и тому подобного у вас есть выбор между PNG и GIF.GIF-файлы ограничены 256 цветами.PNG можно форматировать как GIF (т. е. 256 цветов с 1-битной прозрачностью, которая будет работать в IE6), но для небольших изображений они немного больше, чем GIF-файлы.24-битные PNG поддерживают как широкую гамму, так и альфа-прозрачность (хотя в IE6 это проблематично).
PNG — ваш единственный действительно разумный выбор для таких вещей, как снимки экрана (т. е. как много цветов, так и и резкие края), и лично я придерживаюсь этого большую часть времени, если только у меня нет чего-то, для чего JPEG больше подходит (например, фотографии).
Индексированный PNG (менее 256 цветов) на самом деле всегда меньше GIF, поэтому я использую его большую часть времени.
Для компьютерной графики (т.е.нарисованный вами в Photoshop, Gimp и т.п.) О JPG не может быть и речи, поскольку он с потерями - т.е.вы получаете случайные серые пиксели.Для статических изображений PNG лучше во всех отношениях:больше цветов, масштабируемая прозрачность (скажем, прозрачность 10 %, .gif поддерживает только 0 % и 100 %), но существует проблема: некоторые версии Internet Explorer не поддерживают прозрачность PNG правильно, поэтому вы получаете плоский непрозрачный фон. это выглядит некрасиво.Если вас не волнуют пользователи IE, выберите PNG.
Кстати, если вам нужна анимация, выберите GIF.
PNG является 100% заменой файлов GIF и поддерживается всеми веб-браузерами, с которыми вы можете столкнуться.
Существует очень и очень мало ситуаций, когда GIF будет предпочтительнее.Самым важным из них является анимация: стандарт GIF89a поддерживает анимацию, и практически каждый браузер поддерживает ее, но старый добрый формат PNG не поддерживает — для этого вам придется использовать MNG, поддержка которого в браузерах ограничена.
Практически все браузеры поддерживают однобитовую прозрачность в файлах PNG (тип прозрачности, предлагаемый форматом GIF).В IE6 отсутствует поддержка полной 8-битной прозрачности PNG, но в большинстве ситуаций это можно исправить с помощью небольшого волшебства CSS.
Если ваши файлы PNG получаются больше, чем эквивалентные файлы GIF, это почти наверняка потому, что ваше исходное изображение содержит более 256 цветов.Файлы GIF индексируются с максимальной палитрой в 256 цветов, а файлы PNG в большинстве графических программ по умолчанию сохраняются в 24-битном формате без потерь.Если размер файла более важен, чем точные цвета, сохраните файл как 8-битный индексированный PNG, который должен быть эквивалентен GIF или лучше.
Можно «взломать» файл GIF, чтобы он содержал более 256 цветов, используя комбинацию кадров анимации с флагами «не заменять» и несколькими палитрами, но об этом подходе практически забыли с появлением PNG.
Основная проблема с GIF-файлами заключается в том, что это формат, запатентованный (EDIT:Видимо, это уже не так).Если вас это не волнует, смело используйте GIF-файлы.PNG имеют гораздо большую гибкость по сравнению с GIF, особенно в области цветового пространства, но эта гибкость часто означает, что вам нужно «оптимизировать» PNG перед их публикацией.Для этого веб-поиск должен найти инструменты для вашей платформы.
Конечно, если вам нужна анимация, GIF — единственный вариант, поскольку по какой-то причине MNG практически не использовался.
«Возможно, дело в инструментах, которые я использую, но файлы GIF обычно кажутся немного меньше, чем сопоставимый PNG, но их использование кажется чем-то вроде 1987 года».
Вероятно, это ваши инструменты.Из часто задаваемых вопросов по PNG:
«Есть две основные причины этого явления:сравнивая яблоки и апельсины (то есть не сравнивая одни и те же типы изображений) и используя плохие инструменты». продолжение...
Но вы всегда можете попробовать сохранить оба варианта (используя одну и ту же глубину цвета) и посмотреть, какой из них получится меньше.
Конечно, если вы хотите стандартизировать один графический формат для своего сайта, лучше всего использовать PNG.
Лично я довольно часто использую GIF-файлы для своих изображений, поскольку они работают везде, очевидно, что ограничение прозрачности является одним из ключевых элементов, который может направить кого-то к определенному формату.
Я не вижу никаких недостатков в использовании gif.
Если они становятся меньше и вы не можете ничего получить от использования функций PNG (а именно прозрачности альфа-канала и более 256 цветов), то я не вижу причин, по которым вам следует использовать PNG.
gif-файлы будут иметь тенденцию быть немного меньше, поскольку они не поддерживают альфа-канал прозрачности (и, возможно, по некоторым другим причинам).Лично я не считаю, что из-за разницы в размерах действительно стоит беспокоиться так сильно, как раньше.Большинство людей сейчас используют Интернет с какой-либо широкополосной связью, поэтому я сомневаюсь, что они заметят разницу.
Вероятно, более важно использовать тот тип изображений, с которым ваши инструменты манипуляции работают лучше всего.
Кроме того, мне нравится возможность поместить изображение на любой фон и использовать тень, что больше указывает мне на формат PNG.
Обычно я использую GIF-изображения из-за их размера, но есть также PNG-8, который также содержит 256 цветов.
Если вам нужны необычные полупрозрачные материалы, используйте png-24.
Обычно я использую функцию «Сохранить для Интернета» в Photoshop, которая позволяет вам менять тип файла, количество цветов и т. д. и видеть результат перед сохранением.Конечно, я бы использовал самый маленький из возможных, который по-прежнему хорошо смотрится в моих глазах.
Я использую jpg для всех непрозрачных изображений.Вы можете контролировать сжатие, что мне нравится.я нашел этот веб-сайт, который сравнивает их.jpg меньше и выглядит лучше.
