Відмінності між версіями «Конспект урока 5 Ковалевой Евгении»
(не показано 9 проміжних версій цього учасника) | |||
Рядок 1: | Рядок 1: | ||
− | [[ | + | |
− | + | ''' Конспект уроку на тему:"Створення власної веб-сторінки."''' | |
+ | |||
+ | |||
+ | Підготувала: Студентка 44 – групи: Ковальва Євгенія | ||
+ | |||
+ | '''Мета:''' | ||
+ | |||
+ | перевірка і оцінювання навичок та вмінь учнів з теми "Створення власної веб-сторінки.", | ||
+ | |||
+ | розвивати в учнів пам'ять, увагу,мислення, кругозір; виховувати інтерес до предмету, самостійність та дисциплінованість. | ||
+ | |||
+ | '''Тип уроку''': урок-лаборторна | ||
+ | '''Хід уроку''' | ||
+ | |||
+ | |||
+ | 1)актуалізація опорних знань | ||
+ | |||
+ | 2)викладення матеріалу (робота з абзацами, форматування тексту,) | ||
+ | |||
+ | 3)перевірка і оцінювання навичок та вмінь | ||
+ | |||
+ | |||
+ | |||
+ | 1)актуалізація опорних знань | ||
+ | |||
+ | |||
+ | 1.Що таке тег? | ||
+ | |||
+ | 2.Скільки атрибутів може мати тег?(1 і більше). | ||
+ | |||
+ | 3.Яке призначення браузерів?(Для доступу до новин та їх надсилання | ||
+ | |||
+ | користувач повинен мати прямий контакт із сервером новин і відповідне, | ||
+ | |||
+ | програмне забезпечення: Опера ,Інтернет Експлорер). | ||
+ | |||
+ | 4.Що таке гіпертекстове посилання?(Гіпертекстове посилання — це | ||
+ | |||
+ | підкреслений і виокремлений іншим кольором текст у документі, картинка | ||
+ | |||
+ | чи інший елемент, клацнувши на якому мишею, відкривають деякий інший | ||
+ | |||
+ | текстовий, звуковий чи відеофайл). 5.Що можна розмістити на Web-сторінці? | ||
+ | |||
+ | 6. Які параметри може мати тег BODY? | ||
+ | |||
+ | 7.Які теги позначають товстий, курсивний і підкреслений шрифт? | ||
+ | |||
+ | 8. Які теги призначені для вирівнювання елементів на веб-сторінці? | ||
+ | |||
+ | 2. | ||
+ | |||
+ | '''Завдання1''' | ||
+ | |||
+ | 1)Створіть за допомою текстового редактора наступний html файл і збережіть його з назвою file1.htm. | ||
+ | |||
+ | 2)Тег <BODY> запишіть так:<BODY BGCOLOR = "white" TEXT = "black". | ||
+ | |||
+ | 3)Введіть такий текст: | ||
+ | |||
+ | Мене звати (введіть своє имя).Мені _ років. | ||
+ | |||
+ | Я хочу стати веб-дизайнером. | ||
+ | |||
+ | Це моя перша веб-сторінка.Тут я можу писати будь-який текст, наприклад, про себе і мої інтереси. | ||
+ | |||
+ | Пізніше я навчуся вставляти фотографії, картинки, звук, відеозображення шляхом посилання на відповідні графічні , | ||
+ | |||
+ | звукові чи відеофайли.Я збережу цей файл на диску і відкрию його у браузері.Моя сторінка ще не красива і не цікава. | ||
+ | |||
+ | Але скоро я навчуся робити прикольні веб-сторінки. | ||
+ | |||
+ | 4)Відкрийте файл у браузері. | ||
+ | |||
+ | 5)Зверніть увагу, що текст на екрані розташований дещо інакше, ніж у файлі: | ||
+ | |||
+ | немає абзаців і абзацного відступу, текст вирівняний до лівого краю. | ||
+ | |||
+ | 6)Проеспериментуйте з різними значеннями параметрів BGCOLOR i TEXT. | ||
+ | |||
+ | |||
+ | ''' Завдання2''' | ||
+ | |||
+ | Відформатуйте текст у файлі file1.htm наступним чином і збережіть його у файлі2.htm: | ||
+ | |||
+ | 1)Заголовок повинен мати назву "My web-page | ||
+ | |||
+ | 2)Задайте жовтий колір тла | ||
+ | |||
+ | 3)Колір тексту повинен бути темно-синій | ||
+ | |||
+ | 4)По центру заголовком1 напишіть "Привіт" і заголовком2 (теж по центру) "Мене звуть(своє имя)" | ||
+ | |||
+ | 5)Далі проведіть горизонтальну лінію | ||
+ | |||
+ | 6)Заголовком3 напишіть "Мені_років" | ||
+ | |||
+ | 7)Заголовком4 "Я хочу стати веб-дизайнером" | ||
+ | |||
+ | 8)Знову проведіть горизонтальну лінію | ||
+ | |||
+ | 9)Далі напишіть такий текст: | ||
+ | |||
+ | "Це моя друга спроба створити веб-сторінку.Я вже вмію користуватися заголовками, вставляти лінії, форматувати текстові абзаци. | ||
+ | |||
+ | Пізніше я навчуся вставляти фотографії, картинки, звук, відеозображення шляхом посилання на відповідні графічні, звукові чи відеофайли. | ||
+ | |||
+ | Я збережу цей файл на диску і відкрию його у броузері.Цю веб сторінку я буду удосконалювати"і відформатуйте його таким чином: | ||
+ | |||
+ | |||
+ | *В 1-му речені слово "друга" повинно бути товстим шрифтом | ||
+ | |||
+ | *В 3-му речені слова "фотографії, картинки, звук, відеозображення" повинні бути курсивом. | ||
+ | |||
+ | Слова "графічні, звукові чи відеофайли" повинні бути підкресленим шрифтом | ||
+ | |||
+ | *Наступні 2-а речення повинні починатись з абзацу. | ||
+ | |||
+ | *В кінці тексту повинна бути проведена горизонтальна лінія. | ||
+ | |||
+ | '''ПРИМІТКА''' | ||
+ | |||
+ | '''Оформлення тексту для Web - сторінок''' | ||
+ | |||
+ | '' Теги,які використовуються для форматування тексту'' | ||
+ | |||
+ | Одинарні теги для розміщення тексту: | ||
+ | |||
+ | <P> - цей тег означає початок нового абзацу,але його прийнято записувати в кінці попереднього. | ||
+ | |||
+ | Наступне речення починається з нового,вирівняного до лівого краю,абзацу без відступу. | ||
+ | |||
+ | <BR>-наступний за цим тегом текст буде наведено у новому рядку без пропуску рядка. | ||
+ | |||
+ | <HR>-буде проведена горизонтальна лінія. | ||
+ | |||
+ | Парні теги для форматування символів тексту: | ||
+ | |||
+ | <B> </B> - товстий шрифт тексту; | ||
+ | |||
+ | <I> </I> - шрифт-курсив; | ||
+ | |||
+ | <U> </U> - підкреслений шрифт; | ||
+ | |||
+ | <SUB> </SUB> - нижній індекс; | ||
+ | |||
+ | <SUP> </SUP> - верхній індекс; | ||
+ | |||
+ | <BIG> </BIG> - великий шрифт; | ||
+ | |||
+ | <SMALL> </SMALL> - малий шрифт; | ||
+ | |||
+ | <EM> </EM> - виокремлений курсивом текст. | ||
+ | |||
+ | <B><I> </I></B>-товстий курсив | ||
+ | |||
+ | '''Домашнє завдання:''' | ||
+ | |||
+ | Перегляньте цец файл за допомогою броузера і поекспериментуйте з тегами форматування тексту. | ||
+ | |||
+ | Проекспериментууйте з розмірами вікна, в якому демонструється документ і переконайтеся, | ||
+ | |||
+ | що броузер автоматично змінює розташування тексту, щоб його можна було переглядати без горизонтальної смуги прокручування. | ||
+ | --[[User:Ковалева Евгения|Ковалева Евгения]] 21:27, 23 октября 2008 (EEST) |
Поточна версія на 20:27, 23 жовтня 2008
Конспект уроку на тему:"Створення власної веб-сторінки."
Підготувала: Студентка 44 – групи: Ковальва Євгенія
Мета:
перевірка і оцінювання навичок та вмінь учнів з теми "Створення власної веб-сторінки.",
розвивати в учнів пам'ять, увагу,мислення, кругозір; виховувати інтерес до предмету, самостійність та дисциплінованість.
Тип уроку: урок-лаборторна
Хід уроку
1)актуалізація опорних знань
2)викладення матеріалу (робота з абзацами, форматування тексту,)
3)перевірка і оцінювання навичок та вмінь
1)актуалізація опорних знань
1.Що таке тег?
2.Скільки атрибутів може мати тег?(1 і більше).
3.Яке призначення браузерів?(Для доступу до новин та їх надсилання
користувач повинен мати прямий контакт із сервером новин і відповідне,
програмне забезпечення: Опера ,Інтернет Експлорер).
4.Що таке гіпертекстове посилання?(Гіпертекстове посилання — це
підкреслений і виокремлений іншим кольором текст у документі, картинка
чи інший елемент, клацнувши на якому мишею, відкривають деякий інший
текстовий, звуковий чи відеофайл). 5.Що можна розмістити на Web-сторінці?
6. Які параметри може мати тег BODY?
7.Які теги позначають товстий, курсивний і підкреслений шрифт?
8. Які теги призначені для вирівнювання елементів на веб-сторінці?
2.
Завдання1
1)Створіть за допомою текстового редактора наступний html файл і збережіть його з назвою file1.htm.
2)Тег <BODY> запишіть так:<BODY BGCOLOR = "white" TEXT = "black".
3)Введіть такий текст:
Мене звати (введіть своє имя).Мені _ років.
Я хочу стати веб-дизайнером.
Це моя перша веб-сторінка.Тут я можу писати будь-який текст, наприклад, про себе і мої інтереси.
Пізніше я навчуся вставляти фотографії, картинки, звук, відеозображення шляхом посилання на відповідні графічні ,
звукові чи відеофайли.Я збережу цей файл на диску і відкрию його у браузері.Моя сторінка ще не красива і не цікава.
Але скоро я навчуся робити прикольні веб-сторінки.
4)Відкрийте файл у браузері.
5)Зверніть увагу, що текст на екрані розташований дещо інакше, ніж у файлі:
немає абзаців і абзацного відступу, текст вирівняний до лівого краю.
6)Проеспериментуйте з різними значеннями параметрів BGCOLOR i TEXT.
Завдання2
Відформатуйте текст у файлі file1.htm наступним чином і збережіть його у файлі2.htm:
1)Заголовок повинен мати назву "My web-page
2)Задайте жовтий колір тла
3)Колір тексту повинен бути темно-синій
4)По центру заголовком1 напишіть "Привіт" і заголовком2 (теж по центру) "Мене звуть(своє имя)"
5)Далі проведіть горизонтальну лінію
6)Заголовком3 напишіть "Мені_років"
7)Заголовком4 "Я хочу стати веб-дизайнером"
8)Знову проведіть горизонтальну лінію
9)Далі напишіть такий текст:
"Це моя друга спроба створити веб-сторінку.Я вже вмію користуватися заголовками, вставляти лінії, форматувати текстові абзаци.
Пізніше я навчуся вставляти фотографії, картинки, звук, відеозображення шляхом посилання на відповідні графічні, звукові чи відеофайли.
Я збережу цей файл на диску і відкрию його у броузері.Цю веб сторінку я буду удосконалювати"і відформатуйте його таким чином:
- В 1-му речені слово "друга" повинно бути товстим шрифтом
- В 3-му речені слова "фотографії, картинки, звук, відеозображення" повинні бути курсивом.
Слова "графічні, звукові чи відеофайли" повинні бути підкресленим шрифтом
- Наступні 2-а речення повинні починатись з абзацу.
- В кінці тексту повинна бути проведена горизонтальна лінія.
ПРИМІТКА
Оформлення тексту для Web - сторінок
Теги,які використовуються для форматування тексту
Одинарні теги для розміщення тексту:
- цей тег означає початок нового абзацу,але його прийнято записувати в кінці попереднього.
Наступне речення починається з нового,вирівняного до лівого краю,абзацу без відступу.
-наступний за цим тегом текст буде наведено у новому рядку без пропуску рядка.
-буде проведена горизонтальна лінія.
Парні теги для форматування символів тексту:
- товстий шрифт тексту;
- шрифт-курсив;
- підкреслений шрифт;
- нижній індекс;
- верхній індекс;
- великий шрифт;
- малий шрифт;
- виокремлений курсивом текст.
-товстий курсив
Домашнє завдання:
Перегляньте цец файл за допомогою броузера і поекспериментуйте з тегами форматування тексту.
Проекспериментууйте з розмірами вікна, в якому демонструється документ і переконайтеся,
що броузер автоматично змінює розташування тексту, щоб його можна було переглядати без горизонтальної смуги прокручування.
--Ковалева Евгения 21:27, 23 октября 2008 (EEST)