Планирование уроков на учебный год (по учебнику К.Ю. Полякова, Е.А. Еремина, полный углублённый курс, по 4 часа в неделю)



Урок 48
Рисунки на веб-страницах
(§27. Рисунки)




Содержание урока

Форматы рисунков

Рисунки в документе

Фоновые рисунки

Вопросы и задания


Форматы рисунков


Рисунки хранятся на веб-серверах в виде отдельных файлов и подключаются к веб-странице с помощью тэга <img>. Браузеры умеют работать с тремя форматами растровых рисунков: GIF, JPEG и PNG.

Файлы с рисунками в формате GIF (англ. Graphic Interchange Format — формат для обмена графикой) обычно имеют расширение gif. Этот формат использует один из наиболее эффективных алгоритмов сжатия информации без потерь — LZW-алгоритм и позволяет хранить изображения с палитрой (до 256 цветов), в том числе и анимированные. Некоторые области рисунка можно сделать прозрачными, через них будет виден фон веб-страницы. Рисунки в формате GIF применяются для кодирования чётких изображений (схем, чертежей) или мелких деталей, имеющих не более 256 цветов.

Рисунки в формате JPEG (англ. Joint Photographer Expert Group — объединённая группа экспертов по фотографии) хранятся в файлах с расширениями jpg или jpeg. Этот формат предусматривает сжатие с потерями, при котором теряются (размываются) некоторые мелкие детали. В файле хранится полноцветное изображение (не использующее палитру), глубина кодирования цвета — 24 бита на пиксель, что даёт возможность задавать более 16 млн цветов (режим True Color — «истинный цвет»). Формат JPEG применяется для хранения изображений с нечёткими границами, например фотографий.

Формат PNG (англ. Portable Network Graphic — переносимая сетевая графика) был создан для улучшения и замены формата GIF, поскольку он, в отличие от GIF, не требует лицензии на использование. Файлы имеют расширение png и могут хранить разные типы изображений:

• с палитрой (до 256 цветов);
• полноцветные с глубиной цвета 24 или 48 битов на пиксель.

В отличие от других форматов формат PNG поддерживает частичную прозрачность пикселей, что позволяет создавать многослойные изображения на веб-страницах. Для хранения степени прозрачности выделяется отдельный канал (так называемый альфа-канал, англ. alpha channel) — дополнительно 8 или 16 битов на пиксель. Такой формат называется RGBA: «Red — Green — Blue — Alpha». Главный недостаток формата PNG — низкая эффективность сжатия маленьких рисунков в сравнении с форматом GIF.

Для добавления векторных рисунков на веб-страницу применяют формат SVG (англ. Scalable Vector Graphics — масштабируемая векторная графика), который умеют обрабатывать все современные браузеры 1. Формат SVG можно использовать для хранения смешанных векторно-растровых изображений, а также анимированных рисунков. Большинство современных векторных редакторов (Inkscape, OpenOffice.org Draw, Adobe Illustrator, CorelDraw) может сохранять изображения в формате SVG.


1 Для Internet Explorer нужно установить специальное дополнение (плагин).





Следующая страница Рисунки в документе



Cкачать материалы урока






Наверх