🏫 Урок 40

Правила ергономічного розміщення відомостей на вебсторінці. Етапи створення вебсайту

🏫 Урок 40

🖥️ Інформатика | 7 клас
🏫 Урок 40

🎯 Сьогодні ми дізнаємося

  • ℹ️ Які існують етапи створення вебсайту.
  • 🔧 Що таке ергономіка та юзабіліті.
  • ✏️ Як зробити вебсторінку зручною для користувача.
🖥️ Інформатика | 7 клас
🏫 Урок 40

🏗️ Етапи створення вебсайту

  1. Постановка мети та визначення аудиторії.
  2. Розробка структури (мапа сайту).
  3. Дизайн та макетування (візуальна частина).
  4. Верстка та програмування (створення коду).
  5. Наповнення контентом (текст, фото).
  6. Тестування та публікація.
🖥️ Інформатика | 7 клас
🏫 Урок 40

💡 Що таке ергономіка сайту?

Ергономіка сайту — це наука про те, як зробити взаємодію користувача з вебсторінкою максимально зручною та ефективною.

Юзабіліті (Usability) — показник того, наскільки легко та швидко користувач може розібратися з вашим сайтом та знайти потрібну інформацію.

🖥️ Інформатика | 7 клас
🏫 Урок 40

📏 Правила ергономічного дизайну

  • Правило 3-х кліків: будь-яка сторінка має бути доступна не більше ніж за 3 переходи
  • Контрастність: текст має бути чітким та добре читабельним на фоні
  • Адаптивність: сайт має однаково добре виглядати на комп'ютері, планшеті та смартфоні
  • Єдність стилю: однакові шрифти, кольори та елементи на всіх сторінках
🖥️ Інформатика | 7 клас
🏫 Урок 40

📄 Різновиди вебсторінок

Головна

"Обличчя" сайту. Містить меню та найважливіші новини.

Інформаційна

Статті, уроки, тексти, де користувач споживає контент.

Цільова

(Landing page). Сторінка, що закликає до дії (підписатися, купити).

🖥️ Інформатика | 7 клас
🏫 Урок 40

🛠️ Практична частина (Завдання 1)

Завдання 1. «Аналітик» ⭐

  • Відкрийте освітній сайт (наприклад, vseosvita.ua)
  • Знайдіть 3 елементи, які роблять цей сайт зручним
  • Запишіть їх назви у зошиті
🖥️ Інформатика | 7 клас
🏫 Урок 40

🔍 Практична частина (Завдання 2)

Завдання 2. «Критик» ⭐⭐

  • Знайдіть у Google приклад невдалого дизайну сайту (можете шукати "Приклади поганого дизайну сайтів" чи "bad web design examples" та перейти до зображень)
  • Запишіть у зошиті, які правила ергономіки порушено
  • Поясніть, як саме ці порушення впливають на зручність використання сайту
🖥️ Інформатика | 7 клас