ОСНОВИ WEB-ДИЗАЙНУ
Тема
заняття: Основи веб-дизайну.
Мета: навчитись
створювати структуру веб-сторінки.
І. Теоретична частина
1.
Поняття: WEB, браузери та HTML.
World Wide Web (WWW),
або просто WEB,
у перекладі означає «світова павутина». WEB — це всесвітня
інформаційна мережа, яка містить великий набір файлів та документів, що є
складовими сотень тисяч комп’ютерів. Ці файли мають назву веб-сторінок і
розміщені на численних комп’ютерах — веб-серверах, розкиданих по всьому світу. Для перегляду
веб-сторінок використовують спеціальні програми, які називають веб-браузерами.
Існує велика кількість програм-браузерів, розроблених різними компаніями, однак
сьогодні найпопулярнішими є Opera, Mozilla Firefox та Internet Explorer. Для створення
веб-сторінок використовують спеціальну мову розмітки — HTML (англ. Hyper Text Markup Language — мова
розмітки іїпертексту).
Гіпертекст — це текст або
документ, у якому містяться посилання на інші документи. Головна мета застосування
мови HTML —
описати зовнішній вигляд документа. Це можна зробити за допомогою спеціальних
кодів, що називаються тегами
або
дескрипторами.
Створити
веб-сторінку можна в будь-якому текстовому редакторі. Є також спеціальні
редактори для створення HTML-документів.
Теги
бувають парні (теги-контейнери)
і непарні
(ті,
які не потребують закривального тега), їх беруть у кутові дужки <...>.
Для написання тегів використовують як маленькі, так і великі літери. Перед
закривальним тегом обов’язково ставлять «/».
2.
Структура HTML-документа.
Першим
тегом у документах HTML має бути тег-контейнер <HTML>,
а
останнім — тег </HTML>. Наявність цих
тегів говорить про те, що рядки між ними утворюють єдиний HTML-документ. Сам
файл складається з двох розділів: розділу заголовка, що обмежений
тегом-контейнером <HEAD>, та розділу, що
становить тіло документа та обмежений тегом-контейнером <BODY>.
У
заголовку можна вказати назву документа за допомогою тега-контейнера <TITLE>.
II. Практична
частина
Відкрийте
програму WordPad або Блокнот і у файлі нового документа наберіть
такий текст (рис. 1)
<HTML>
<HEAD>
<ТІТLЕ>Моя веб-сторінка</TITLE>
</HEAD>
<BODY>
Мій HTML-документ
</BODY>
</HTML>
Збережіть
цей файл під ім’ям document.htm або document.html (HTML-файли
мають розширення .htm або .html).
Відкрийте
цей файл у вікні браузера Internet Explorer
(для
цього в меню Файл потрібно вибрати команду Открыть і, скориставшись кнопкою Обзор, знайти файл document.html). У вікні браузера з’явиться створена
вами веб-сторінка. Для того, щоб у вікні браузера Internet Explorer переглянути текст створеного HTML-документа,
потрібно в меню Вид вибрати команду Просмотр HTML-кода або, натиснувши на праву кнопку
миші, у тому меню, яке розкриється, вибрати команду Просмотр HTML-кода. Усі веб-сторінки мають однакову
структуру.
Контрольні
запитання:
1. Що таке WEB?
2. Що таке веб-браузери?
3. Що таке HTML?
4. Яку структуру має HTML-документ?
5. Яке розширення мають HTML-файли?
