КТП Інформатика 7 клас 2025-20256

7 клас. Інформатика. Дистанційно 2022-2023

Інформатика 7 клас. Завдання на період дистанційного навчання. Сторінка оновлюється щотижня (2021-2022н.р )

Презентація: Структура сайту та основи веб-дизайну.

Слайд 1: Титульний

• Заголовок: Структура сайту та основи веб-дизайну.

• Підзаголовок: Як влаштовані веб-ресурси та як зробити їх зручними.

• Інфо: Інформатика, 7 клас.

Слайд 2: Що таке структура сайту?

• Основна думка: Сайт — це не просто набір сторінок, а впорядкована система.

• Типи структур:

  • Лінійна: користувач переходить від сторінки до сторінки (як у книжці).

  • Ієрархічна (деревоподібна): від головної сторінки до розділів та підрозділів (найпопулярніша).

  • Довільна: усі сторінки пов’язані між собою посиланнями.

Слайд 3: Види сторінок сайту

Кожна сторінка має свою роль:

1. Головна (Home page): «обличчя» сайту, звідки починається навігація.

2. Інформаційні сторінки: містять статті, тексти, фото.

3. Сторінки розділів: меню для переходу до конкретних тем.

4. Контакти та зворотний зв’язок: для зв'язку з авторами.

Слайд 4: Як створити сайт без програмування?

• Автоматизовані засоби (CMS та конструктори):

  • Конструктори (Wix, Google Sites, Canva): дозволяють збирати сайт із готових блоків, як конструктор LEGO.

  • CMS (WordPress): системи управління вмістом для складніших проєктів.

• Переваги: не потрібно знати код, швидкий результат, готові шаблони.

Слайд 5: Етапи створення веб-ресурсу

1. Постановка мети: для чого цей сайт?

2. Проєктування: розробка структури на папері або в схемі.

3. Дизайн та наповнення: створення візуалу та додавання контенту.

4. Публікація: розміщення в інтернеті (хостинг та домен).

Слайд 6: Ергономіка веб-сторінок

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

• Правило «3-х кліків»: користувач має знайти потрібну інформацію не більше ніж за 3 переходи.

• Контрастність: текст має легко читатися (чорне на білому — ідеально).

• Адаптивність: сайт має однаково добре виглядати на комп’ютері та смартфоні.

Слайд 7: Золоті правила розміщення контенту

• F-патерн: люди зазвичай переглядають сторінку за траєкторією літери "F". Найважливіше ставимо зверху та зліва.

• Повітря: не перевантажуйте сторінку текстом, залишайте вільне місце.

• Акценти: виділяйте головне кнопками або кольором.

Слайд 8: Підсумок та запитання

• Запитання для самоперевірки:

  • Яка структура сайту найзручніша для онлайн-магазину?

  • Чим відрізняється конструктор сайтів від написання коду вручну?

  • Чому важливо враховувати ергономіку?

Поради для оформлення:

• Мінімум тексту: використовуй лише ключові тези, решту розповідай усно.

• Скриншоти: додай на слайди приклади реальних сайтів (наприклад, сайт школи або Wikipedia).

• Інтерактив: запропонуй учням зайти на Google Sites і спробувати створити першу сторінку прямо на уроці.

Структура сайту. Види сторінок сайту. Автоматизовані засоби створення та публікації веб-ресурсів. Правила ергономічного розміщення відомостей на веб-сторінці. С. 150-163. 

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

Слайд 1: Назва презентації

Тема: Структура сайту та основи веброзробки. Зміст:

• З чого складається сайт?

• Якими бувають сторінки?

• Як створити сайт без програмування?

• Правила зручного дизайну (ергономіка).

Слайд 2: Структура вебсайту

Сайт — це не просто набір сторінок, а впорядкована система.

