Проєктування та верстка вебсторінок

Уроки 11, 12

13.10.2025

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

в ліцеї

Вітаю! Сьогодні продовжуємо працювати з HTML,  опрацюємо створення вебсторінок та завантажимо наш проєкт на хостинг

Крок 1: Як зареєструватись на Netlify

Посилання на інструкцію

Крок 2: Скопіюй посилання на резюме 
посилання на папки з проєктами

Приклад резюме
Приклад резюме з Netlify

Посилання

Після того як виконаєш всі завдання по інструкції, ти отримаєш посилання на свій сайт-резюме. Скопіюй його та надішли на електронну скриньку teacheritschool1@gmail.com

__________________________

Уроки 9, 10

06.10.2025

Верстка вебсторінок. Адаптивна верстка

Вітаю! Сьогодні продовжуємо працювати з HTML, розглянемо поняття верстки та що у собі має цей процес

Крок 1: Що таке адаптивна верстка?

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

Посилання на презентацію
👉Крок 2: Завдання

Працюємо з адаптивною версткою

____________________________________

Уроки 7, 8

29.09.2025

Мова гіпертекстової розмітки. Каскадні таблиці стилів

Вітаю! Сьогодні говоримо HTML як мову розмітки гіпертексту та розглянемо основні поняття, пов'язані з каскадними таблицями або CSS

Крок 1: Який будемо виконувати проєкт у темі

Ми з вами створимо сайт-резюме. Я буду публікувати завдання, які можна виконати використовуючи тільки програму Блокнот. Але, для тих, хто хоче спробувати себе у ролі розробника, буду публікувати завдання у Figma та VS Code (або SublimeText) 

Крок 2:  Що ж необхідно?

👉Набір "Мінімум"

Програма Блокнот або онлайн редактор, типу

👉Набір "Максимум"

VS Code або Sublimetext

Figma (посилання на заготовку)

Крок 3: Про HTML

Розгорнутий опис

Вебсайти - це основа, на якій тримається інтернет. Усі вебсайти побудовані на трьох основних технологіях:

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

Крок 4: Про СSS

Посилання документ з поясненнями

👉Крок 5: Завдання

на 9 балів: 

посилання на тест (надішли скріншот результату)

на 12 балів:

 - створити папку для зберігання роботи (посилання на папку у Google Drive)

 - заповнити у резюме поля з іменем, посадою і контактами, встановити фото

 - скриншот зі змінами надішли на пошту teacheritschool1@gmail.com