Відмінності між версіями «Портфоліо Шакурова Євгена з теми: "Основи веб-дизайну"»

Матеріал з Iteach WIKI
Перейти до: Навігація, пошук
(→‎Вік учнів, клас)
(→‎Вік учнів, клас)
 
(не показані 209 проміжних версій 3 учасників)
Рядок 1: Рядок 1:
 
=Назва навчальної теми=
 
=Назва навчальної теми=
  
−
[[Файл:Oomlage350.jpg|600px|thumb|left|]]
+
[[Файл:Oomlage350.jpg|500px|thumb|left|]]
  
 
<font color = "#FF4500">'''АВТОМАТИЗОВАНЕ РОЗРОБЛЕННЯ ВЕБ-САЙТІВ.'''
 
<font color = "#FF4500">'''АВТОМАТИЗОВАНЕ РОЗРОБЛЕННЯ ВЕБ-САЙТІВ.'''
Рядок 15: Рядок 15:
  
 
=Стислий опис проекту (скопіювати з Плану)=
 
=Стислий опис проекту (скопіювати з Плану)=
−
'''Навчальний проект створений для учнів 11 класу'''
+
'''Навчальний проект створений для учнів <u>11 класу'''</u>
  
−
'''Назва теми: «Створення сайту за допомогою "Joomla"»'''
+
'''Назва теми: <u>«Створення сайту за допомогою "Joomla"»</u>'''
  
