Віртуальний кабінет інформатики - Урок №18. Інструктаж з БЖД. Система керування вмістом для веб-ресурсів.

Урок №18. Система керування вмістом для веб-ресурсів

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

Ти дізнаєшся

•що таке система керування вмістом для веб-ресурсів;

•які переваги має система керування вмістом для веб-ресурсів;

•як обрати систему керування вмістом веб-ресурсів для роботи.

Етап засвоєння нових знань

Система керування вмістом, або CMS (англ. Content Management System), — це програмне забезпечення, завдяки якому здійснюється керування вмістом сайта (зміна, додавання нового текстового наповнення, завантаження зображень на сайт, створення нових розділів тощо).

Умовно CMS поділяють на два сховища інформації:

для баз даних з контентом сторінок

елементів візуалізації, що дають змогу відображати вміст сайта відвідувачам (графічні елементи, шаблони тощо)

Система керування вмістом, або CMS також називають рушіями

Рушій (рос. — «движок») інколи називають двигунцем.

Для зручної роботи з інформаційним наповненням більшість рушіїв мають інструмент візуального редактора (WYSIWYG) — програму, яка створює HTML-код, полегшуючи користувачам форматування текстової розмітки.

Етап формування умінь і навичок

Ознайомитися з класифікацією CMS (стр. 200)

Етап узагальнення знань, умінь і навичок

Створимо найпростішу веб-сторінку:

Обери одного письменника зі списку:Артюр РембоВасиль СтефаникІван ФранкоЛеся УкраїнаМикола ВоронийМихайло КоцюбинськийНечуй ЛевицькийОлександр ОлесьОльга КобилянськаОскард ВайлдПанас МирнийПоль ВерленФедір Достоєвськийhttps://ultragenerator.com/splitgroups/

Обери одне місто зі списку:

BEST TRAVEL

1. Вінниця:

2. Волинь

3. Дніпро

4. Закарпаття

5. Запоріжжя

6. Івано-Франківськ

7. Київ

8. Кривий Ріг

9. Львів

10. Миколаїв

11. Одеса

12. Суми

13. Харків

14. Херсон

15. Кропивницький (Кіровоград)

· Пам`ятки

· Ресторани

· Готелі

· Курорти

Bеб-сторінка містить невидимий для користувача HTML-код, тобто набір тегів. Команди мови HTML називають тегами. Назва кожного тега — це одна або декілька літер, взятих у кутові дужки (< та >), яким відповідають певні англійські слова, що пояснюють їх призначення.

Завдання. Створення найпростішого HTML-файла.

1. Відкрити Блокнот і набрати HTML код за зразком.

2. Зберегти файл з ім 'ям index_Прізвище.htm

Один тег може мати кілька параметрів — атрибутів. Правила запису параметрів: після назви тега після пропуску зазначається ім'я параметра.

Основними параметрами тега <BODY> є:

BACKGROUND="1.jpg" - задає картинку для фону за шляхом 1.jpg;

BGCOLOR="white" - задає колір фону — білий;

TEXT="black" - задає колір тексту — чорний.

Щоб відділити одну ділянку тексту від іншої, зазвичай використовують підкреслення горизонтальною лінією. Тег <HR> зображує на екрані горизонтальну лінію.

Наприклад, <HR ALIGN="center" WIDTH="50%" SIZE="3"> лінія по центру, розміром 3 пункти (позначається «пт»), яка займає 50 % ширини сторінки;

<HR ALIGN="center" WIDTH="400" SIZE="5" COLOR="red"> лінія по центру червоного кольору, довжиною 400 пікселів, розміром 5 пт.

Завдання. Задайте фон для веб-сторінки

3. Збережіть фоновий малюнок з назвою 1.jpg у папку, де знаходиться файл index_Прізвище.htm.

4. Додайте атрибут BACKGROUND="1.jpg" до тегу <BODY>

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

На відображення документа в браузері не впливають символи кінця рядка, які отримують натискуванням клавіші Enter або Shift+ Enter, а також пропуски.

Для перенесення тексту на новий рядок використовують одинарний тег <BR>. Для створення абзаців використовують парний тег: <Р>…</Р>

Завдання. Додайте цитату про письменника

6. Перед горизонтальною лінію вставьте вислів або вислови про письменника. Скористайся тегами для створення абзаців

HTML-документа можна вставляти маркований і нумерований списки. Для цього використовуються відповідні теги:

Нумерований список

<OL>

<LI> Елемент списку

.......

<LI> Елемент списку

</OL>

Маркований список

<UL>

<LI> Елемент списку

.......

<LI> Елемент списку

</UL>

Завдання. Створи короткий зміст веб-сторінки

7. Доповни сторінку за зразком

8. Скористайся тегами загаловків для форматування тексту за зразком.

Для формування заголовків використовують теги: <H1>…</H1> ВІд 1…6.

При 1 отримуємо заголовок найвищого рівня, відповідно при 6 — заголовок найнижчого рівня.

Google Sites

Report abuse