Реферат на тему:

Методика вивчення базових понять web-дизайну студентами гуманітарних
спеціальностей ВНЗ

Нині широко розповсюдженою є глобальна мережа Internet, базовим
протоколом якої, тобто стандартом передавання даних, є WWW (від англ.
World Wide Web – світова павутина). У загальному сенсі протоколом
називають сукупність правил взаємодії клієнта та серверу. У свою чергу
поняття WWW, тобто світової павутини сторінок, тісно пов’язане з HTML
(від англ. Hiper Text Markup Language – мова розмітки гіпертексту).
Гіпертекст є системою взаємопов’язаних сторінок, а гіпертекстове
посилання – це невеликий підкреслений і виокремлений іншим кольором
текст у документі, картинка чи інший елемент, клацнувши на якому мишею,
отримують доступ до пов’язаного з ним об’єкта, наприклад, тексту,
малюнка, музичного або відеофайлу, іншої сторінки тощо.

Web-сторінка є HTML документом, тобто текстовим файлом на мові HTML
(розширенням *.htm або *.html), розміщеним у World Wide Web.
Web-сторінка, крім тексту, може містити гіпертекстові посилання, за
допомогою яких можна переходити до інших Web-сторінок і переглядати їх.
Web-сторінка може також містити вставки у вигляді графіки, анімації,
відеокліпів і музики. Для перегляду Web-сторінок використовують
програми-броузери MicroSoft Internet Explorer або NetScape Navigator, а
також Opera, Mozilla.

У зв’язку з широким розповсюдженням Internet постає питання вивчення
понять про сервіси глобальної мережі студентами не лише технічних та
фізико-математичних спеціальностей, але й гуманітарних факультетів. Мета
повноцінного розкриття методики навчання web-дизайну потребує розгляду
історії створення та використання HTML.

Мова HTML була розроблена Тімом Бернерс-Лі під час його роботи в CERN і
набула поширення завдяки браузеру Mosaic, розробленому в NCSA. У 90-х
роках ХХ ст. HTML стала особливо популярною завдяки швидкому росту Web.
У цей час HTML була розширена й доповнена. У Web є дуже важливим
використання однакових стандартів HTML всіма авторами Web-сторінок і
виробниками програмного забезпечення. Це є основною причиною спільної
роботи над специфікаціями мови HTML.

HTML 2.0 (листопад 1995) була розроблена під егідою Internet Engineering
Task Force (IETF) для впорядкування загальноприйнятих положень
наприкінці 1994 року. HTML+ (1993) і HTML 3.0 (1995) – це більш
функціональні версії мови HTML. Зусилля робочої групи World Wide Web
Consortium з HTML у впорядкуванні загальноприйнятих положень у 1996 році
призвели до версії HTML 3.2 (січень 1997).

Документи HTML мають працювати в різних браузерах і на різних
платформах. Досягнення сумісності знижує витрати авторів, оскільки вони
можуть розробляти тільки одну версію HTML документа. Інакше виникає
ризик, що Web буде лише сумішшю несумісних форматів, що врешті решт
призведе до зниження комерційного потенціалу Web для всіх його
користувачів.

У кожній версії HTML робилася спроба відобразити все більшу кількість
угод між працівниками й користувачами цієї індустрії, щоб зусилля
авторів не були витрачені марно, а їх документи були б доступними для
користувачів Internet. Мова HTML розроблялася з того погляду, що всі
типи електронних пристроїв повинні мати можливість використовувати
інформацію у Web: комп’ютери з графічними дисплеями, персональні
помічники, стільникові телефони, електронні перекладачі і т.ін. У HTML
4.0 уводяться механізми таблиць стилів, скриптів, форм, вбудовування
об’єктів, поліпшена підтримка різних напрямків тексту, використовуються
таблиці з великою кількістю можливостей, а також забезпечено кращі
можливості роботи для людей з фізичними вадами. Версія HTML 4.0
розроблена за допомогою експертів у галузі інтернаціоналізації, тому
документи можна створювати будь-якою мовою і легко передавати їх у
будь-яку точку світу.

