Привет!
Переделал недавно страницу уроки wordpress, и пока делал, обнаружил, что многие верстальщики не знают, какой формат лучше использовать для изображений с прозрачным фоном: png-8 или png-24, и в чем вообще различия. В этой статье я объясню в чем различия, и расскажу, в каком случае какой формат больше подойдет. Не секрет, что верстальщики работают в первую очередь с фотошопом. А там, при сохранении изображения для веб, есть возможность выбрать формат. Если изображение не имеет прозрачности, то рекомендую использовать jpg, с качеством 60-70%. Такой процент не сильно снизит качество, зато очень даже неплохо снизит вес изображения.
Как известно, вес изображений на сайте напрямую влияет на скорость загрузки сайта.
Какой выбрать формат для прозрачных изображений?
Существует 2 формата, поддерживающих прозрачность: gif и png. Раньше все использовали gif, т.к. он лучше всего сжимал изображения. Впоследствии появился png с новым алгоритмом сжатия, и изображения стали весить еще меньше. На качестве это отразилось только с лучшей стороны.
Так потихоньку начал уходить с рынка формат gif. Используют его теперь практически только для анимации.
png-8 или png-24: какой формат выбрать?
Основное различие в этих форматах в том, что png-8 использует только 256 цветов, в то время, как png-24 использует 16 миллионов. Так что изображения формата png-8 весят меньше, нежели png-24.
Отсюда следует, что формат можно и нужно выбирать в зависимости от цветности картинки. Если изображение абстрактное (такое очень зачастую содержит много разных цветов), то очень желательно сохранять его в формате png-24.
Если на изображении встречается мало цветов, то я настоятельно рекомендую использовать png-8.
В любом случае большинство из нас работают в фотошопе, и там есть предпросмотр оптимизированного изображения. Экспериментируйте! Попробуйте png-8, если результат неудовлетворительный - переходите на png-24.
В одной из следующих статей я поделюсь с вами секретом оптимизации изображений. Ведь после фотошопа они далеко не максимально сжимаются. Поэтому подписывайтесь на рассылку, и будьте всегда в курсе!
Ну вот, сегодня мы узнали разницу между форматами png-8 и png-24. Это все, что я хотел сегодня донести. Увидимся с Вами в следующих уроках!
До скорых встреч и успехов!