Форматы изображений для сайта.

Сегодня мы с Вами поговорим о различных форматах изображений используемых на web-страницах. На первый взгляд может показаться: "А что тут думать? Взял любое фото и разместил на сайте. . . " . Да действительно, взял и разместил, но - это только на первый взгляд. От того как и в каком формате подготовлено изображение (фотография, рисунок, чертеж, анимированная картинка и т. д. ), многое зависит. Например: как долго будет грузится Ваша web-страница, какого качества будет этот рисунок (фото) и т. д.

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

Наиболее широкое распространение для веб-графики получили два формата — GIF и JPEG. Их многофункциональность, универсальность, небольшой объем исходных файлов при достаточном для сайта качестве, сослужили им положительную службу, фактически определив их как стандарт web-изображений. Есть еще формат PNG, который также используется про создании сайтов и существует в двух ипостасях — PNG-8 и PNG-24. Однако популярность PNG сильно уступает признанию форматам GIF и JPEG.

Добавление изображения происходит в два этапа: вначале готовится графический файл желаемого размера, затем он добавляется на страницу через тег . Сам HTML предназначен только для того, чтобы отобразить требуемую картинку, при этом никак ее не меняя. О подготовке картинок для web-страниц мы с Вами разговаривали в статье: "Подготовка изображение для вашего сайта. " Поэтому здесь будем рассматривать только форматы изображений.



Формат GIF

GIF (Graphics Interchange Format) — формат графических файлов, широко применяемый при создании сайтов. GIF использует 8-битовый цвет и эффективно сжимает сплошные цветные области, при этом сохраняя детали изображения.

Особенности:

Количество цветов в изображении может быть от 2 до 256, но это могут быть любые цвета из 24-битной палитры. Файл в формате GIF может содержать прозрачные участки. Если используется отличный от белого цвета фон, он будет проглядывать сквозь «дыры» в изображении. Поддерживает покадровую смену изображений, что делает формат популярным для создания баннеров и простой анимации. Использует свободный от потерь метод сжатия Область применения: Логотипы, иллюстрации с четкими краями, анимированные рисунки, изображения с прозрачными участками, баннеры.



Формат JPEG

JPEG (Joint Photographic Experts Group) — популярный формат графических файлов, широко применямый при создании сайтов и хранения изображений. JPEG поддерживает 24-битовый цвет и сохраняет яркость и оттенки цветов в фотографиях неизменными. Данный формат называют сжатием с потерями, поскольку алгоритм JPEG выборочно отвергает данные. Метод сжатия может внести искажения в рисунок, особенно содержащий текст, мелкие детали или четкие края. Формат JPEG не поддерживает прозрачность. Когда вы сохраняете фотографию в этом формате, прозрачные пиксели заполняются определенным цветом.

Особенности:

Количество цветов в изображении — около 16 миллионов, что вполне достаточно для сохранения фотографического качества изображения. Основная характеристика формата — качество, позволяющее управлять конечным размером файла. Поддерживает технологию, так называемый прогрессивный JPEG, в котором версия рисунка с низким разрешением появляется в окне просмотра до полной загрузки самого изображения. Область применения: Используется преимущественно для фотографий. Не очень подходит для рисунков содержащих прозрачные участки, мелкие детали или текст.



Формат PNG-8

PNG-8 (Portable Network Graphics) — формат по своему действию аналогичен GIF. По заверению разработчиков использует улучшенный формат сжатия данных, но как показывает практика, это не всегда так.

Особенности:

Использует 8-битную палитру (256 цветов) в изображении, за что и получил в своем названии цифру восемь. При этом можно выбирать, сколько цветов будет сохраняться в файле — от 2 до 256. В отличие от GIF, не отображает анимацию ни в каком виде. Область применения: Текст, логотипы, иллюстрации с четкими краями, изображения с градиентной прозрачностью.



Формат PNG-24

PNG-24 — формат, аналогичный PNG-8, но использующий 24-битную палитру цвета Подобно формату JPEG, сохраняет яркость и оттенки цветов в фотографиях. Подобно GIF и формату PNG-8, сохраняет детали изображения, как, например, в линейных рисунках, логотипах, или иллюстрациях

