1 of 25

Автоматизовані засоби для створення та публікації веб-ресурсів

За навчальною програмою 2017 року

Урок 30

8

teach-inf.com.ua

2 of 25

Запитання

Розділ 4 § 4.2

Які об’єкти можна виділити на вебсторінці?

Який сайт вважається ергономічним?

Що таке НТМL-код сторінки? Дані яких видів він містить?

8

3 of 25

Засоби автоматизованого створення вебсайтів

Розділ 4 § 4.2

Використовуючи мову HTML, можна створити сайт:

Для створення простішого сайту можна використати засоби автоматизованого створення та публікації вебресурсів.

з унікальним дизайном,

різноманітними сервісами та можливостями,

реалізувати всі творчі задуми розробника.

8

4 of 25

Засоби автоматизованого створення вебсайтів

Розділ 4 § 4.2

Існують спеціалізовані вебредактори – програми, які призначено для створення вебсторінок сайтів, наприклад,

Adobe Dreamweaver

Microsoft FrontPage

WYSIWYG Web Builder та ін.

8

5 of 25

Засоби автоматизованого створення вебсайтів

Розділ 4 § 4.2

Ці програми мають засоби для візуального конструювання вебсторінок. Розробник розміщує на вебсторінках об’єкти – зображення, таблиці, списки та інше, вибираючи їх заготовки з бібліотеки об’єктів.

HTML-код кожної вебсторінки генерується на основі отриманого набору об’єктів. Такі програми називають WYSIWYG-редакторами (англ. What You See Is What You Get – що ви бачите, то ви й отримуєте).

8

6 of 25

Засоби автоматизованого створення вебсайтів

Розділ 4 § 4.2

Іншим засобом розробки сайтів є системи управління вебконтентом WCMS (англ. Web Content Management System – система управління вебконтентом) –програми, які призначено для створення, редагування та керування вмістом вебсайту.

8

7 of 25

Засоби автоматизованого створення вебсайтів

Розділ 4 § 4.2

Популярними WCMS є системи:

Joomla

Wordpress

MediaWiki та ін.

8

8 of 25

Засоби автоматизованого створення вебсайтів

Розділ 4 § 4.2

Вони містять набори вже готових шаблонів оформлення вебсторінок і модулів, що роблять сайт динамічним:

Назване програмне забезпечення можна встановити на локальному комп’ютері. Створені в їх середовищі вебсайти потрібно самостійно розміщувати в Інтернеті.

форумів

стрічок новин

каталогів файлів тощо

Контент сторінок, створених у цих системах, зберігається в базі даних, а HTML-код генерується автоматично на основі шаблону.

8

9 of 25

Засоби автоматизованого створення вебсайтів

Розділ 4 § 4.2

Існують також онлайн-системи конструювання сайтів, які призначено для розробки сайтів безпосередньо на віддаленому сервері в Інтернеті. Такими є сервіси:

Google Сайти

uCoz

Weebly та інші

Створені в цих сервісах сайти автоматично розміщуються на серверах відповідних сервісів, і розробник не може безпосередньо редагувати HTML-код вебсторінок.

8

10 of 25

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

Розділ 4 § 4.2

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

1

Реєстрація облікового запису на сервері онлайн-системи конструювання сайтів.

2

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

3

Створення сторінок сайту, системи навігації.

4

Заповнення сторінок контентом.

5

Публікація сайту.

8

11 of 25

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

Розділ 4 § 4.2

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

Для використання цього сервісу потрібно мати обліковий запис Google, який ви вже створювали, працюючи з:

Електронною

поштою

Cпільними документами Google

8

12 of 25

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

Розділ 4 § 4.2

Створити сайт можна різними способами:

Відкрити вікно Google Диска, скориставшись вашим обліковим записом Google, та виконати Створити ⇒ Більше ⇒ Google Сайти.

8

13 of 25

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

Розділ 4 § 4.2

Продовження…

Виконати вхід у сервіс Google, скориставшись вашим обліковим записом, перейти за адресою sites.google.com і вибрати кнопку Створити новий сайт.

8

14 of 25

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

Розділ 4 § 4.2

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

8

15 of 25

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

Розділ 4 § 4.2

Одночасно у вікні Google Диска та у вікні Сайти з’явиться ескіз сайту з підписом Сайт без назви. Подвійне клацання на цьому ескізі буде відкривати сайт у режимі редагування для подальшої роботи із сайтом.

8

16 of 25

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

Розділ 4 § 4.2

У правій частині вікна поруч з головною сторінкою сайту розміщено бічну панель з вкладками:

Інструменти цієї панелі використовуються для додавання, видалення та редагування сторінок, уставлення об’єктів на сторінки, вибору та змінення оформлення тощо.

Вставити

Сторінки

Теми

8

17 of 25

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

Розділ 4 § 4.2

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

8

18 of 25

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

Розділ 4 § 4.2

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

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

1

Вибрати заголовок вкладки Теми в правій частині вікна.

2

Вибрати одну із запропонованих тем оформлення.

3

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

8

19 of 25

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

Розділ 4 § 4.2

Можна також змінити вигляд заголовка на сторінках сайту. Після наведення вказівника на заголовок з’являється панель налаштувань з командами:

Змінити зображення

Тип верхнього колонтитула

Приводить до відкриття списку зображень, які можуть бути використані в заголовку сторінки

За вибору команди стає можливим змінення типу заголовка — Обкладинка, Великий банер, Банер або Лише заголовок.

8

20 of 25

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

Розділ 4 § 4.2

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

У поле, що з’явиться, можна ввести:

дані розробника сайту

рік його створення

оновлення тощо

8

21 of 25

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

Розділ 4 § 4.2

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

Верхній колонтитул

Нижній колонтитул

8

22 of 25

Дайте відповіді на запитання

Розділ 4 § 4.2

Які існують засоби автоматизованого створення сайтів? Охарактеризуйте їх.

Які етапи створення вебсайтів засобами сервісу Google Сайти? Поясніть їх.

Як створити сайт і дати йому назву засобами сервісу Google Сайти?

Як змінити верхній і нижній колонтитули на сторінці?

Як вибрати тему оформлення для сайту? Значення яких властивостей можуть бути вибрані разом з темою оформлення?

8

23 of 25

Домашнє завдання

Проаналізувати

§ 4.2, ст. 110-113

Розділ 4 § 4.2

8

24 of 25

Працюємо за комп’ютером

Розділ 4 § 4.2

Сторінка

116

8

25 of 25

Дякую за увагу!

За навчальною програмою 2017 року

Урок 30

8

teach-inf.com.ua