Тема по програмі


Скачати 64.49 Kb.
НазваТема по програмі
Дата31.03.2013
Розмір64.49 Kb.
ТипДокументи
bibl.com.ua > Інформатика > Документи
План заняття

виробничого навчання

 

Тема по програмі: Основи WEB- дизайну

Тема заняття: Робота з основними тегами HTML

Мета заняття: навчити учнів створювати WEB-документи за допомогою мови HTML.

Матеріально - технічне забезпечення уроку: персональні комп'ютери з операційною системою Windows, підключені до мережі, роздатковий матеріал, плакат.

 

Структура заняття

І. Вступний інструктаж

 

1.1. Організаційний момент: Привітання, перевірка готовності учнів до заняття, перевірка присутніх.

Оголошення теми, мети заняття.
1.2. Перевірка правил ТБ:

- Облаштованість робочих місць операторів ПЕОМ;

- Вимоги безпеки перед початком роботи;

- Вимоги безпеки під час роботи;

- Вимоги безпеки  по закінченню роботи.

 

1.3. Перевірка знань пройденого матеріалу:

 

Фронтальне опитування учнів  з попередньої теми:

 

  • Як запустити програму Internet Explorer?

  • Що таке пошукові сервери?

  • Для чого призначені  логічні слова?

  • Які самі популярні сервери Internet? 

  • Як створити WEB-документ у програмі WORD?

  

 

Інформація у World Wide Web представляється у вигляді гіпертекстових документів – Web-сторінок, які розміщаються на Web-вузлах.

Web-вузол – це постійно діючий комп’ютер, на дисках якого збері­гаються Web-сторінки. Такі комп’ютери створюють гіпертекстовий про­стір документів, доступ до яких можливий у будь-який час і з будь-якого під’єднаного до Internet комп’ютера. Для одержання інформації географіч­не розташування Web-вузлів не має значення. З однаковим успіхом можна одержувати інформацію як із сусідньої кімнати, так і з іншого континенту.

Для перегляду Web-сторінок потрібний Web-браузер – спеціальна програма. Популярним Web-броузером є Internet Explorer, який вбудовано безпосередньо в операційну систему Windows’98 (2000, NT тощо).

Браузер (“Обозреватель” – оглядач) здатний відображати на екрані текстову або графічну інформацію, а також звуки, анімацію і відео. Корис­тувач за його допомогою може переглянути потрібну Web-сторінку, купи­ти щось в електронному магазині, оплатити послуги і багато чого іншого.
Адреса Web-сторінки

Кожна Web-сторінка має свою унікальну адресу, за якою її можна знайти.

Адреса Web-сторінки у Всесвітній мережі Internet визначається уніфікованим покажчиком ресурсу – URL (Uniform Resource Locator) .

Адреса URL складається з трьох частин:

• Назва протоколу передачі гіпертексту (для служби WWW засто­совується протокол HTTP);

• Доменне ім’я сервера, де зберігається потрібний Web-документ;

• Повний шлях доступу до файла Web-документа на сервері.

адреса Web-сторінки може виглядати так: http://cws.internet.com/32menu.html

http:// - протокол передачі гіпертексту, мова Web
Створення та збереження Web- сторінки

Знайомство з вікном перегляду Web-сторінки

Після успішного завантаження на екрані з’являється Web-сторінка.

Після завантаження на екрані з’являється початкова Web-сторінка, відкриття наступних сторінок проводиться відповідними діями користувача.

Елементами вікна перегляду Web-сторінки можуть бути:

• Бігунки для пересування вздовж сторінки.

• Вкладки з назвами посилань на наступні сторінки.

• Каталог з назвами наступних сторінок.

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

• Панель для пошуку інформації на Web-сторінці.

Щоб перейти на наступну сторінку, досить перевести курсор миші на потрібне посилання на вкладці або в каталозі і клацнути, коли він набуде вигляду руки.

Простий приклад, обмежений ціми тегами, інтерпритується броузером як назва Web-стрінки і відображається у заголовку вікна броузера; збереження тексту в” БЛОКНОТІ”.