1. Внутрішня структура — це схема зв’язків між сторінками (меню, посилання). Вона буває:

   • Лінійна: сторінки йдуть одна за одною (як у книжці).

   • Ієрархічна (деревоподібна): від головної сторінки до розділів і підрозділів.

   • Довільна: сторінки пов’язані між собою хаотично.

2. Зовнішня структура — це вигляд окремої сторінки (дизайн).

Слайд 3: Види сторінок сайту

За функціями сторінки поділяють на:

• Головна (Home page): «обличчя» сайту, звідки починається навігація.

• Інформаційні: статті, новини, опис товарів.

• Навігаційні: карти сайту, результати пошуку.

• Контактні: форми зворотного зв'язку, адреси.

• Цільові (Landing pages): сторінки, створені для реклами конкретного продукту.

Слайд 4: Автоматизовані засоби створення веб-ресурсів

Сьогодні не обов’язково знати мову HTML, щоб створити сайт. Для цього використовують:

• Конструктори сайтів (SaaS): онлайн-сервіси (наприклад, Google Sites, Wix, Canva). Просто перетягуєш блоки — і готово!

• Системи керування вмістом (CMS): програми для створення великих сайтів (наприклад, WordPress).

• Онлайн-редактори: де можна швидко зробити візитку чи портфоліо.

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

Слайд 5: Ергономіка веб-сторінок

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

Основні елементи сторінки:

1. Шапка (Header): назва сайту, логотип, меню.

2. Основна частина (Content): головна інформація.

3. Бічна панель (Sidebar): додаткові посилання, банери.

4. Підвал (Footer): авторські права, контакти.

Слайд 6: Правила розміщення відомостей

Щоб сайт був зручним, дотримуйся цих правил:

• Правило "F-патерну": користувачі зазвичай сканують сторінку очима у формі літери F (зліва направо, зверху вниз). Найважливіше став угорі ліворуч.

• Контрастність: текст має легко читалися на фоні.

• Простота навігації: користувач має знайти потрібну інформацію за 2-3 кліки.

• Адаптивність: сайт повинен гарно виглядати і на комп'ютері, і на смартфоні.

• Єдиний стиль: однакові шрифти та кольори на всіх сторінках.

Слайд 7: Висновки

• Сайт має чітку структуру для зручного пошуку інформації.

• Існують різні типи сторінок під різні завдання.

• Завдяки конструкторам (як Google Sites) кожен може стати розробником.

• Головне в дизайні — зручність користувача (ергономіка).

Тобі допомогти підібрати кольорову гаму для презентації чи, можливо, підказати, як створити перший сайт у Google Sites?

📝 Текстовий процесор: Шаблони, стилі та пошук

1. Використання шаблонів документів

Шаблон — це спеціальний файл, який вже містить певний дизайн, структуру та елементи оформлення.

• Навіщо вони потрібні? Щоб не створювати документ "з нуля" щоразу (наприклад, резюме, лист, звіт чи календар).

• Як знайти? У Microsoft Word: Файл → Створити. Там можна обрати готовий макет.

• Перевага: Економія часу та професійний вигляд документа.

2. Форматування з використанням стилів

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

• Типи стилів: Найчастіше використовують стилі для заголовків (Heading 1, 2) та звичайного тексту.

• Чому це круто? 1. Швидкість: Можна змінити оформлення всіх заголовків одним кліком.

  2. Зміст: На основі стилів заголовків програма автоматично створює Зміст (автоматичне оглавление).

  3. Єдність: Весь документ виглядає в одному стилі.

3. Пошук та заміна фрагментів тексту

Ці інструменти допомагають миттєво знаходити слова у великих текстах і змінювати їх.

• Пошук (Ctrl + F): Допомагає знайти конкретне слово або фразу в документі на 100+ сторінок за секунду.

• Заміна (Ctrl + H): Автоматично змінює одне слово на інше у всьому документі.

  • Приклад: Тобі потрібно замінити в усьому тексті "м. Київ" на "столиця України". Замість того, щоб шукати вручну, ти використовуєш функцію "Замінити все".