Особенности:

Использует примерно 16,7 млн. цветов в файле, из-за чего этот формат применяется для полноцветных изображений. Поддерживает многоуровневую прозрачность, это позволяет создавать плавный переход от прозрачной области изображения к цветной, так называемый градиент. Из-за того, что используемый алгоритм сжатия сохраняет все цвета и пикселы в изображении неизменными, если сравнивать с другими форматами, то у PNG-24 конечный объем графического файла получается наибольшим. Область применения: Фотографии, рисунки, содержащие прозрачные участки, рисунки с большим количеством цветов и четкими краями изображений



Придерживаясь рекомендаций этой статьи, Вы сможете без труда добиться наилучшего качества отображения графических файлов на Ваших web-страницах.

Автор: Андрей Краснокутский

www. pc-cantri. ru/
22:03 24.03.2017



Отзывы и комментарии
Ваше имя (псевдоним):
Проверка на спам:

Введите символы с картинки:



Форматы изображений для сайта.

Форматы изображений для сайта.

Сегодня мы с Вами поговорим о различных форматах изображений используемых на web-страницах. На первый взгляд может показаться: "А что тут думать? Взял любое фото и разместил на сайте. . . " . Да дейст...
Международные грузоперевозки-корни возникновения кризиса

Международные грузоперевозки-корни возникновения кри...

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

Дома или в кино посмотреть фильм?

Кинофильмы, как средство общения, имеет очень хороший эффект. Грамотный ход на первом свидании с девушкой позвать ее на просмотр кино – тема для разговора уже найдена: посмотрели кино, поговорили о не...
Научимся дружить со стрессом?

Научимся дружить со стрессом?

Стресс — это не то, что с нами случилось, А то, как мы это воспринимаем. (Ганс Селье) Нелюбимая работа, проблемы в семье, деловые конфликты, неудавшийся отпуск, недосыпы и перекусы &md...
Кто такая Сабиха Гекчен? История любви и неба

Кто такая Сабиха Гекчен? История любви и неба

Сабиха Гекчен… Кто-то ее называет дочерью Кемаля Ататюрка, кто-то женой — это запутанная история, но эта девочка армянского происхождения реализовала мечту Кемаля о небе… Саб...
Вкусные рецепты: kotletki, Нежные РЫБНЫЕ котлетки в сливочном соусе с зеленью, Фруктовое ассорти в кляре.

Вкусные рецепты: kotletki, Нежные РЫБНЫЕ котлетки в ...

kotletkikartoszku svarit v mundire,obrac i dat ostyt ris prigotovic do gotovnosti,dat ostyt luk porezat dronym kubikom,morkovku na terke i vse vmeste tuszyt na liubom zyru(kto kak liubit) pod konec po...
Популярное

Вкусные рецепты: сырный суп с вешенками, Сандеш с

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

Как стать стройными и красивыми с помощью сахара и

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

Китайские телефоны – новая ступень развития

Сегодня у каждого человека независимо от возраста, статуса и положения, будь-то он школьник, студент...

Выращивание спаржи

Среди читателей наверняка найдутся ценители полезного и деликатесного продукта – спаржи. Вырастить э...

Vista: использовать гибернацию или нет?

Что такое гибернация hibernate (англ. ) — 1) находиться в зимней спячке (о животных); зим...

Настройка eMule

Установка мула и его моды. Рекомендую не пользоваться инсталлятором, а использовать бинарники, котор...

Что можно увидеть в Риме всего за один день? Прогу

Колизей — от слова «колоссальный». Действительно, постройка была грандиозная ...

Как сделать шикарную клумбу из однолетников?

Использование цветов в озеленении — это настоящее искусство. Кто не желал бы своими ...

Как определяется удостоверение монтажника

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

Как быстро привести дом в порядок? Заведите кошку!

Нет, роль домработницы кошка, конечно, выполнять не станет. Но быстро научит вас самих некоторым нов...



О информационном портале:

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

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