Алгоритм виконання роботи (чітка покрокова інструкція)
Етап 1. Підготовка структури сайту (5 хв)
Створити свою папку:
podillia_viktor
├── index.html
└── style.css
на 10-12 балів має бути створені усі теми.
файли index.html, index2.html, index3.html, index4.html, index5.html,
У ній створити файли:
index.html
index.html
замінити url адреса зображення 1 на посилання на зображення
<!DOCTYPE html>
<html lang="uk">
<head>
<meta charset="UTF-8">
<title>Поділля – історико-культурний регіон</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container">
<h1>Поділля – історико-культурний регіон України</h1>
<p>
Поділля — це один із найдавніших історико-культурних регіонів України. Його територія охоплює частини сучасних Вінницької, Хмельницької та Тернопільської областей. Назва краю походить від слова «поділ», тобто рівнина, поле.
</p>
<p>
Поділля має багату історію, яка бере початок ще з часів трипільської культури. У різні періоди тут жили слов’яни, литовці, поляки та українці. Кожен народ залишив свій слід у традиціях, архітектурі та побуті.
</p>
<p>
Сьогодні Поділля відоме своїми замками, старовинними містами, народними ремеслами, вишивкою та мальовничою природою.
</p>
<img src="url адреса зображення 1" alt="Карта Поділля">
<!DOCTYPE html>
<html lang="uk">
<head>
<meta charset="UTF-8">
<title>Поділля – історико-культурний регіон</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container">
<h1>Поділля – історико-культурний регіон України</h1>
<p>
Поділля — це один із найдавніших історико-культурних регіонів України. Його територія охоплює частини сучасних Вінницької, Хмельницької та Тернопільської областей. Назва краю походить від слова «поділ», тобто рівнина, поле.
</p>
<p>
Поділля має багату історію, яка бере початок ще з часів трипільської культури. У різні періоди тут жили слов’яни, литовці, поляки та українці. Кожен народ залишив свій слід у традиціях, архітектурі та побуті.
</p>
<p>
Сьогодні Поділля відоме своїми замками, старовинними містами, народними ремеслами, вишивкою та мальовничою природою.
</p>
<img src="url адреса зображення 1" alt="Карта Поділля">
<p>Підпис зображення 1</p>
<img src="url адреса зображення 2" alt="Замки Поділля">
<img src="url адреса зображення 2" alt="Замки Поділля">
<p>Підпис зображення 2</p>
<img src="url адреса зображення 3" alt="Природа Поділля">
<img src="url адреса зображення 3" alt="Природа Поділля">
<p>Підпис зображення 3</p>
<h2>Що робить Поділля унікальним?</h2>
<ul>
<li>Багатовікова історія</li>
<li>Народні традиції та ремесла</li>
<li>Стародавні замки та фортеці</li>
<li>Мальовнича природа</li>
<li>Культурна спадщина</li>
</ul>
<p>
Джерело інформації:
<a href="https://uk.wikipedia.org/wiki/Поділля" target="_blank">
Вікіпедія — Поділля
</a>
</p>
</div>
</body>
</html>
<h2>Що робить Поділля унікальним?</h2>
<ul>
<li>Багатовікова історія</li>
<li>Народні традиції та ремесла</li>
<li>Стародавні замки та фортеці</li>
<li>Мальовнича природа</li>
<li>Культурна спадщина</li>
</ul>
<p>
Джерело інформації:
<a href="https://uk.wikipedia.org/wiki/Поділля" target="_blank">
Вікіпедія — Поділля
</a>
</p>
</div>
</body>
</html>
Створити папку:
IMG
Учні обов’язково повинні знайти та завантажити власні зображення з Google.
🔍 Пошукові запити:
map.jpg
👉карта Поділля Українаcastle.jpg
👉замки та палаци Поділляnature.jpg
👉природа Поділля
style.css — готовий приклад файлу - створити в notepad++
body {
margin: 0;
padding: 0;
background: #ecf0f1;
font-family: Arial, Helvetica, sans-serif;
line-height: 1.6;
}
.container {
width: 900px;
margin: 30px auto;
background: #ffffff;
padding: 25px;
border-radius: 12px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
h1 {
text-align: center;
color: #2c3e50;
margin-bottom: 15px;
}
h2 {
text-align: center;
color: #34495e;
margin-top: 30px;
}
p {
font-size: 16px;
color: #333;
text-align: justify;
margin-bottom: 15px;
}
img {
width: 100%;
border-radius: 10px;
margin: 15px 0;
}
ul {
padding-left: 25px;
}
li {
font-size: 16px;
margin-bottom: 6px;
}
table {
width: 100%;
border-collapse: collapse;
margin-top: 20px;
}
th {
background: #3498db;
color: white;
padding: 10px;
}
td {
border: 1px solid #333;
padding: 8px;
text-align: center;
}
a {
color: #2980b9;
font-weight: bold;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}Завдання для учнів:
В🔹 Текст 2. Традиційний побут сіл Поділля Села Поділля здавна відзначалися самобутнім способом життя. Основним заняттям селян було землеробство: вирощували пшеницю, жито, кукурудзу, городину. Велику роль відігравало тваринництво. Традиційна подільська хата будувалася з глини та дерева, білилася вапном і прикрашалася орнаментами. Усередині хати були піч, дерев’яні лави, скрині, рушники та ікони. Побут супроводжувався обрядами, святами та народними звичаями, які передавалися з покоління в покоління. 🔍 Завдання для зображень: Знайти: Подільська хата ззовні Запит: "традиційна подільська хата, глина та дерево, білена вапном, орнамент, сонячний день, сільський пейзаж, реалістичний стиль" Інтер’єр традиційної хати Запит: "інтер'єр української хати Поділля, піч, дерев'яні лави, скрині, рушники, ікони, теплий затишок, народний стиль" Сільський побут Поділля Запит: "життя селян Поділля, господарство, тварини, город, селяни працюють, традиційний одяг, реалістична ілюстрація" Свята та обряди в хаті Запит: "сільське свято в хаті Поділля, сім'я, обряди, традиційні костюми, українські народні звичаї, яскраві кольори" Традиційна кухня Запит: "кухня української хати Поділля, дерев'яний стіл, миски, хліб, піч, домашній затишок, етнічний інтер'єр" Декор та орнаменти Запит: "рушники на стінах, ікони, традиційні українські орнаменти, дерев'яні меблі, хата Поділля, фольклорний стиль" Тваринництво та господарство Запит: "село Поділля, корови, свині, коні, селяни доглядають тварин, подвір'я, сільський пейзаж, традиційна хата на фоні" Щоденне життя села Запит: "селяни Поділля, город, сільські заняття, збір врожаю, традиційний одяг, сільська хата на задньому плані, реалістичне зображення" 🔹 Текст 3. Народний одяг Поділля Подільський народний одяг вирізняється яскравими кольорами та багатою вишивкою. Для вишиванок характерні червоні, чорні та сині орнаменти з рослинними та геометричними візерунками. Жінки носили вишиті сорочки, плахти, фартухи та прикраси з бісеру. Чоловіки — сорочки, штани, пояси й капелюхи. Одяг був не лише прикрасою, а й оберегом. Кожен елемент вишивки мав символічне значення та захищав людину від зла. 🔍 Завдання для зображень: Знайти: «подільська вишиванка» «народний одяг Поділля» «український національний костюм Поділля» 🔹 Текст 4. Народні ремесла Поділля Поділля славиться своїми народними ремеслами: гончарством, ткацтвом, різьбленням по дереву, писанкарством. Майстри створювали посуд, рушники, меблі, іграшки та прикраси. Особливо відомі подільські керамічні вироби, які відрізняються міцністю та художнім оздобленням. Рушники й килими прикрашали житло і мали символічне значення. Народні ремесла і сьогодні зберігають культурну спадщину регіону. 🔍 Завдання для зображень: Знайти: вишивка на поділлі, писанкарство на поділлі,гончарство (зокрема бубнівська кераміка), ткацтво на поділлі,лозоплетіння на поділлі,різьблення на поділліунікальне оброблення каменю (Буша) ковальство на поділлі 🔹 Текст 5. Природа Поділля Поділля має надзвичайно мальовничу природу. Тут протікають річки Південний Буг, Дністер, Збруч. Територія багата лісами, пагорбами, каньйонами та степами. Особливу цінність становлять природні заповідники та національні парки. Вони зберігають рідкісні види рослин і тварин. Природа Поділля сприяє розвитку туризму, екологічних маршрутів та відпочинку. 🔍 Завдання для зображень: Знайти: «природа Поділля» «річка Південний Буг» «Дністровський каньйон»Критерії оцінювання практичної роботи
1–3 бали (початковий рівень) Учень: ✔ створив HTML-файл ✔ додав заголовок і короткий текст ✔ сторінка відкривається у браузері Типові недоліки: відсутні зображення відсутній CSS порушена структура помилки у коді 🔵 4–6 балів (середній рівень) виконав тему з текстом 1 (що в зразку) Учень: ✔ створив повноцінну HTML-сторінку ✔ додав текст, зображення ✔ використав список ✔ додав таблицю Недоліки: мінімальне CSS-оформлення відсутнє або некоректне посилання структура сайту частково порушена 🟡 7–9 балів (достатній рівень) (запропонований текст 2-5) Учень: ✔ використав усі елементи контенту: текст 2–3 зображення список таблицю посилання ✔ сторінка має акуратний дизайн ✔ правильну структуру HTML Недоліки: дрібні помилки у верстці неідеальна візуальна композиція 🟠 10–12 балів (високий рівень) створив усі тексти і зробив гіперпосилання між ними Учень: ✔ повністю виконав усі вимоги ✔ грамотно структурований контент ✔ охайний дизайн ✔ коректне підключення CSS ✔ відсутність помилок ✔ логічне наповнення Додаткові бонуси (+1–2 бали в межах 12): меню навігації галерея зображень власний стиль дизайну адаптивність під телефон додаткові інформаційні блоки
Немає коментарів:
Дописати коментар