Наповнення веб-сторінки інформацією, створення посилань, завантаження файлів на сервер.
Мета.
Навчальна. Ознайомити учнів з основними поняттями технології Flash; створенням Flash-документу та налаштуванням його властивостей, доданням мультимедійного вмісту, публікація презентації та її переглядом.
Розвиваюча. Розвивати логічне мислення, самостійність, вміння застосовувати набуті знання до практичних завдань.
Виховна. Виховувати наполегливість, естетичність у оформленні, грамотно висловлювати свої думки.
Тип уроку. Засвоєння нових знань і навичок.
Матеріали для роботи з учнями:
- Мультимедійне обладнання;
- Презентація “Структура веб-сайтів, різновиди веб-сторінок”
План
- Організація початку уроку
- Правила ТБ при роботі в кабінеті Інформатики.
- Мотивація навчальної діяльності.
- Актуалізація опорних знань.
- Вивчення нового матеріалу.
- Застосування знань.
- Підсумки уроку.
- Домашнє завдання.
Хід уроку
1. Організація початку уроку.
2. Інструктаж БЖД.
3. Мотивація навчальної діяльності.
Перш ніж ви почнете вивчати веб-дизайн, тобто проектування та розробку інтернет-ресурсів, слід ознайомитися з деякими загальними поняттями, які стосуються мережі Інтернет та служби Веб. у цьому розділі йтиметься про передавання даних через Інтернет, способи адресації його ресурсів та особливості Веб. Зокрема, ви дізнаєтеся, що таке гіперпосилання, веб-сторінка і веб-сайт. На вас також чекають цікаві практичні заняття, під час яких ви навчитеся використовувати автоматичні засоби створення веб-ресурсів та побачите, як за їх допомогою створити веб-сторінки різних типів і організувати на веб-сайті форум та чат.
4. Актуалізація опорних знань.
5. Вивчення нового матеріалу.
Основи Інтернету
Сьогодні у світі є сотні тисяч великих та малих комп'ютерних мереж. Багато з них з'єднані між собою й утворюють єдиний інформаційний простір, який складається з мільйонів комп'ютерів. Цей єдиний віртуальний простір називають Інтернетом.
За кількістю комп'ютерів та охоплюваною територією Інтернет є найбільшою у світі мережею. За типом вона належить до клі- єнт-серверних мереж, тобто в Інтернеті є комп'ютери-сервери, які зберігають інформацію та надають її комп'ютерам-клієнтам.
Передавання даних в Інтернеті
Обмін інформацією між серверами та клієнтами здійснюється за певними правилами, які називають протоколами. Всі дані, що циркулюють у глобальному інформаційному полі, розбито на невеликі блоки і вкладено в пакети. Кожний пакет окрім даних має заголовок, де зберігаються адреса відправника, адреса одержувача та інша інформація, необхідна для збирання пакетів у пункті призначення. Теоретично можливо, що різні пакети одного повідомлення пройдуть різними шляхами, але все одно досягнуть адресата і будуть зібрані в повне повідомлення.
Поділ даних на пакети та їх збирання у пункті призначення здійснюється під керуванням протоколу TCP (Transmission Control Protocol — протокол керування передаванням), а власне передавання пакетів мережею та досягнення ними адресата забезпечує протокол IP (Internet Protocol — міжмережний протокол).
У Інтернеті використовується велика кількість протоколів, завдяки чому існує широкий спектр служб, які надаються та підтримуються за допомогою цієї глобальної мережі.
Найпопулярнішою зі служб є Всесвітня павутина (World Wide Web — WWW), або просто Веб. Це розповсюджена по всьому світу інформаційна мультимедійна система, яка об'єднує в єдиному просторі інформацію різних типів. Робота у Веб подібна до віртуальної подорожі світом з відвідуванням цікавих місць. Ця служба базується на протоколі HTTP (Hyper Text Transfer Protocol — протокол передавання гіпертексту).
Іншою службою, з якою вам доведеться працювати під час вивчення матеріалу посібника, є FTP (File Transfer Protocol — протокол передавання файлів). Як ви, напевно, здогадалися, назва цієї служби збігається з назвою протоколу, який вона використовує. Сервери, що підтримують цей протокол, називають FTP-серверами. Частина дискового простору таких серверів доступна через Інтернет.
Крім того, до служб Інтернету належать електронна пошта, служби миттєвого передавання повідомлень (наприклад, ICQ), служба новин Usenet та інші.
Адресація в Інтернеті
Усі комп'ютери, підключені до Всесвітньої мережі, працюють в автоматичному режимі, без участі людей. Для того щоб такий комп'ютер мав змогу передавати та приймати дані з використанням протоколу IP, він повинен мати унікальну адресу, яку називають IP-адресою. Вона має такий формат: ххх.ххх.ххх.ххх, де ххх — число від 0 до 255 (наприклад, 193.205.31.47). Призначенням ІР- адрес займаються спеціальні організації.
ІР-адреса є зручною для комп'ютерів, але людям запам'ятати її важко. Тому серверам присвоюють так звані доменні імена — набори розділених крапками послідовностей символів, наприклад zirka.lviv.ua.
Останній, найзагальніший елемент доменного імені — в нашому прикладі uа — називають доменом першого рівня, lviv — доменом другого рівня і т. д. Кількість доменів у адресі не регламентовано. Домени першого рівня стандартизовані, домени останніх рівнів вибирають за бажанням тих, хто їх встановлює. Імена для доменів першого рівня видає Інформаційний центр Інтернету (In- ternetNIC), решту імен фіксують ті організації, яким такі права делеговані.
У багатьох країнах домен першого рівня є кодом країни: uа — Україна, ru — Росія, fr — Франція, sl — Швеція, са — Канада, jp — Японія, au — Австрія, uk — Великобританія.
Домени першого рівня можуть також позначати сферу діяльності: com — комерційні компанії, gov — урядові організації, edu — навчальні заклади, org — некомерційні організації, mil — військові організації.
Отже, система доменних імен організована у зручний для людини спосіб, оскільки вона має постійну структуру і дає змогу визначити, якій організації належить сервер та в якій країні ця організація розміщена.
Проте, як ви знаєте із власного досвіду, для відкриття будь-якого документа, що зберігається на комп'ютері, необхідно вказати ім'я файлу та повний шлях до нього. Так само і для доступу до інтер- нет-ресурсу недостатньо знати лише ІР-адресу або доменне ім'я комп'ютера, на якому цей ресурс розміщено, — ви маєте вказати також папку та ім'я файлу. Крім того, як зазначалося, в Інтернеті застосовуються різні протоколи, а отже, слід вказати ще й протокол. Адресу, що містить усі зазначені елементи, називають URL (Uniform Resource Locator — єдиний вказівник на ресурс) або адресою ресурсу.
Типовий URL має такий вигляд: протокол://адреса, де протокол визначає метод доступу до ресурсу, наприклад http, ftp; адреса описує місце розташування ресурсу і включає назву сервера, шлях до документа і його ім'я.
Часто зустрічаються URL, що містять лише протокол та назву сервера. У цьому випадку завантажується головна сторінка сервера. Наведемо приклади URL-адрес:
- http://www.svhiv.com/pub/fflas/school.html — адреса файлу school, html, розміщеного в каталозі pub/files на сервері www.svhiv.com. Доступ до сервера здійснюється за протоколом HTTP;
- ftp://ftp.svhiv.com/pub/files/school.txt — адреса файлу school.txt, розміщеного в каталозі pub/files на сервері ftp.svhiv.com. Доступ до сервера здійснюється за протоколом FTP.
Веб-сторінка та веб-сайт
Як зазначалося, найвідомішою та найпопулярнішою службою Ін- тернету є Всесвітня павутина (Веб). Саме після її розповсюдження став можливий масовий доступ користувачів до Всесвітньої мережі. Своєю появою Веб має завдячити Тіму Бернесу-Лі, який винайшов протокол HTTP, адреси URL та мову HTML (з нею ви ознайомитеся у наступному розділі посібника) — технології, на яких ґрунтується Веб.
Служба Веб підтримується сукупністю серверів, які здатні обмінюватися даними за протоколом HTTP. Цих серверів мільйони, й розповсюджені вони по всьому світу. На них містяться веб-сто- рінки — спеціальні документи, створені з використанням мови HTML. Кожна веб-сторінка має адресу URL, за допомогою якої вона може бути знайдена.
Перегляд веб-сторінок здійснюється у спеціальних програмах — браузерах, найпоширенішими з яких є Internet Explorer, Mozilla та Opera. Для відтворення веб-документа у вікні браузера достатньо ввести його URL в поле Адреса і натиснути клавішу Enter. Основною особливістю та перевагою веб-сторінок є те, що інформація на них організована як гіпертекст. Це текст, в який вбудовано спеціальні коди, що керують такими додатковими елементами, як форматування, ілюстрації, мультимедійні вставки та гіпертек- стові посилання.
Гіпертекстове посилання (гіперпосилання, гіперзв'язок чи гіперлінк) — це об'єкт веб-сторінки, що містить інформацію про адресу іншої веб-сторінки або про певне місце на поточній. Таким об'єктом може бути фрагмент тексту (зазвичай виділений кольором та підкресленням) або ілюстрація. У разі наведення на гіперпосилання вказівник миші набуває форми руки з витягнутим вказівним пальцем. Клацнувши лівою кнопкою миші, можна виконати перехід за гіперпосиланням. При цьому браузер завантажує веб-сторінку, яка міститься за адресою, зазначеною в посиланні. Ця веб-сторінка також може містити гіперпосилання, які вказують на інші веб-сторінки. Оскільки веб-сторінки можуть бути зв'язані між собою довільно, такий спосіб їх організації отримав назву Всесвітня павутина.
Процес переходу в інші місця поточної веб-сторінки або до інших веб-сторінок за допомогою гіперпосилань називають навігацією. Якщо після низки переходів за гіперпосиланнями необхідно повернутися на попередню сторінку, то користуються кнопкою Назад панелі інструментів браузера. Поруч із нею є стрілка для розкривання списку сторінок, що вже були переглянуті в цьому сеансі роботи; у списку можна вибрати потрібну сторінку і перейти до неї.
Сукупність веб-сторінок, що тематично пов'язані між собою й розроблені як єдине ціле, називають веб-сайтом або просто сайтом. Сторінки веб-сайту розміщуються на одному сервері та мають однакову адресу сайту, наприклад httn://bhv.kiev.ua/.
Веб-сайт може надавати як пасивну інформацію, що читається лише відвідувачем, так і активну, яку відвідувач може додавати або редагувати. Для організації інтерактивної взаємодії відвідувачів використовують гостьові книги, форуми, чати та блоги, які описані в цьому розділі далі.
Домашні сторінки
У 90-х роках минулого століття виник новий вид творчості — створення домашніх сторінок. Спочатку цей термін (від англ. home page) означав дім людини в Інтернеті, місце, де вона зберігає інформацію про себе. Наразі особисті сторінки мають тисячі людей. Одні з них містять лише коротку інформацію про власника, а другі — корисну інформацію з певної тематики, графічний матеріал, фотографії тощо.
Термін «домашня сторінка» не має чіткого визначення, так називають також головну сторінку сайту, що відкривається у разі введення його доменного імені, та сторінку, яка завантажується під час кожного запуску браузера.
Структура веб-сайтів
Зовнішній вигляд кожного сайту є унікальним, проте в усіх сайтів можна знайти спільні за функціональністю частини. На будь- якому сайті першою відкривається головна сторінка. її розробці приділяють особливу увагу, оскільки дослідження показали, що люди не здатні читати інформацію, що відображається на моніторі, так уважно, як книжки або журнали, вони зазвичай лише поверхово переглядають її, наприклад, як рекламу. Якщо головна сторінка містить те, що шукає відвідувач, він читає її далі, а якщо ні — переходить до інших сайтів, яких в Інтернеті дуже багато.
У верхній частині головної сторінки зазвичай розташована так звана шапка, яку дублюють на інших сторінках сайту. Це роблять спеціально, адже ця частина відображається у вікні браузера першою, і відвідувач насамперед звертає увагу на неї.
Щоб забезпечити швидкий перехід до основних тематичних розділів сайту, створюють меню сайту — список гіперпосилань на його розділи. Горизонтальне меню зазвичай розташовують у шапці, іноді дублюючи його в нижній частині сторінки, а вертикальне — переважно в лівій частині сторінки, у місці, звідки відвідувач починає її переглядати. Меню є одним із найважливіших компонентів сайту, користувач постійно звертає на нього увагу, і тому вимоги до нього високі. Меню має бути зручним, помітним і зрозумілим, інакше користувач не знатиме, як потрапити в потрібний розділ, і вийде із сайту. Пункти меню мають бути чітко відділені один від одного.
6. Застосування отриманих знань
Вправи 1.1-1.2
7. ПІДБИТТЯ ПІДСУМКІВ УРОКУ
8. ДОМАШНЄ ЗАВДАННЯ
- Вивчити конспект.
- Виконати завдання.
- Виберіть тему для веб-сайту або запропонуйте свою; підготуйте графічні файли з необхідними зображеннями, придумайте текстовий супровід для головної сторінки майбутнього проекту та сторінок розділів; створіть сайт за допомогою засобів служби безкоштовного хостинга https://sites.google.com/
Как добавить страницу на сайт
Сайт – это набор веб-страниц, связанных общей тематикой. Любой новый сайт, созданный в сервисе "Google Сайты" без использования шаблона, состоит лишь из одной главной страницы.
Примечание. Чтобы не перегружать сайт, не рекомендуется добавлять на него более 1000 страниц и файлов.
Чтобы создать страницу на сайте:
- Откройте Google Сайты и перейдите на свой сайт.
- На главной странице нажмите кнопку "Создать страницу"
.
- Укажите название страницы. На его основе будет создана веб-ссылка (URL-адрес страницы). Чтобы изменить ее, нажмите Изменить URL.
- Выберите шаблон страницы.
- Укажите, куда добавить страницу:
- Поместить страницу на верхний уровень. Страницы верхнего уровня находятся на одном уровне с главной. Под ними удобно создавать подстраницы, поэтому они хорошо подходят для основных категорий сайта.
- Разместить под страницей "Название страницы". Новая страница будет добавлена под текущей.
- Выбрать другое местоположение. Страницу можно разместить под любой другой страницей на сайте.
- Нажмите кнопку Создать.
Наповнення веб-сторінки текстом та графічними даними, створення гіперпосилань, завантаження файлів.
1. Редагування веб-сторінок.
Створену сторінку веб-сайта можна редагувати, наповнювати її інформацією, змінювати компонування веб-сторінки тощо.
Для переходу до режиму редагування сторінок слід натиснути кнопку Редагувати сторінку 
у верхній частині вікна браузера. Після цього у вікні браузера з'явиться меню та панель інструментів:
у верхній частині вікна браузера. Після цього у вікні браузера з'явиться меню та панель інструментів:
За допомогою панелі інструментів можна:
- задати форматування символів (шрифт, розмір, накреслення, колір тексту, колір тла);
- встановити параметри абзаців (відступи та вирівнювання);
- додати або видалити гіперпосилання;
- вставити нумерований або маркований список;
- редагувати HTML-код сторінки.
Меню містить команди, призначені для виконання операцій з елементами сторінки:
- Вставити - для вставлення об'єктів на сторінку (зображення, посилання, діаграма, карта, відео тощо).
- Формат - для форматування тексту на веб-сторінці.
- Таблиця - для вставлення та редагування таблиці.
- Макет - для вибору компонування веб-сторінки (кількість стовпців, наявність лівої та правої панелей).
2. Вставлення зображення на сторінку.
На веб-сторінку можна вставити різні об'єкти:
Для прикладу розглянемо, як вставити зображення на веб-сторінку:
1. Виконати команду Вставити - Зображення.
2. У вікні Додати зображення вибрати джерело зображення: Завантажені зображення або Веб-адреса (URL)
4. Натиснути кнопку ОК.
Після вставлення зображення на сторінку під ним відкриється панель редагування:
Використовуючи гіперпосилання на панелі, можна розмістити зображення за лівим краєм, по центру, за правим краєм; задати розмір: S - маленький, M - середній, L - великий або Оригінальний. Також можна задати перенос зображення. Для видалення зображення використовують відповідну кнопку панелі редагування зображення.
3. Створення гіперпосилань.
Щоб додати гіперпосилання на веб-сторінку цього сайту або на інший ресурс потрібно:
1. Виконати команду Вставити - Посилання або натиснути кнопку на панелі інструментів 
.
.
2. У вікні Створити посилання вибрати сторінку цього сайту або вказати URL-адресу ресурсу, на який здійснюватиметься перехід за вибору гіперпосилання.
3. За бажанням встановити прапорець Відкрити це посилання в новому вікні.
4. Натиснути кнопку ОК.
Гіперпосилання також можна пов'язати з будь-якими текстовими фрагментами або зображеннями, що містяться на веб-сторінці.
4. Завантаження файлів.
Щоб завантажити на веб-сторінку файл, потрібно вибрати в нижній частині сторінки посилання 
та у вікні Відкриття файлу вказати потрібний файл на локальному комп'ютері. Після цього внизу веб-сторінки з'явиться посилання на файл та кнопки навпроти нього для завантаження та видалення файлу.
та у вікні Відкриття файлу вказати потрібний файл на локальному комп'ютері. Після цього внизу веб-сторінки з'явиться посилання на файл та кнопки навпроти нього для завантаження та видалення файлу.
Запам'ятайте, що на Домашню сторінку завантаження файлів неможливе!
В нижній частині цієї сторінки показаний приклад завантаженого файлу сайт.png.
1. Наповнити сторінки свого сайту текстовою та графічною інформацією.
2. Додати декілька посилань на корисні ресурси. Наприклад, посилання на сайти вузів, які займаються підготовкою спеціалістів вашої майбутньої професії.
3. Завантажити на свій сайт декілька файлів з корисною інформацією щодо Вашої майбутньої професії (текст, фото, аудіо чи відеоматеріали).