Важливим кроком стало прийняття стандарту ISO/IEC:10646, що визначає
набір символів для документів HTML. Це найбільш змістовний у світі
стандарт, у якому вирішено питання подання національних символів,
напрямку тексту, пунктуації тощо. HTML тепер надає кращу підтримку
різних мов у одному документі. Це забезпечує більш ефективне
індексування документів для пошукових машин, друк вищої якості, зручніші
переноси й т.ін.

Але найбільші можливості HTML можна отримати лише завдяки використанню
спеціальних програмних засобів web-дизайну. Програми для web-дизайну
дозволяють: 1) створювати й редагувати Web-сторінки (наприклад, власну
домашню Web-сторінку, яку можна потім розмістити в Інтернет); 2)
редагувати документи HTML, отримані з Інтернету, так, щоб функціонували
всі вбудовані в документ об’єкти (картинки, анімації і т.ін.);
3) створювати мультимедійні презентації, шоу, демонстраційні проекти
завдяки гіпертекстовим посиланням і можливості вставляти в документ HTML
малюнки, діаграми, анімації, відеокліпи, музичний і мовний супровід,
текстові спецефекти (наприклад, рядок, що біжить).

Існують три основних способи створення Web-сторінок (або документів
HTML): 1) використання текстового редактора Блокнот (NotePad),
убудованого в Windows, і перегляд результатів за допомогою броузера. Цей
найпростіший спосіб рекомендується початківцям. Його ми використовуємо
як основу методики навчання web-дизайну; 2) використання спеціальних
редакторів документів HTML, наприклад Hot Metal Light, Hot Dog
Professional, MS Front Page, HTMLPad і ін.; 3) використання редактора
Word для створення тексту документа, що потім конвертується в
HTML-формат.

??Т?ад: . Кінцевий тег завжди завершується навскісною рискою:
. 3. Гіперпосилання – фрагмент тексту, що є посиланням на інший
файл або об’єкт. Гіперпосилання дозволяють переходити від одного
документа до іншого. 4. Фрейм – область гіпертекстового документа із
власними смугами прокручування. 5. Апплет – програма, передана на
комп’ютер клієнта у вигляді окремого файлу, яка запускається при
перегляді Web-сторінки. 6. Скрипт – програма, включена до складу
Web-сторінки для розширення її можливостей. 7. Завантаження (DownLoad) –
копіювання документа з Web-сервера на комп’ютер клієнта. UpLoad –
копіювання документа з комп’ютера клієнта на Web-сервер –
використовується при створенні власної Web-сторінки (тобто при її
опублікуванні).

Мета повноцінного розкриття цих понять неможлива без використання
педагогічної технології навчання. У загальному випадку педагогічна
технологія – це комплекс форм, методів, прийомів, технічних засобів
впливу на слухача для реалізації мети та завдань навчання.

Розглянемо технологію вивчення алгоритму створення найпростіших
web-сторінок мовою HTML. Загальна ідея методики навчання створення
Web-сторінки така: у редакторі Блокнот створюється файл Web-сторінки, що
зберігається з розширенням *.htm. Потім цей файл завантажується й
переглядається програмою Internet Explorer. Для виклику редактора
Блокнот з метою редагування файлу Web-сторінки під час її перегляду в
Internet Explorer використовується пункт меню Вид, Перегляд HTML коду
або у вигляді HTML. Після збереження файлу й виходу з Блокнота для
перегляду відредагованої сторінки треба натиснути клавішу F5 або кнопку
“Обновити” на панелі інструментів Internet Explorer.

Ми пропонуємо алгоритм, виконання якого призводить до засвоєння базових
понять з web-дизайну. Завантажте програму текстового процесора або
редактора, яку ви використовуєте для створення Web-сторінки. Наприклад,
Microsoft WordPad. Уведіть текст, який має відображатися на
Web-сторінці. Натисніть на кнопці Збережіть документ панелі
інструментів. Відкриється діалогове вікно “Зберегти як”. У полі “Ім’я
файлу” введіть ім’я файлу Web-сторінки. Не забувайте вказати розширення
імені файлу – .htm або .html.