У цьому документі ви бачите заголовну частину, обмежену тегами,<HEAD>..(ввести інформацію) HEAD> і тіло документа вміщене між тегами <BODY>...BODY>. До заголовної частини вкладені теги <TITLE>...TITLE>.

Текст прикладу, обмежений цими тегами, інтерпретується браузером як назва Web-стрінки і відображається у заголовку вікна броузера.

  • Завдання кольору шрифту, фон сторінки

Якщо потрібно визначити колір шрифту для всієї сторінки, то використовується атрибут text у тегу <BODY>.

Наприклад:



задає для всього тексту червоний колір.

Колір фону всього HTML- документа визначається атрибутом bicolor

тегу <BODY>.

Наприклад: <BODY bgcolor="olive">

  • призначає оливковий колір для фону Web-сторінки.

  • Абзац тексту:

Для створення абзацу у мові HTML передбачено кілька можливостей. Найпростіша із них - це використання тегів <Р> і , між якими вміщений текст абзацу. Втім кінцевий тег в елементі абзацу не є обов'язковим.

Для переведення рядка (розрив рядка) використовується тег <ВК>.цей тег є порожнім елементом, що змушує броузер перевести текст на новий рядок.

Для завдання заголовків використовуються парні теги <Н1> (заголовок 1-го, найвищого рівня), <Н2> (2-го рівня). Усього передбачено 6-ть рівнів заголовків. Приклад:

<Н1> Ведмежий суд

Вирівнювання абзаців можна здійснити за допомогою атрибута align. Вирівнювання align="center" задаватиме вирівнювання по центру, значення align="right" - вирівнювання по правому краю сторінки, align—"left" - приклад:

<Н1 align =" center">Ведмежий суд

  • Шрифт:

Щоб задати будь-яке зображення шрифту, використовуються теги:

  • <В>... -для завдання напівжирного тексту,

  • <І>... - для завдання курсивного тексту

  • <U>...U> -для підкресленого тексту


Вставка зображення

Важко знайти в WWW сторінку, яка не мала б зображень. Вставка зобра­ження на Web- сторінку виконується одиночним тегом <IMG>. Усередині цього тегу обов'язково записується атрибут src, що вміщує URL зображення.

Назва цього атрибута походить від слова source - джерело.

Наприклад, ви хочете розмістити на сторінці картинку з файла Lord.jpg. Для цього збережіть файл із зображенням у певній папці (наприклад, у тій самій папці, що і HTML-документ), а у документ введіть тег



Повний код документа може мати вигляд:





<TITLE>"Володар перстнів"LЕ>





<Н2> Вставка зображення




Схожі:

Тема: Основні прийоми роботи в програмі Microsoft FrontPage
Мета: Ознайомитися з інтерфейсом програми та засвоїти основні прийоми роботи в програмі
Тема по програмі
Тема заняття: Робота з меню електронної таблиці. Створення, завантаження та збереження файлів-книг. Введення, редагування та форматування...
Тема по програмі
Тема уроку: Поняття запиту. Створення запитів. Виконання обчислень у запитах. Створення та редагування звітів
Тема по програмі
Тема заняття: Робота з головним меню програми Page Maker, вікном та панелями інструментів, палітрою інструментів
Тема по програмі
Тема уроку:  Створення слайдів презентації. Робота зі слайдами презентації. Редагування та демонстрація презентації
Тема по програмі
...
Тема по програмі
Табличний редактор Adobe Table може бути відкритий безпосередньо з програми PageMaker
Тема по програмі
Мета заняття: Навчити учнів розбирати та вивчити основні деталі та блоки моніторів
Тема по програмі
Мета уроку: Навчитися створювати та редагувати форми у базі даних та виконувати обчислення
Тема по програмі
Мета заняття: Навчити учнів розбирати та вивчити основні деталі та блоки моніторів
Додайте кнопку на своєму сайті:
Портал навчання


При копіюванні матеріалу обов'язкове зазначення активного посилання © 2013
звернутися до адміністрації
bibl.com.ua
Головна сторінка