💡 Головні поради (Cheat Sheet):

5 практичних завдань для роботи в Google Документах, які допоможуть закріпити знання про шаблони, стилі та пошук.

Практична робота: "Ефективна робота з текстом"

Завдання 1. Робота з шаблонами

1. Відкрий головну сторінку Google Документів.

2. Натисни «Галерея шаблонів» (угорі праворуч).

3. Обери шаблон «Резюме» (або «Лист»).

4. Заповни його своїми даними: ім'я, школа, твої захоплення. Зверни увагу, як зберігається структура документа при заміні тексту.

Завдання 2. Застосування стилів

1. Створи новий порожній документ.

2. Напиши назву документа: "Мої улюблені предмети". Застосуй до цього рядка стиль «Назва» (Title).

3. Нижче напиши назви трьох предметів (наприклад: Інформатика, Математика, Історія). До кожної назви застосуй стиль «Заголовок 1» (Heading 1).

4. Під кожним заголовком напиши по одному реченню, чому цей предмет цікавий. Переконайся, що для цього тексту встановлено стиль «Звичайний текст».

Завдання 3. Автоматичний зміст

1. Використовуючи документ із Завдання 2, перейди на новий рядок на самому початку документа.

2. Натисни Вставити (Insert) → Зміст (Table of contents).

3. Обери варіант із номерами сторінок.

4. Перевірка: Додай ще один предмет зі стилем «Заголовок 1» в кінець документа і натисни кнопку «Оновити зміст» у самому змісті.

Завдання 4. Пошук та заміна

1. Скопіюй будь-який текст про комп'ютери з Вікіпедії (приблизно на 1 сторінку) і встав у Google Документ.

2. Натисни Ctrl + H (або Правка → Знайти та замінити).

3. У полі "Знайти" введи слово "комп'ютер".

4. У полі "Замінити на" введи слово "ЕОМ" (велика літерами).

5. Натисни «Замінити все». Подивись, скільки замін відбулося.

Завдання 5. Швидке форматування стилів

1. У тому ж документі зміни оформлення одного «Заголовка 1»: зроби його синім кольором, шрифтом Arial та розміром 18.

2. Виділи цей змінений заголовок.

3. У панелі стилів натисни стрілочку біля «Заголовок 1» та обери «Оновити 'Заголовок 1' відповідно до виділеного фрагмента».

4. Спостерігай, як усі інші заголовки в документі автоматично стали синіми.

Порада: Після виконання можеш поділитися посиланням на документ із вчителем, натиснувши кнопку "Поділитися" (Share).

Хочеш, щоб я підготував короткий тест для перевірки знань за цими завданнями?

Покупки  ст. 128 

Назва таблиці: "Облік придбання офісного обладнання" (або "Придбання шкільного приладдя")
 

Запитання за матеріалом завдання

1. Типи даних: Які типи даних містяться у стовпцях «Назва товару», «Кількість» та «Дата придбання»? Поясніть різницю між ними.

2. Побудова формул: Запишіть формулу, яку потрібно ввести в клітинку G2, щоб розрахувати вартість ноутбука з урахуванням знижки. Використовуйте адреси клітинок.

3. Відсотковий формат: Як зміняться математичні дії у формулі, якщо в стовпці «Знижка» замість формату відсотків (5%) буде записано просто число (5)?

4. Арифметичні оператори: Які математичні оператори використовуються в електронних таблицях для множення та віднімання? Наведіть приклади з цього завдання.

5. Автозаповнення: Опишіть алгоритм дій: як швидко розрахувати загальну вартість для всіх товарів у списку, не вводячи формулу вручну для кожного рядка?

6. Форматування чисел: Яке форматування доцільно встановити для стовпців «Ціна за одиницю» та «Загальна вартість», щоб вони виглядали як грошові суми?