Примітка: правила йменування файлів Web-сторінок звичайні і
встановлюються операційною системою (в даному випадку Windows). Головну
сторінку сайту прийнято називати index.html.

У полі списку Папка, що розкривається, відображається назва поточного
каталогу, в якому програма збереже вашу Web-сторінку. Щоб перейти до
іншої папки, натисніть мишею у межах названого поля. Натисканням лівої
кнопки миші відкрийте список Тип файлу, який перелічує доступні формати
збереження документів. Виберіть елемент Текстовий документ. Натисніть на
кнопці Зберегти. Відкриється вікно повідомлення, яке говорить про те, що
всі ознаки форматування тексту будуть загублені. У нашому випадку
форматування є несуттєвим, тому натисніть на кнопку Так, щоб підтвердити
збереження Web-сторінки.

Уведіть на початку сторінки. Цей тег описує документ як
Web-сторінку, виконану у форматі HTML. Наберіть у кінці
сторінки. Уведіть під тег . Він указує на наявність тексту,
який містить найменування сторінки й додаткові відомості. Два рази
натисніть клавішу . Наберіть . Уведіть під тегом<br /> <HEAD>. Він призначений для позначення заголовку сторінки. Текст кожної<br /> сторінки, яку ми створюємо, повинен уключати її заголовок, який звичайно<br /> відображається в рядку заголовка вікна броузера. Назва Web-сторінки може<br /> бути набрана за допомогою символів букв, цифр і пробілу.</p> <p>Наберіть текст назви Web-сторінки, використовуючи тільки символи букв і<br /> цифр. Введіть . Уведіть під тегом . Тег
вказує на початок тіла Web-сторінки. У цьому розділі розміщуються весь
текст, графічні зображення, таблиці й інші елементи сторінки, що
побачить відвідувач, який звертається на сайт. Наберіть над
тегом . Завантажте програму Web-броузера, за допомогою якої
будете переглядати зміст сторінки. Наприклад, Microsoft Internet
Explorer.

Щоб відкрити Web-сторінку у вікні броузера, натисніть у межах меню Файл.
Виберіть елемент Відкрити. Відкриється діалогове вікно Відкрити.
Натисніть на кнопці Обзор, щоб перейти до потрібного файлу сторінки,
розміщеної на одному із локальних або мережених дисків. Відкриється
діалогове вікно Microsoft Internet Explorer.

Рис.1 Просмотр HTML кода

У полі списку Папка, що розкривається, діалогового вікна Microsoft
Internet Explorer відображається найменування поточного каталогу. Щоб
вибрати іншу папку, натисніть у межах цього поля. Натисніть на
піктограмі, яка відповідає необхідному файлу Web-сторінки. Натисніть на
кнопці Відкрити. Натисніть на кнопці ОК діалогового вікна Відкрити. У
вікні броузера з’явиться зображення вибраної Web-сторінки.

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

Рис.2 Відображення результату у вікні браузера

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

ЛІТЕРАТУРА

1. Вейтман В. Программирование для Web.: Уч. пос.: – М.: Издательский
дом “Вильямс”, 2000. – 368 с.

2. Глинський Я.М., Ряжська В.А. Інтернет. Сервіси, HTML і Web-дизайн:
Навч. посібн. – 3-є вид. – Львів: Деол, СПД Глинський, 2005. – 192 с.

3. Крамер Э. HTML: наглядный курс Web-дизайна. – М.: Издательский дом
“Вильямс”, 2001. – 304 с.

4. Нильсен Я., Тахир М. Дизайн Web-страниц. Анализ удобства и простоты
использования 50 узлов: Уч. пос. – М.: Издательский дом “Вильямс”, 2002.
– 336 с.

Похожие записи