−
'''В ході проекту учні навчаться створювати сайти за допомогою майстра;  
+
'''В ході проекту учні навчаться:'''
−
 
+
<li> створювати сайти за допомогою майстра;  
−
'''відкривати й зберігати проекти веб-сайтів;'''
+
<li> відкривати й зберігати проекти веб-сайтів;
−
 
+
<li> застосовувати шаблони для створення сайтів й розробляти власні шаблони;
−
'''застосовувати шаблони для створення сайтів й розробляти власні шаблони;'''
+
<li> форматувати веб-сторінки та їхні елементи у візуальному режимі.
−
 
+
<p style="text-indent: 40px">Учні здобудуть навички,  використовування засобів візуального веб-редактора для створення й форматування таблиць на веб-сторінках і структурування веб-сторінок в цілому; використовувати засоби візуального веб-редактора для імпорту на веб-сторінки зображень, аудіо- та відеофрагментів й настроювання параметрів їхнього розташування, відображення та відтворення.</p>
−
'''форматувати веб-сторінки та їхні елементи у візуальному режимі.'''
+
−
 
+
−
 
+
−
Учні здобудуть навички,  використовування засобів візуального веб-редактора для створення й форматування таблиць на веб-сторінках і структурування веб-сторінок в цілому; засоби візуального веб-редактора для імпорту на веб-сторінки зображень, аудіо- та відеофрагментів й настроювання параметрів їхнього розташування, відображення та відтворення.
+
  
 
=План вивчення теми (вставити файл)=
 
=План вивчення теми (вставити файл)=
  
−
[https://docs.google.com/file/d/0B1h466oVmS9hUnAwaVJSUW5PR3M/edit?usp=sharing План впровадження теми "Основи веб-дизайну" ]
+
[https://docs.google.com/file/d/0ByFUBrDnd0AlR0E2Rl9CaHFiczA/edit?usp=sharing План вивчення теми "Основи веб-дизайну" ]
  
−
[https://docs.google.com/file/d/0B1h466oVmS9hUnAwaVJSUW5PR3M/edit?usp=sharing План вивчення теми "Основи веб-дизайну" ]
+
[https://docs.google.com/file/d/0ByFUBrDnd0AlZnE2VkRpZHl6QTg/edit?usp=sharing План впровадження теми "Основи веб-дизайну" ]
  
 
=Оцінювання (стислий опис і інструменти)=
 
=Оцінювання (стислий опис і інструменти)=
 +
<p style="text-indent: 40px">Упродовж навчання за методом проектів вчителі постійно і систематично за допомогою засобів оцінювання збирають інформацію про те, як просувається навчання учнів та наскільки успішно вони навчаються. Вони слухають дискусії, які ведуть учні у малих групах, спостерігають за учнями, які працюють над запланованими вправами та за тим, як учні самі планують свої навчальні завдання, а також спостерігають за тим, як учні ставлять запитання під час роботи. Таке постійне оцінювання, яке починається з попереднього оцінювання знань та вмінь учнів на початку роботи в проектах і продовжується впродовж всього виконання учнями проектів називається формуючим оцінюванням. Вчителі використовують дані з такого оцінювання для того, щоб коригувати своє викладання та забезпечувати правильне виконання учнями проектних завдань. Коли вчителі регулярно залучають учнів до збору та перевірки таких відомостей про їхнє навчання, вони допомагають їм ставати відповідальними, самостійними та незалежними учнями.</p>
 +
 +
<p style="text-indent: 40px"><u>Підсумкове оцінювання</u> – це таке оцінювання, яке проводиться наприкінці навчальної теми або проектів. Таке оцінювання може  допомогти отримати важливу інформацію щодо всього процесу навчання, яка потрібна для аналізу організації та проведення навчання. Вчителі можуть знайти слабкі місця  викладанні курсу, над якими необхідно попрацювати більш ґрунтовно протягом майбутніх навчальних тем та вже з майбутніми учнями. Учні можуть визначити свої проблемні місця та поставити цілі щодо свого подальшого навчання.</p>
  
−
:Упродовж навчання за методом проектів вчителі постійно і систематично за допомогою засобів оцінювання збирають інформацію про те, як просувається навчання учнів та наскільки успішно вони навчаються. Вони слухають дискусії, які ведуть учні у малих групах, спостерігають за учнями, які працюють над запланованими вправами та за тим, як учні самі планують свої навчальні завдання, а також спостерігають за тим, як учні ставлять запитання під час роботи. Таке постійне оцінювання, яке починається з попереднього оцінювання знань та вмінь учнів на початку роботи в проектах і продовжується впродовж всього виконання учнями проектів називається формуючим оцінюванням. Вчителі використовують дані з такого оцінювання для того, щоб коригувати своє викладання та забезпечувати правильне виконання учнями проектних завдань. Коли вчителі регулярно залучають учнів до збору та перевірки таких відомостей про їхнє навчання, вони допомагають їм ставати відповідальними, самостійними та незалежними учнями.
+
[https://docs.google.com/file/d/0ByFUBrDnd0AlSm4yR1pMZ1lnUU0/edit?usp=sharing ЗХЯД]
  
−
:Підсумкове оцінювання – це таке оцінювання, яке проводиться наприкінці навчальної теми або проектів. Таке оцінювання може  допомогти отримати важливу інформацію щодо всього процесу навчання, яка потрібна для аналізу організації та проведення навчання. Вчителі можуть знайти слабкі місця  викладанні курсу, над якими необхідно попрацювати більш ґрунтовно протягом майбутніх навчальних тем та вже з майбутніми учнями. Учні можуть визначити свої проблемні місця та поставити цілі щодо свого подальшого навчання.
+
[https://docs.google.com/file/d/0ByFUBrDnd0AlZDFPY2RpdWJXSmM/edit?usp=sharing Опитування щодо збереження диференціації]
  
−
[https://docs.google.com/file/d/0B1h466oVmS9haW83RXlSMFgwUW8/edit?usp=sharing ЗХЯД]
+
[https://docs.google.com/file/d/0ByFUBrDnd0AlQTBWVlpTX0tBbjA/edit?usp=sharing Контрольний список для роботи з інформаційними джерелами для досліджень. Старші класи]
  
−
[https://docs.google.com/file/d/0B1h466oVmS9hTm1CVHE2OWZFSE0/edit?usp=sharing Опитування щодо збереження диференціації]
+
[https://docs.google.com/file/d/0ByFUBrDnd0AlQmJiZmVsdVVUbkU/edit?usp=sharing Контрольний список процес дослідження. Всі класи]
  
−
[https://docs.google.com/file/d/0B1h466oVmS9hTVZTTmRvQ2tncU0/edit?usp=sharing Самооцінювання учнівської роботи]
+
[https://docs.google.com/file/d/0ByFUBrDnd0AlbzlqQ3o2cXhua1U/edit?usp=sharing Форма оцінювання дослідження. Старша школа]  
  
−
[https://docs.google.com/file/d/0B1h466oVmS9haVAtUGJoMFJmbEE/edit?usp=sharing Форма оцінювання виконання групових завдань]
+
[https://docs.google.com/file/d/0ByFUBrDnd0AlbTFZc253d3ZJMjg/edit?usp=sharing Форма оцінювання виконання групового завдання. Середні і старші класи]
  
−
[https://docs.google.com/file/d/0B1h466oVmS9hYUhkTVRlczlJdE0/edit?usp=sharing Форма оцінювання щодо участі в обговореннях. Старші класи ]
+
[https://docs.google.com/file/d/0ByFUBrDnd0AlNUFFT0VsRlNydms/edit?usp=sharing Контрольний список для управління проектом. Всі класи]
  
−
[https://docs.google.com/file/d/0B1h466oVmS9hamJzR2NLbkZUS1E/edit?usp=sharing Контрольний список для управління проектом. ]
+
[https://docs.google.com/file/d/0ByFUBrDnd0AlSndxdUs3Qm95blU/edit?usp=sharing Контрольний список планування проекту. Всі класи]  
  
−
[https://docs.google.com/file/d/0B1h466oVmS9hc0h3Ul9lRGdfcGM/edit?usp=sharing Форма оцінювання аналізу завдання. Середні і старші класи ]
+
[https://docs.google.com/file/d/0ByFUBrDnd0AlYlNaVDlUdjRUQVU/edit?usp=sharing Форма оцінювання аналізу завдання. Середні і старші класи]  
  
−
[https://docs.google.com/file/d/0B1h466oVmS9hNjNydk5GV3hRZkU/edit?usp=sharing Контрольний список з керівництва власним навчанням. Старші класи ]
+
[https://docs.google.com/file/d/0ByFUBrDnd0AlWnllMENfZTkyVG8/edit?usp=sharing Форма оцінювання письмових робіт для веб-сайтів. Старші класи]
  
−
[https://docs.google.com/file/d/0B1h466oVmS9hLU00a0EzUjhIQk0/edit?usp=sharing Форма оцінювання письмових робіт для веб-сайтів. Старші класи ]
+
[https://docs.google.com/file/d/0ByFUBrDnd0AlSk9JZTNoVEJSdlk/edit?usp=sharing Форма оцінювання комп’ютерних робіт. Всі класи.]
  
−
[https://docs.google.com/file/d/0B1h466oVmS9hREp1bzcwcTZXZjg/edit?usp=sharing Форма оцінювання комп’ютерних робіт. ]
+
[https://docs.google.com/file/d/0ByFUBrDnd0AlSzlHY0dlNlQ4NzQ/edit?usp=sharing Контрольний список для вікі-сайту. Старші класи]  
  
−
[https://docs.google.com/file/d/0B1h466oVmS9hUGtVS3dNbFMzbTg/edit?usp=sharing Контрольний список для вікі-сайту]
+
[https://docs.google.com/file/d/0ByFUBrDnd0AlN2pqMWcyZFFiLVU/edit?usp=sharing Форма оцінювання вікі-сайтів. Старші класи.]  
  
−
[https://docs.google.com/file/d/0B1h466oVmS9hb0Q3N01rbmwyX1E/edit?usp=sharing Контрольний список: вклад в групову роботу.]
+
[https://docs.google.com/file/d/0ByFUBrDnd0AleHBMeGRLOEZvcDA/edit?usp=sharing Форма оцінювання навичок вирішення проблем і пояснення способу їх вирішення. Старші класи.]
 +
 +
[https://docs.google.com/file/d/0ByFUBrDnd0AlTFdtcGJtNGwyWU0/edit?usp=sharing Форма оцінювання виконання групових завдань. Середні і старші класи]
  
 
=Діяльність учнів та вчителя (скопіювати з Плану з посиланнями на відповідні документи)=
 
=Діяльність учнів та вчителя (скопіювати з Плану з посиланнями на відповідні документи)=
  
−
До початку навчання за цією темою <u>потрібно:</u>
+
[[Файл:W123.jpg|600 px]] <div style="float:right; margin:8px; padding:6px; border:1px solid #bbbbbb; width:300px;">
−
 
+
<h3>'''До початку навчання за цією темою <u>потрібно:</u></h3>'''
 
* Переглянути терміни та основні поняття у довідковому інформаційному документі;  
 
* Переглянути терміни та основні поняття у довідковому інформаційному документі;  
−
 
+
* Пересвідчитися, що учні знайомі з мережею інтернет, знають основи мови розмітки гіпертексту та мають підключення до інтернету для виконання проекту;
−
* Пересвідчитися, що учні мають досвід використання математичних дій та формул  для проведення досліджень;
+
−
 
+
 
* Перевірити, чи  учні знають, як шукати інформацію в Інтернеті, зберігати її та документувати;
 
* Перевірити, чи  учні знають, як шукати інформацію в Інтернеті, зберігати її та документувати;
 +
* Вибрати учнів та поділити іх на 2 групи.
 +
</div>
  
−
* Вибрати учнів – добровольців для занять 7-8 учнів.
 
  
−
<font color = "#0000FF">'''Заняття 1'''</font>  
+
<blockquote><h2><font style="font-family:Monotype Corsiva;"><font color="OrangeRed">Учні здобудуть навички,  використовування засобів візуального веб-редактора для створення і структурування веб-сторінок; отримають можливість створювати власні сайти.</font></font></h2></blockquote>
  
−
<font color = "#00CD00">'''"Тема: Статичные и динамичные сайты. Установка Denwer."'''</font>
 
  
−
<p>Вчитель демонструє навчальну тему учням. Розповідає, що учні будуть робити на протязі 4 тижнів, що вони створять власний проект, проведуть дослідження в групах. Ознайомлення з навчальною темою: '''''АВТОМАТИЗОВАНЕ РОЗРОБЛЕННЯ ВЕБ-САЙТІВ. Створення сайту за допомогою "Joomla".'''''.</p>
+
<font style="font-family:Tahoma; font-size:15pt;"><font color = "#0000FF">'''Заняття 1:''' <font color = "#00CD00">"Тема: Знайомство з мережею інтернет"</font></font></font>
−
 
+
<hr>
−
<font color = "#FF4500">Цілі заняття:</font>
+
<p style="text-indent: 40px">Вчитель демонструє навчальну тему учням. Розповідає, що учні будуть робити на протязі 4 тижнів, що вони створять власний проект, проведуть дослідження в групах. Ознайомлення з навчальною темою: '''''АВТОМАТИЗОВАНЕ РОЗРОБЛЕННЯ ВЕБ-САЙТІВ. Створення сайту за допомогою "Joomla".'''''.</p>
  
 +
<div style="background-color:#eeeeff;"><font style="font-family:Tahoma; font-size:13pt;"><font color = "#FF4500">Цілі заняття:</font></font></div>
 +
<div style="overflow:auto; height:80px; width:500px; padding:8px; border:1px solid #ccc;">
 
• Познайомити з історією створення інтернет.
 
• Познайомити з історією створення інтернет.
  
Рядок 97: Рядок 98:
  
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
−
 
+
</div >
−
<font color = "#0000FF">'''Заняття 2'''</font>
+
<font style="font-family:Tahoma; font-size:15pt;"><font color = "#0000FF">'''Заняття 2:''' <font color = "#00CD00">"Тема:Статичні і динамічні сайти. Установка denwer."</font></font></font>
−
 
+
<hr>
−
<font color = "#00CD00">'''"Тема:Установка CMS «Joomla!»."'''</font>
+
−
 
+
 
<p>Починаємо готуватися до нашого проекту.</p>
 
<p>Починаємо готуватися до нашого проекту.</p>
  
−
<font color = "#FF4500">Цілі заняття:</font>
+
<div style="background-color:#eeeeff;"><font style="font-family:Tahoma; font-size:13pt;"><font color = "#FF4500">Цілі заняття:</font></font></div>
−
 
+
<div style="overflow:auto; height:80px; width:500px; padding:8px; border:1px solid #ccc;">
 
• Познайомити зі структурою та особливостями побудови Web-сторінок;
 
• Познайомити зі структурою та особливостями побудови Web-сторінок;
  
Рядок 115: Рядок 114:
  
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
−
 
+
</div>
−
<font color = "#0000FF">'''Заняття 3'''</font>
+
<font style="font-family:Tahoma; font-size:15pt;"><font color = "#0000FF">'''Заняття 3:''' <font color = "#00CD00">"Установка Cms «Joomla!»."</font></font></font>
−
 
+
<hr>
−
<font color = "#00CD00">'''"Тема:Внешний и внутренний интерфейс. Добавление пользователей."'''</font>
+
−
 
+
 
<p>Спочатку поставте перед учнями Ключове запитання: Як самостійно зробити сайт? Можна провести з учнями  мозковий штурм у малих групах та поміркувати про причини, які спонукають розробляти нові рекомендації і знаходити  альтернативи. Запитайте учнів, для чого потрібен власний веб сайт? Учні також обмірковуватимуть це запитання наприкінці вивчення теми після виконання групових проектів.</p>
 
<p>Спочатку поставте перед учнями Ключове запитання: Як самостійно зробити сайт? Можна провести з учнями  мозковий штурм у малих групах та поміркувати про причини, які спонукають розробляти нові рекомендації і знаходити  альтернативи. Запитайте учнів, для чого потрібен власний веб сайт? Учні також обмірковуватимуть це запитання наприкінці вивчення теми після виконання групових проектів.</p>
  
Рядок 127: Рядок 124:
  
 
• Що потрібно для цього зробити?  
 
• Що потрібно для цього зробити?  
−
 
+
<div style="background-color:#eeeeff;"><font style="font-family:Tahoma; font-size:13pt;"><font color = "#FF4500">Цілі заняття:</font></font></div>
−
<font color = "#FF4500">Цілі заняття:</font>
+
<div style="overflow:auto; height:80px; width:500px; padding:8px; border:1px solid #ccc;">
−
 
+
 
• Навчити встановлювати CMS «JOOMLA!»;
 
• Навчити встановлювати CMS «JOOMLA!»;
  
Рядок 139: Рядок 135:
  
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
−
 
+
</div>
−
<font color = "#0000FF">'''Заняття 4'''</font>
+
<font style="font-family:Tahoma; font-size:15pt;"><font color = "#0000FF">'''Заняття 4:''' <font color = "#00CD00">"Тема:Зовнішній і внутрішній інтерфейс. Додавання користувачів.."</font></font></font>
−
 
+
<hr>
−
<font color = "#00CD00">'''"Тема:Создаем структуру сайта."'''</font>
+
−
 
+
 
<p>Учні мають розробити ідеї щодо структури та шаблону оформлення власного веб-сайту:</p>
 
<p>Учні мають розробити ідеї щодо структури та шаблону оформлення власного веб-сайту:</p>
  
−
<font color = "#FF4500">Цілі заняття:</font>
+
<div style="background-color:#eeeeff;"><font style="font-family:Tahoma; font-size:13pt;"><font color = "#FF4500">Цілі заняття:</font></font></div>
−
 
+
<div style="overflow:auto; height:80px; width:500px; padding:8px; border:1px solid #ccc;">
 
• Навчити призначати права в CMS «JOOMLA!»;
 
• Навчити призначати права в CMS «JOOMLA!»;
  
Рядок 159: Рядок 153:
  
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
−
 
+
</div>
−
<font color = "#0000FF">'''Заняття 5'''</font>
+
<font style="font-family:Tahoma; font-size:15pt;"><font color = "#0000FF">'''Заняття 5:''' <font color = "#00CD00">"Тема:Створюємо структуру сайту."</font></font></font>
−
 
+
<hr>
−
<font color = "#00CD00">'''"Тема:Вставка изображений."'''</font>
+
−
 
+
 
<p>Перед учнями ставиться наступне завдання: Створити структуру сайту.</p>
 
<p>Перед учнями ставиться наступне завдання: Створити структуру сайту.</p>
  
−
<font color = "#FF4500">Цілі заняття:</font>
+
<div style="background-color:#eeeeff;"><font style="font-family:Tahoma; font-size:13pt;"><font color = "#FF4500">Цілі заняття:</font></font></div>
−
 
+
<div style="overflow:auto; height:80px; width:500px; padding:8px; border:1px solid #ccc;">
 
• Навчити створювати свою власну структуру сайту;
 
• Навчити створювати свою власну структуру сайту;
  
Рядок 179: Рядок 171:
  
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
−
 
+
</div>
−
<font color = "#0000FF">'''Заняття 6'''</font>
+
<font style="font-family:Tahoma; font-size:15pt;"><font color = "#0000FF">'''Заняття 6:''' <font color = "#00CD00">"Тема:Вставка зображень."</font></font></font>
−
 
+
<hr>
−
<font color = "#00CD00">'''"Тема:Установка дополнительных компонентов."'''</font>
+
−
 
+
 
<p>Учням пропонується вставка зображень.</p>
 
<p>Учням пропонується вставка зображень.</p>
  
−
<font color = "#FF4500">Цілі заняття:</font>
+
<div style="background-color:#eeeeff;"><font style="font-family:Tahoma; font-size:13pt;"><font color = "#FF4500">Цілі заняття:</font></font></div>
−
 
+
<div style="overflow:auto; height:80px; width:500px; padding:8px; border:1px solid #ccc;">
 
• Навчити додавати зображення;
 
• Навчити додавати зображення;
  
Рядок 199: Рядок 189:
  
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
−
 
+
</div>
−
<font color = "#0000FF">'''Заняття 7'''</font>
+
<font style="font-family:Tahoma; font-size:15pt;"><font color = "#0000FF">'''Заняття 7:''' <font color = "#00CD00">"Тема:Встановлення додаткових компонентів."</font></font></font>
−
 
+
<hr>
−
<font color = "#00CD00">'''"Тема:Работа с шаблоном сайта."'''</font>
+
−
 
+
 
<p>Учням пропонується встановлення додаткових компонентів.</p>
 
<p>Учням пропонується встановлення додаткових компонентів.</p>
  
−
<font color = "#FF4500">Цілі заняття:</font>
+
<div style="background-color:#eeeeff;"><font style="font-family:Tahoma; font-size:13pt;"><font color = "#FF4500">Цілі заняття:</font></font></div>
−
 
+
<div style="overflow:auto; height:80px; width:500px; padding:8px; border:1px solid #ccc;">
 
• Навчити встановлювати і налаштовувати компоненти;
 
• Навчити встановлювати і налаштовувати компоненти;
  
Рядок 217: Рядок 205:
  
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
−
 
+
</div>
−
<font color = "#0000FF">'''Заняття 8'''</font>
+
<font style="font-family:Tahoma; font-size:15pt;"><font color = "#0000FF">'''Заняття 8:''' <font color = "#00CD00">"Тема:Робота з шаблонами сайту."</font></font></font>
−
 
+
<hr>
−
<font color = "#00CD00">'''"Тема:Создание нового шаблона."'''</font>
+
−
 
+
 
<p>Учням пропонується робота з шаблонами сайту.</p>
 
<p>Учням пропонується робота з шаблонами сайту.</p>
  
−
<font color = "#FF4500">Цілі заняття:</font>
+
<div style="background-color:#eeeeff;"><font style="font-family:Tahoma; font-size:13pt;"><font color = "#FF4500">Цілі заняття:</font></font></div>
−
 
+
<div style="overflow:auto; height:80px; width:500px; padding:8px; border:1px solid #ccc;">
 
• Навчити встановлювати нові шаблони;
 
• Навчити встановлювати нові шаблони;
  
Рядок 233: Рядок 219:
  
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
−
 
+
</div>
−
<font color = "#0000FF">'''Заняття 9'''</font>
+
<font style="font-family:Tahoma; font-size:15pt;"><font color = "#0000FF">'''Заняття 9:''' <font color = "#00CD00">"Тема:Створення нового шаблону."</font></font></font>
−
 
+
<hr>
−
<font color = "#00CD00">'''"Тема:Таблицы стилей."'''</font>
+
−
 
+
 
<p>Учням пропонується створення нового шаблону.</p>
 
<p>Учням пропонується створення нового шаблону.</p>
  
−
<font color = "#FF4500">Цілі заняття:</font>
+
<div style="background-color:#eeeeff;"><font style="font-family:Tahoma; font-size:13pt;"><font color = "#FF4500">Цілі заняття:</font></font></div>
−
 
+
<div style="overflow:auto; height:80px; width:500px; padding:8px; border:1px solid #ccc;">
 
• Навчити створювати свої і змінювати чужі шаблони сайту виконаного на CMS «Joomla!»;
 
• Навчити створювати свої і змінювати чужі шаблони сайту виконаного на CMS «Joomla!»;
  
Рядок 249: Рядок 233:
  
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.
−
 
+
</div>
−
<font color = "#0000FF">'''Заняття 10'''</font>
+
<font style="font-family:Tahoma; font-size:15pt;"><font color = "#0000FF">'''Заняття 10:''' <font color = "#00CD00">"Тема:ПУБЛІКАЦІЯ САЙТУ В МЕРЕЖІ ІНТЕРНЕТ."</font></font></font>
−
 
+
<hr>
−
<font color = "#00CD00">'''"Тема:Публикация сайта в сети интернет."'''</font>
+
<div style="background-color:#eeeeff;"><font style="font-family:Tahoma; font-size:13pt;"><font color = "#FF4500">Цілі заняття:</font></font></div>
−
 
+
<div style="overflow:auto; height:80px; width:500px; padding:8px; border:1px solid #ccc;">
−
<p>ПУБЛІКАЦІЯ САЙТУ В МЕРЕЖІ ІНТЕРНЕТ</p>
+
−
 
+
−
<font color = "#FF4500">Цілі заняття:</font>
+
−
 
+
 
• Навчити публікувати свою роботу в мережі інтернет;
 
• Навчити публікувати свою роботу в мережі інтернет;
  
Рядок 265: Рядок 245:
  
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій
 
• Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій
−
 
+
</div>
−
В ході дослідження учні зробили Вікі-статтю, в якому виклали всю інформацію дослідження
+
<p style="text-indent: 40px">В ході дослідження учні зробили Вікі-статтю, в якому виклали всю інформацію дослідження
−
http://wiki.iteach.com.ua
+
http://wiki.iteach.com.ua</p>
  
 
=Діяльність учнів=
 
=Діяльність учнів=
Рядок 275: Рядок 255:
 
=Діяльність вчителя=
 
=Діяльність вчителя=
  
−
[https://docs.google.com/file/d/0B1h466oVmS9hTThIaUxqVVJwbU0/edit?usp=sharing Презентація для учнів]
+
[https://docs.google.com/file/d/0ByFUBrDnd0AlWEhYZEFySVd3VUE/edit?usp=sharing Презентація для учнів]
  
 
[https://docs.google.com/forms/d/19158RqPpZxy2mDLadg7OKrC2GYwKsg1rBCteSnNv8_Q/edit?usp=sharing Опитувальник для учнів]
 
[https://docs.google.com/forms/d/19158RqPpZxy2mDLadg7OKrC2GYwKsg1rBCteSnNv8_Q/edit?usp=sharing Опитувальник для учнів]
  
−
[https://docs.google.com/file/d/0B1h466oVmS9hOGFyTzRmS1REYmc/edit?usp=sharing Діаграма для учнів]
+
[https://docs.google.com/file/d/0ByFUBrDnd0AldzJNN0t3Uy1fR1E/edit?usp=sharing Діаграма для учнів]
−
 
+
−
 
+
−
 
+
−
<font color = "#0000CD">'''Презентація для представлення особливостей методу проектів'''</font>
+
−
 
+
−
[[Файл:Metod1.png|400px|thumb|left|]]
+
−
 
+
−
[[Файл:Metod23.png|400px|thumb|left|]]
+
−
 
+
−
[[Файл:Metod32.png|400px|thumb|left|]]
+
  
 +
<p style="text-align:center; font-size:15pt"><font color = "#0000CD">'''Презентація для представлення особливостей методу проектів'''</font></p>
  
 +
<p style="text-align:center;">[[Файл:Metod1.png|450px]] [[Файл:Metod23.png|450px]] [[Файл:Metod32.png|450px]]</p>
  
 
=Відомості про автора=
 
=Відомості про автора=
Рядок 301: Рядок 273:
  
 
==Навчальний заклад==
 
==Навчальний заклад==
−
Харківська загальноосвітня школа І-ІІІ ступенів №10 Харківської міської ради Харківської області
+
[http://school_10.klasna.com/ Харківська загальноосвітня школа І-ІІІ ступенів №10 Харківської міської ради Харківської області]
  
 
==Місто\село, район, область==
 
==Місто\село, район, область==
Рядок 307: Рядок 279:
  
 
==Контактні дані==
 
==Контактні дані==
−
ел. адреса: shakurov82@gmail.com
+
ел. адреса: '''shakurov82@gmail.com'''
  
 
=Відомості про тренінг=
 
=Відомості про тренінг=
Рядок 316: Рядок 288:
  
 
==Місце проведення тренінгу==
 
==Місце проведення тренінгу==
−
Харківська загальноосвітня школа І-ІІІ ступенів №10 Харківської міської ради Харківської області
+
[http://school_10.klasna.com/ Харківська загальноосвітня школа І-ІІІ ступенів №10 Харківської міської ради Харківської області]
  
 
==Тренери==
 
==Тренери==
−
Фесенко Олена Вікторівна
+
[[Користувач:Фесенко Олена| Фесенко Олена Вікторівна]]
 +
 
 +
[[Користувач:Токар Андрій| Токар Андрій Михайлович]]
  
−
Токар Андрій Михайлович
 
  
 
[[Категорія: Шаблони]]
 
[[Категорія: Шаблони]]
 +
[[Категорія:10 версія]]
 
[[Категорія: Проект для учнів 11 класу]]
 
[[Категорія: Проект для учнів 11 класу]]
 
[[Категорія: Інформатика]]
 
[[Категорія: Інформатика]]
 
[[Категорія:Банк проектів]]
 
[[Категорія:Банк проектів]]

Поточна версія на 16:09, 5 листопада 2014

Назва навчальної теми

Oomlage350.jpg

АВТОМАТИЗОВАНЕ РОЗРОБЛЕННЯ ВЕБ-САЙТІВ. Створення сайту за допомогою "Joomla"

Основний та другорядні (дотичні) навчальні предмети

Інформатика

Технології

Вік учнів, клас

11 клас

Стислий опис проекту (скопіювати з Плану)

Навчальний проект створений для учнів 11 класу

Назва теми: «Створення сайту за допомогою "Joomla"»

В ході проекту учні навчаться:

  • створювати сайти за допомогою майстра;
  • відкривати й зберігати проекти веб-сайтів;
  • застосовувати шаблони для створення сайтів й розробляти власні шаблони;
  • форматувати веб-сторінки та їхні елементи у візуальному режимі.

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

    План вивчення теми (вставити файл)

    План вивчення теми "Основи веб-дизайну"

    План впровадження теми "Основи веб-дизайну"

    Оцінювання (стислий опис і інструменти)

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

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

    ЗХЯД

    Опитування щодо збереження диференціації

    Контрольний список для роботи з інформаційними джерелами для досліджень. Старші класи

    Контрольний список процес дослідження. Всі класи

    Форма оцінювання дослідження. Старша школа

    Форма оцінювання виконання групового завдання. Середні і старші класи

    Контрольний список для управління проектом. Всі класи

    Контрольний список планування проекту. Всі класи

    Форма оцінювання аналізу завдання. Середні і старші класи

    Форма оцінювання письмових робіт для веб-сайтів. Старші класи

    Форма оцінювання комп’ютерних робіт. Всі класи.

    Контрольний список для вікі-сайту. Старші класи

    Форма оцінювання вікі-сайтів. Старші класи.

    Форма оцінювання навичок вирішення проблем і пояснення способу їх вирішення. Старші класи.

    Форма оцінювання виконання групових завдань. Середні і старші класи

    Діяльність учнів та вчителя (скопіювати з Плану з посиланнями на відповідні документи)

    W123.jpg

    До початку навчання за цією темою потрібно:

    • Переглянути терміни та основні поняття у довідковому інформаційному документі;
    • Пересвідчитися, що учні знайомі з мережею інтернет, знають основи мови розмітки гіпертексту та мають підключення до інтернету для виконання проекту;
    • Перевірити, чи учні знають, як шукати інформацію в Інтернеті, зберігати її та документувати;
    • Вибрати учнів та поділити іх на 2 групи.


    Учні здобудуть навички, використовування засобів візуального веб-редактора для створення і структурування веб-сторінок; отримають можливість створювати власні сайти.


    Заняття 1: "Тема: Знайомство з мережею інтернет"

    Вчитель демонструє навчальну тему учням. Розповідає, що учні будуть робити на протязі 4 тижнів, що вони створять власний проект, проведуть дослідження в групах. Ознайомлення з навчальною темою: АВТОМАТИЗОВАНЕ РОЗРОБЛЕННЯ ВЕБ-САЙТІВ. Створення сайту за допомогою "Joomla"..

    Цілі заняття:

    • Познайомити з історією створення інтернет.

    • Ознайомити з технологіями, що лежать в основі мережі інтернет.

    • Навчити визначати IP-адресу сервера, на якому розташовується сайт.

    • Зареєструвати особистий поштову скриньку.

    • Розвивати логічне мислення, стійкий інтерес до предмета, навички самостійної роботи.

    • Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.

    Заняття 2: "Тема:Статичні і динамічні сайти. Установка denwer."

    Починаємо готуватися до нашого проекту.

    Цілі заняття:

    • Познайомити зі структурою та особливостями побудови Web-сторінок;

    • Навчити установліваютDenwer, запускати html-файл через web-сервер.

    • Формувати системно-інформаційний підхід до аналізу навколишнього світу і загальнокультурні навички роботи з інформацією ..

    • Розвивати логічне мислення, стійкий інтерес до предмета, навички самостійної роботи.

    • Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.

    Заняття 3: "Установка Cms «Joomla!»."

    Спочатку поставте перед учнями Ключове запитання: Як самостійно зробити сайт? Можна провести з учнями мозковий штурм у малих групах та поміркувати про причини, які спонукають розробляти нові рекомендації і знаходити альтернативи. Запитайте учнів, для чого потрібен власний веб сайт? Учні також обмірковуватимуть це запитання наприкінці вивчення теми після виконання групових проектів.

    Вчитель показує вступну презентацію, в ході якої та після неї варто провести з класом обговорення наступних запитань:

    • Які програми допомагають створювати власний веб-сайт?

    • Що потрібно для цього зробити?

    Цілі заняття:

    • Навчити встановлювати CMS «JOOMLA!»;

    • Розвиток аналітичного та логічного мислення;

    • Розвиток уміння робити висновки;

    • Створення умов для набуття досвіду на етапі створення Web-сайту.

    • Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.

    Заняття 4: "Тема:Зовнішній і внутрішній інтерфейс. Додавання користувачів.."

    Учні мають розробити ідеї щодо структури та шаблону оформлення власного веб-сайту:

    Цілі заняття:

    • Навчити призначати права в CMS «JOOMLA!»;

    • Вивчити інтерфейс CMS «JOOMLA!»;

    • Розвиток аналітичного та логічного мислення;

    • Розвиток уміння робити висновки;

    • Створення умов для набуття досвіду на етапі створення Web-сайту.

    • Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.

    Заняття 5: "Тема:Створюємо структуру сайту."

    Перед учнями ставиться наступне завдання: Створити структуру сайту.

    Цілі заняття:

    • Навчити створювати свою власну структуру сайту;

    • Навчити додавати матеріал;

    • Розвиток аналітичного та логічного мислення;

    • Розвиток уміння робити висновки;

    • Створення умов для набуття досвіду на етапі створення Web-сайту.

    • Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.

    Заняття 6: "Тема:Вставка зображень."

    Учням пропонується вставка зображень.

    Цілі заняття:

    • Навчити додавати зображення;

    • Навчити управляти файлами;

    • Розвиток аналітичного та логічного мислення;

    • Розвиток уміння робити висновки;

    • Створення умов для набуття досвіду на етапі створення Web-сайту.

    • Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.

    Заняття 7: "Тема:Встановлення додаткових компонентів."

    Учням пропонується встановлення додаткових компонентів.

    Цілі заняття:

    • Навчити встановлювати і налаштовувати компоненти;

    • Навчити управляти файлами;

    • Розвиток аналітичного та логічного мислення;

    • Розвиток уміння робити висновки;

    • Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.

    Заняття 8: "Тема:Робота з шаблонами сайту."

    Учням пропонується робота з шаблонами сайту.

    Цілі заняття:

    • Навчити встановлювати нові шаблони;

    • Навчити управляти файлами;

    • Розвиток аналітичного та логічного мислення;

    • Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.

    Заняття 9: "Тема:Створення нового шаблону."

    Учням пропонується створення нового шаблону.

    Цілі заняття:

    • Навчити створювати свої і змінювати чужі шаблони сайту виконаного на CMS «Joomla!»;

    • Навчити управляти файлами;

    • Розвиток аналітичного та логічного мислення;

    • Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій.

    Заняття 10: "Тема:ПУБЛІКАЦІЯ САЙТУ В МЕРЕЖІ ІНТЕРНЕТ."

    Цілі заняття:

    • Навчити публікувати свою роботу в мережі інтернет;

    • Навчити управляти файлами;

    • Розвиток аналітичного та логічного мислення;

    • Показати важливість знань і умінь у сфері інформаційних комп'ютерних технологій

    В ході дослідження учні зробили Вікі-статтю, в якому виклали всю інформацію дослідження http://wiki.iteach.com.ua

    Діяльність учнів

    Учнівська Вікі-стаття

    Діяльність вчителя

    Презентація для учнів

    Опитувальник для учнів

    Діаграма для учнів

    Презентація для представлення особливостей методу проектів

    Metod1.png Metod23.png Metod32.png

    Відомості про автора

    Ім'я, прізвище

    Шакуров Євген Олексійович

    Фах, навчальний предмет

    вчитель інформатики

    Навчальний заклад

    Харківська загальноосвітня школа І-ІІІ ступенів №10 Харківської міської ради Харківської області

    Місто\село, район, область

    місто Харків

    Контактні дані

    ел. адреса: shakurov82@gmail.com

    Відомості про тренінг

    Дати проведення тренінгу

    25-29 березня 2013 року

    Місце проведення тренінгу

    Харківська загальноосвітня школа І-ІІІ ступенів №10 Харківської міської ради Харківської області

    Тренери

    Фесенко Олена Вікторівна

    Токар Андрій Михайлович
    • Отримано з http://wiki.iteach.com.ua/index.php?title=Портфоліо_Шакурова_Євгена_з_теми:_%22Основи_веб-дизайну%22&oldid=743156