Для чого використовують графіку на web-сторінках?

Зображення можуть нести певну інформацію, та і просто надають Web-сторінці привабливому вигляду. Приведемо найбільш поширені випадки застосування зображень:

• логотип компанії на діловій сторінці;

• графіка для рекламного оголошення;

• різні малюнки;

• діаграми і графіки;

• художні шрифти;

• підпис автора сторінки;

• застосування графічного рядка як горизонтальна розділова лінія;

• застосування графічних маркерів для створення красивих маркірованих списків.

Графічні формати web-сторінок.

Основними форматами рисунків, що відображаються програмами браузерів, є GIF (скорочення від «Graphics Interchange Format» — графічний формат обміну) і JPEG (скорочення від «Joint Photographic Experts Group» — об’єднана група експертів фотографії).

Файли формату GIF (розширення .gif) мають малий обсяг завдяки тому, що в них використовується палітра з 256 кольорів і застосовується алгоритм стиснення без втрат Лемпеля — Зіва. Цей алгоритм особливо ефективний під час обробки простих ілюстрацій з великими ділянками одного кольору. Формат GIF широко застосовується для створення «прозорих» рисунків, а також зображень, що завантажуються черезрядковим методом. Приклади черезрядкового завантаження ви, напевно, бачили при перегляді Web-сторінок в Інтернеті: спочатку завантажується простий варіант рисунка з великим розміром точок зображення, потім у процесі завантаження рисунка точки зображення зменшуються, і рисунок ніби виявляється. Ще однією перевагою GIF-формату є можливість використання анімації. У файлі GIF можна створити послідовність рисунків — кадрів «мультфільму», що є найпростішим способом додавання анімації на Web-сторінки.

Інший графічний формат, JPEG (розширення .jpg або .jpeg), звичайно застосовується для зображень з більшою кількістю кольорів, наприклад, для фотографій. У цьому форматі застосований метод стиснення з втратами. При збереженні високоякісних зображень JPEG займає на диску набагато менше місця, ніж GIF. Однак формат JPEG не підтримує функції прозорості й анімації.

Існує ще один формат створення рисунків для Web-сторінок — це PNG (скорочення від «Portable Network Graphics» — мережна графіка, що переноситься). Подання зображень у вигляді PNG-файлів застосовується як альтернатива формату GIF і є перспективним для застосування в мережних додатках. Перевагою цього формату порівняно з форматом GIF є компактність файлів і достатня якість передачі кольорів.

Основний синтаксис додавання зображень на сторінку:

<img src=”шлях/до/зображення.jpg” атрибути>

<img> – непарний тег, і “src” – обов’язковий атрибут з адресою зображення.

Також часто використовують атрибути: “alt”, “title”, “width”, “height”, і т.д.

“alt” – альтернативний текст для зображення, тобто текст, який буде показуватись, якщо картинка не може бути завантажена.

“title” – текст, який буде показано, при наведенні вказівника миші на картинку.

“width” – довжина зображення.

“height” – висота зображення.

Атрибути

align - Визначає як малюнок буде вирівнюватися по краю і спосіб обтікання текстом

alt - Альтернативний текст для зображення.

border - Товщина рамки навколо зображення.

height - Висота зображення.

hspace - Горизонтальний відступ від зображення до навколишнього контенту.

ismap - Каже браузеру, що картинка є серверної картою-зображенням.

longdesc - Вказує адресу документа, де міститься анотація до картинки.

lowsrc - Адреса зображення низької якості.

width - Ширина зображення.

src - Шлях до графічного файлу.

vspace - Вертикальний відступ від зображення до навколишнього контенту.

usemap - Посилання на тег <map> , що містить координати для клієнтської карти-зображення.

№ 1. Підготуйте кілька фото по вашій темі і додайте їх до вашого документа. (Фотографії або зображення можна взяти з інтернету)

Для зарахування завдання надішліть html файл через форму

Оцінка: +4 бали

Здати роботу