Інформатика

Тема уроку: “Поняття про засоби автоматизованої розробки веб-сайтів, редактор веб-сайтів з графічним інтерфейсом”

Пригадаємо…

• Які основні етапи створення веб-сайтів?
• Які складові структури веб-сторінки ви знаєте?
• Що таке теги?

Прочитайте!

Автоматизоване створення веб-сайту

Створення веб-сайту засобами онлайн-системи конструювання сайтів відбувається в кілька кроків:

1. Реєстрація облікового запису на сервері онлайн-системи конструю­вання сайтів.
2. Вибір назви сайту та шаблону його оформлення.
3. Створення сторінок сайту, системи навігації.
4. Заповнення сторінок контентом.
5. Публікація сайту.

Розглянемо, як відбувається процес розробки веб-сайту засобами, що безкоштовно надає користувачам веб-сервер Google. Відповідний сервіс має назву Google Сайти.

Для створення сайту потрібно:

1. Увійти на Google Диск з вашим обліковим записом Google.
2. Виконати Створити/ Більше / Google Сайти.
3. Переглянути інструкцію зі створення сайту, використовуючи панель Add content (англ. add content — додати зміст), або закрити її.

Після виконання цих дій у вікні браузера буде відкрито головну сто­рінку нового сайту. У правій частині вікна відкриється біч­на панель з елементами керування, призначеними для створення, реда­гування та форматування веб-сторінок сайту. Одночасно на Google Диск з’явиться ескіз сайту з підписом Сайт без назви.

У подальшому для редагування вашого сайту — додавання та реда­гування веб-сторінок, змінення оформлення тощо — вам потрібно вико­ристовувати інструменти бічної панелі. Відкрити сайт у режимі редагу­вання можна подвійним клацанням на його ескізі на Google Диск.

Вибір назви сайту та шаблону оформлення

Щоб надати назву сайту, потрібно ввести її в поле Введіть назву сайту у верхній частині заголовка сторінки зліва. Одночасно буде змінено на назву сайту текст Сайт без назви та підпис ескізу сайту на Google Диск.

Як і для документів Google, усі зміни, виконані на сайті, будуть збері­гатися автоматично.

Для вибору шаблону оформлення сайту потрібно:

1. Вибрати вкладку Теми у правій частині вікна.
2. Вибрати одну із запропонованих тем оформлення.
3. Вибрати кольорову гаму та стиль шрифту із числа тих, що запропо­новані для вибраної теми.

Можна також змінити вигляд заголовка на сторінках сайту. Після на­ведення вказівника на заголовок з’являється панель налаштувань з коман­дами Змінити зображення та Тип верхнього колонтитула. Вибір першої команди приводить до відкриття списку зображень, які можуть бути ви­користані у заголовку сторінки. За вибору другої команди стає можливим змінення типу заголовка — Великий банер, Банер або Лише заголовок.

Створення веб-сторінок

Одразу після створення сайт містить лише одну сторінку, яка є голов­ною сторінкою сайту. Кожна сторінка сайту має назву. Назву головної сторінки потрібно ввести в поле Заголовок сторінки.

Для створення нової сторінки на сайті потрібно:

1. Вибрати вкладку Сторінки у правій частині вікна.
2. Вибрати кнопку Додати сторінку.
3. Увести назву сторінки в поле Назва сторінки.
4. Вибрати гіперпосилання Готово.

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

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

Для створення головної сторінки тематичного розділу потрібно пере­тягнути блоки заголовків інших сторінок цього розділу на заголовок го­ловної сторінки розділу.

Виконання практичного завдання

Завдання 1. Зареєструйте електронну скриньку на пошті gmail (якщо у вас її ще немає) та використовуючи  Google Сайти створіть шаблон головної сторінки свого сайту (оберіть назву сайту та оформлення на власний смак.

Завдання 2
Доберіть назви сторінок і створіть у текстовому процесорі мапу сайту Небезпечні тварини.

Якщо у вас немає можливості працювати за ПК, замість практичних завдань можна дати письмову відповідь на запитання:

1. Запишіть алгоритм автоматизованого створення веб-сайту за допомогою Google Сайти.
2. Запишіть алгоритм вибору назви та шаблону оформлення.
3. Запишіть алгоритм створення веб-сторінок.