7. Адресація: Чому при копіюванні формули вниз по стовпцю адреси клітинок (наприклад, з C2 на C3) змінюються автоматично? Як називається такий вид посилань?

8. Пріоритет операцій: Чи потрібні дужки у формулі для розрахунку вартості зі знижкою? Поясніть, як зміниться результат, якщо їх прибрати.

9. Аналіз даних: Як за допомогою інструментів табличного процесора швидко знайти товар, на який була витрачена найбільша сума грошей?

10. Оновлення даних: Що станеться із «Загальною вартістю», якщо ми змінимо кількість «Паперу для принтера» з 20 на 25 упаковок? Чи потрібно буде переписувати формулу?

Задача для Google Таблиць (Інформатика, 7 клас)

Задача для Google Таблиць (Інформатика, 7 клас)

Тема: "Обчислення вартості та знижок: Планування шкільної екскурсії"

Ця задача дозволяє учням відпрацювати введення формул, використання функцій СУМ (SUM), СЕРЕДНЄ (AVERAGE) та обчислення відсотків у Google Таблицях.

📝 Умова задачі

7-А клас планує поїздку на екскурсію до Музею науки. Класний керівник має розрахувати загальну вартість поїздки для 25 учнів, враховуючи витрати на квитки, транспорт та можливість отримання групової знижки.

Дані для введення:

Додаткові умови:

1. Музей надає групову знижку 10% від загальної вартості вхідних квитків, якщо група перевищує 20 осіб.

2. Клас отримав спонсорську допомогу в розмірі 1500 грн, яку слід відняти від загальної суми витрат.

📊 Завдання для учнів (Кроки в Google Таблицях)

Крок 1: Створення та заповнення таблиці

1. Створіть нову Google Таблицю та назвіть її: "Екскурсія 7-А клас".

2. Створіть таблицю, як показано нижче (комірки A1:E5).

Крок 2: Використання формул для обчислення (Стовпець D)

1. У комірці D3 обчисліть загальну вартість квитків (Вартість за 1 од. $\times$ Кількість):

   • Введіть формулу: =B3*C3

2. У комірці D4 обчисліть загальну вартість оренди автобуса:

   • Введіть формулу: =B4*C4

3. У комірці D5 обчисліть загальну суму на кишенькові витрати:

   • Введіть формулу: =B5*C5

Крок 3: Обчислення знижки (Секція 1)

1. У комірці E7 обчисліть Суму квитків (без знижки) за допомогою функції СУМ:

   • Введіть: =СУМ(D3) (або просто посилання на D3)

2. У комірці E8 розрахуйте Суму знижки (10%) від вартості квитків (E7):

   • Введіть формулу: =E7*0.1

Крок 4: Обчислення загальних витрат (Секція 2)

1. У комірці B9 обчисліть Загальні витрати (до спонсорства) (Сума всіх витрат D3:D5 мінус знижка B8):

   • Введіть формулу: =СУМ(D3:D5)-B8

2. У комірці B11 обчисліть Кінцеву вартість екскурсії (Загальні витрати B9 мінус Спонсорська допомога B10):

   • Введіть формулу: =B9-B10

Крок 5: Обчислення середнього (Секція 3)

1. У комірці B12 обчисліть Вартість на 1 учня (Кінцева вартість B11, поділена на кількість учнів - 25).

   • Введіть формулу: =B11/25

   • Додатково: У цьому ж діапазоні можна показати, як обчислити Середню вартість одиниці (B3:B5) за допомогою функції СЕРЕДНЄ: =СЕРЕДНЄ(B3:B5)

✔️ Очікувані результати (для самоперевірки):

• Загальна вартість квитків (D3): 2000 грн

• Сума знижки (B8): 200 грн

• Кінцева вартість екскурсії (B11): 3550 грн

• Вартість на 1 учня (B12): 142 грн

Чи бажаєте, щоб я створив іншу задачу, наприклад, на тему оцінювання успішності учнів?