Вправа 5. Додавання малюнка

Щоб додати на web-страницу, сформовану в попередніх вправах, логотип компанії, виконаєте наступні кроки.

1.  Помістите текстовий курсор в початок першого рядка web-страницы.

Примітка

У web-страницах всі малюнки прив'язуються до певної точки тексту, тобто вони є як би черговим символом. Тому для розміщення малюнка в довільних точках сторінки web-дизайнерам доводиться удаватися до різного роду хитрощам, наприклад розміщувати графічні об'єкти в осередках таблиць з невидимими рамками.

2. У рядку меню додатку розкрійте підміню Малюнок (Picture) меню Вставка (Insert) Відкриються всі можливості вставки малюнка, що надаються додатком:

• Картинки (Clip Art) — можливість вибрати малюнок з однойменної бібліотеки;

Мал. 23.10. Додавання малюнка

•  З файлу (From File) — при запуску цієї команди відкривається вікно діалогу, показане на мал. 23.10. Кнопки лівого ряду прискорюють доступ до потрібних файлів. Наприклад, щоб вставити малюнок, наявний в наборі файлів web-узла, що розробляється, потрібно клацнути на кнопці Мої документи і вибрати потрібний файл із списку; клацання на кнопці Робочий стіл (Desktop) полегшує доступ до графічного файлу, розташованому налокальном або мережевому диску; кнопка вебпапки (Web Folders) дозволяє проглядати теки і файли на web-серверах і мережевих пристроях і вибирати потрібні графічні файли. У поля Ім'я файлу (File Name) і Тип файлу (Filetype) можна ввести повний покажчик ресурсу, додавши таким чином об'єкт із заздалегідь відомою адресою;

•  З сканера або камери (From Scanner or Camera) — можливість отримувати зображення безпосередньо з сканера або іншого пристрою, що підтримує технологію TWAIN;

•  Створити фотоколекцію (New Photo Gallery) — вибір цієї команди дозволяє вставляти фотографії з колекції фотографій.

3.  Давайте скористаємося першим варіантом. Клацніть на кнопці Clip Art.

4.  В області завдань у вікні Вставка картинки (Clip Art Gallery) введіть в текстове поле слово Am ma Ls (Тварини) і клацніть на кнопці Знайти (Search).

5.  Знайдіть малюнок тигра, клацніть на нім і за допомогою покажчика миші перетягнете його на web-страницу.

6.  Клацанням виділите малюнок.

7.  Перетягнете кутовий маркер габаритної рамки малюнка, зменшивши зображення до потрібного розміру.

8.  Клацніть на малюнку правою кнопкою миші і виберіть в контекстному меню команду Властивості малюнка (Picture Properties).

Примітка

Не розміщуйте на web-страницах дуже великі малюнки, на їх завантаження з видаленого сервера потрібний багато часу. Це дратує користувачів.

Мал. 23.11. Параметри малюнка

9. На вкладці Загальні (General), показаною на мал. 23.11, виберіть положення перемикача GIF, щоб вказати формат, в якому повинен зберігатися малюнок.

10.  Клацніть на кнопці Огляд, розташованій праворуч від поля Розташування (Location).

11. У вікні, що відкрилося, двічі клацніть на файлі news.htm, який за задумом повинен містити загальну інформацію об компанії і основні новини. Тепер клацання на логотипі відкриватиме вказану сторінку.

12.  Розкрійте вкладку Вигляд (Appearance). Щоб текст, розташований праворуч від малюнка, вирівнявся по середині малюнка, виберіть в списку, що розкривається, Вирівнювання (Alignment) пункт По центру (Center).

13.  Клацніть на кнопці ОК.

14.  Щоб зберегти виконані зміни, виберіть команду Файл > Зберегти (File> Save).

15. У вікні діалогу Збереження упроваджених файлів (Save Embedded Files), показаному на мал. 23.12, клацніть на кнопці Змінити теку (Change Folder).

Мал. 23.12. Збереження упровадженого об'єкту

16.  Двічі клацніть у вікні, що відкрилося, на теці images, а потім на кнопці ОК, вказавши цим теку, в якій повинен зберігатися файл доданого малюнка.

17.  Клацніть на кнопці Перейменувати (Rename) і введіть ім'я logo.gif.

18.  Потім клацніть на кнопці ОК.

Ця операція приведе до перетворення зображення формату WMF, отриманого з бібліотеки Clip Art, у формат GIF, який на відміну від WMF може демонструватися будь-яким браузером. У результаті логотип буде записаний у файл logo.gif.