kopilkaurokov.ru - сайт для учителей

Создайте Ваш сайт учителя Курсы ПК и ППК Видеоуроки Олимпиады Вебинары для учителей

  1. Главная
  2. Информатика
  3. Уроки
  4. Основы языка HTML

Основы языка HTML

Нажмите, чтобы узнать подробности

Теориялы? саба? жоспары/ План теоретического урока

 

?ткізу уа?ыты/ Дата проведения: 08.12.2014 (2 подгруппа)

Курс:  первый 

Маманды? / Специальность:  Фермерское хозяйство (тракторист – машинист сельскохозяйственного производства)

П?н/Предмет:   информатика

М??алім/Преподаватель: Сапаева В.Н.

Та?ырып/Тема урока:  Основы языка HTML. Программирование в HTML

 

Ма?сат/ Цели урока:

Білімділік/ Образовательная:  познакомить студентов с   определением и основным назначением языка HTML, изучить  Web-страницы; отработать умение создавать и вносить изменения в созданную Web-страницу с помощью приложения Блокнот;

Дамытушылы?/ Развивающая: активизировать познавательную деятельность учащихся; развивать восприятие компьютера как инструмента информационной деятельности человека;

Т?рбиелік/ Воспитательная: воспитывать интерес к изучаемому предмету,  формировать эстетические качества студентов, самостоятельность

Саба?ты? типі/ Тип урока: изучение нового материала

Саба?ты? ?діс-т?сілдері/ Методы урока:  словестный, практический

??рал жабды?тар/Оснащение урока: презентация, интерактивная LED панель, компьютеры, карточки с практическим заданием

Межпредметные связи: английский язык

 

Саба? кезе?дері/ Этапы урока:

I кезе?. Мотивациялы- ма?сатты?/ Мотивационно-целевой: 

Оганизационный момент (приветствие, подготовка учащихся к уроку, заполнение журнала)

Сообщение темы и целей занятия. Создание эмоционального настроя учащихся на работу.

 

II кезе?. Танымды?/ Операционно - познавательный:

  1. Актуализация знаний. Применить прием технологии критического мышления  «До-После».  Студентам раздать карточки с таблицей

До (что я знаю или предполагаю по теме урока)

После (что я узнал на уроке)

 

 

Вывод

Студенты заполняют 1 столбец.

 

  1. Объяснение нового материала

- перед объяснением нового материала необходимо обратить внимание студентов на межпредметную связь данной темы с английским языком и выделить место в тетради для словаря, по ходу объяснения записывать в словарь термины с переводом

 - ознакомить студентов с основными понятиями HTML программирования, рассмотреть структуру построения HTML документа и его составляющие по презентации,

- определения, структуру документа HTML, основные теги записать в тетрадь

 

  1. Закрепление изученного материала

 - выполнение практического задания по карточкам

 

III кезе?. Рефлексия – ба?алау/ Рефлексивно-оценочный

Домашнее задание: _______

Рефлексия: студенты заполняют 2 столбец таблицы «До-После», анализируют и делают вывод.

Свои выводы по теме урока студенты озвучивают.

 

Подведение итогов и оценивание студентов за выполнение практического задания.


 


 

Вы уже знаете о суперспособностях современного учителя?
Тратить минимум сил на подготовку и проведение уроков.
Быстро и объективно проверять знания учащихся.
Сделать изучение нового материала максимально понятным.
Избавить себя от подбора заданий и их проверки после уроков.
Наладить дисциплину на своих уроках.
Получить возможность работать творчески.

Просмотр содержимого документа
«Практич работа»

Практическая работа

Откройте программу Блокнот и напечатайте текст как на рисунке.


Создадим Web-страницу, содержащую этот текст.

Для этого добавим следующие теги.


Сохраним файл под именем Группа№11.html


Откроем полученную Web-страницу с помощью браузера Internet Explorer.


Браузер Internet Explorer вывел наш текст без переходов на новую строку. Хотелось бы показать текст в исходном виде.

Для указания перехода на новую строку используется непарный тег BR. Данный тег ставится в месте перехода на новую строку.


Чтобы внести данный тег в текст HTML-файла нужно в Строке меню выбрать

Вид→Просмотр HTML-кода

После внесения изменений HTML-файл будет выглядеть следующим образом:










Сохраняем файл с внесёнными изменениями


Закрываем полученный документ.

Снова открываем наш Web-сайт.

Чтобы увидеть внесённые изменения, страницу нужно обновить.

I способ В Строке меню выбрать Вид→Обновить

II способ Нажав правой кнопкой мыши, вызвать Контекстное меню и выбрать команду Обновить

Теперь наша Web-страница выглядит лучше


Добавим на страницу цветной фон. Для этого в теге body допишем атрибут bgcolor с указанием цвета. Например:


Не забудьте сохранить файл и обновить страницу.


Сделаем текст цветным. Для этого в теге body допишем атрибут text с указанием цвета. Например: body text=blue




Наша Web-страница преобразилась



Сделаем название колледжа крупнее.

Для этого воспользуемся парным тегом big big


Не забудьте сохранить файл и обновить страницу



Для рационального размещения и удобства чтения текст на Web-странице помещается в контейнер тегов абзаца.


pТекст абзацаp


Абзацы на Web-странице отделяются пустой строкой, что способствует улучшению восприятия при чтении текста.

Для выравнивания текста абзаца в тег p можно добавить параметры выравнивания


p align=…Текст абзацаp


где значением атрибута align могут быть


center - выравнивание по центру,

left - выравнивание по левому краю, (задается по умолчанию),

right - выравнивание по правому краю,

justify - выравнивание по ширине.


Выделим первую строку нашего текста в отдельный абзац и установим её по центру.


Не забудьте сохранить файл и обновить страницу



Для размещения на Web-странице заголовков и подзаголовков используется тег


h… Текст заголовка h…,

где вместо многоточия ставится номер уровня заголовка в порядке убывания от 1 до 6. Выравнивание заголовков производится с помощью уже известного атрибута align.

Для строки Специальность применим заголовок h3 с выравниванием по правому краю, а для строки Квалификация применим заголовок h4 с выравниванием по левому краю.


Не забудьте сохранить файл и обновить страницу



Для задания параметров текста используется тег font, имеющий несколько атрибутов:


Текст


Параметры атрибутов:

face - задает шрифт, которым будет напечатан текст, рекомендуется использовать стандартные шрифты, т.к. других может просто не быть в компьютере, на котором пользователь будет просматривать данную Web-страницу, например,


… или …


size - значение от 7 до 1 в порядке убывания, размер шрифта, по умолчанию размер шрифта равен 4, например, font size=7…font или font size=-2…font

Размер шрифта +2 (-2) означает, что размер шрифта требуется увеличить (уменьшить) на 2 условных единицы относительно текущего размера. Этот способ удобно применять, когда необходимо выделить небольшой фрагмент текста и вернуться к исходному размеру шрифта.


color - выделение текста некоторым цветом.


… или …


Установим для второй строки шрифт Arial, размер шрифта-5, цвет шрифта поменяем на коричневый – brown.



Сохраняем файл и обновляем страницу.


Так же можно использовать средства выделения текста (жирность, курсив, подчеркивание и их комбинации).


… - жирный (bold);


… - курсив (italic);


u…u - подчеркивание (underline).


Комбинация: biuЖирный курсив с подчеркиваниемuib.


Примените эту комбинация к строке Фамилия Имя Отчество

Просмотр содержимого документа
«план урока НТМL програм»





Теориялық сабақ жоспары/ План теоретического урока


Өткізу уақыты/ Дата проведения: 08.12.2014 (2 подгруппа)

Курс: первый

Мамандық / Специальность: Фермерское хозяйство (тракторист – машинист сельскохозяйственного производства)

Пән/Предмет: информатика

Мұғалім/Преподаватель: Сапаева В.Н.

Тақырып/Тема урока: Основы языка HTML. Программирование в HTML


Мақсат/ Цели урока:

Білімділік/ Образовательная: познакомить студентов с определением и основным назначением языка HTML, изучить Web-страницы; отработать умение создавать и вносить изменения в созданную Web-страницу с помощью приложения Блокнот;

Дамытушылық/ Развивающая: активизировать познавательную деятельность учащихся; развивать восприятие компьютера как инструмента информационной деятельности человека;

Тәрбиелік/ Воспитательная: воспитывать интерес к изучаемому предмету, формировать эстетические качества студентов, самостоятельность

Сабақтың типі/ Тип урока: изучение нового материала

Сабақтың әдіс-тәсілдері/ Методы урока: словестный, практический

Құрал жабдықтар/Оснащение урока: презентация, интерактивная LED панель, компьютеры, карточки с практическим заданием

Межпредметные связи: английский язык


Сабақ кезеңдері/ Этапы урока:

I кезең. Мотивациялы- мақсаттық/ Мотивационно-целевой:

Оганизационный момент (приветствие, подготовка учащихся к уроку, заполнение журнала)

Сообщение темы и целей занятия. Создание эмоционального настроя учащихся на работу.


II кезең. Танымдық/ Операционно - познавательный:

  1. Актуализация знаний. Применить прием технологии критического мышления «До-После». Студентам раздать карточки с таблицей

До (что я знаю или предполагаю по теме урока)

После (что я узнал на уроке)



Вывод

Студенты заполняют 1 столбец.


  1. Объяснение нового материала

- перед объяснением нового материала необходимо обратить внимание студентов на межпредметную связь данной темы с английским языком и выделить место в тетради для словаря, по ходу объяснения записывать в словарь термины с переводом

- ознакомить студентов с основными понятиями HTML программирования, рассмотреть структуру построения HTML документа и его составляющие по презентации,

- определения, структуру документа HTML, основные теги записать в тетрадь


  1. Закрепление изученного материала

- выполнение практического задания по карточкам


III кезең. Рефлексия – бағалау/ Рефлексивно-оценочный

Домашнее задание: _______

Рефлексия: студенты заполняют 2 столбец таблицы «До-После», анализируют и делают вывод.

Свои выводы по теме урока студенты озвучивают.


Подведение итогов и оценивание студентов за выполнение практического задания.



























































ФИО________________________________________________________ Группа______________


До (что я знаю или предполагаю по теме урока)

После (что я узнал на уроке)






Вывод



ФИО________________________________________________________ Группа______________


До (что я знаю или предполагаю по теме урока)

После (что я узнал на уроке)






Вывод


ФИО________________________________________________________ Группа______________


До (что я знаю или предполагаю по теме урока)

После (что я узнал на уроке)






Вывод


ФИО________________________________________________________ Группа______________


До (что я знаю или предполагаю по теме урока)

После (что я узнал на уроке)






Вывод


ФИО________________________________________________________ Группа______________


До (что я знаю или предполагаю по теме урока)

После (что я узнал на уроке)






Вывод




Получите в подарок сайт учителя

Основы алгоритмизации и...

Информатика 7 класс (Россия)

Информатика 5 класс (Россия)

Информатика 11 класс (Беларусь)

Электронная тетрадь по информатике 6...

Информатика 7 класс ФГОС

Электронная тетрадь по информатике 8...

Информатика 3 класс

Предмет: Информатика

Категория: Уроки

Целевая аудитория: 11 класс

Скачать
Основы языка HTML

Автор: Сапаева Вера Николаевна

Дата: 14.01.2015

Номер свидетельства: 154908

Похожие файлы

object(ArrayObject)#863 (1) {
  ["storage":"ArrayObject":private] => array(6) {
    ["title"] => string(64) "«Web – технологии.  Основы языка HTML »"
    ["seo_title"] => string(36) "web-tiekhnologhii-osnovy-iazyka-html"
    ["file_id"] => string(6) "277094"
    ["category_seo"] => string(11) "informatika"
    ["subcategory_seo"] => string(11) "presentacii"
    ["date"] => string(10) "1452842157"
  }
}

object(ArrayObject)#885 (1) {
  ["storage":"ArrayObject":private] => array(6) {
    ["title"] => string(47) "Повторение основ языка HTML"
    ["seo_title"] => string(30) "povtorieniie_osnov_iazyka_html"
    ["file_id"] => string(6) "374681"
    ["category_seo"] => string(11) "informatika"
    ["subcategory_seo"] => string(5) "uroki"
    ["date"] => string(10) "1483097214"
  }
}

object(ArrayObject)#863 (1) {
  ["storage":"ArrayObject":private] => array(6) {
    ["title"] => string(83) "Основы языка разметки гипертекста HTML. Списки."
    ["seo_title"] => string(46) "osnovy_iazyka_razmetki_giperteksta_html_spiski"
    ["file_id"] => string(6) "529959"
    ["category_seo"] => string(11) "informatika"
    ["subcategory_seo"] => string(5) "uroki"
    ["date"] => string(10) "1575364182"
  }
}

object(ArrayObject)#885 (1) {
  ["storage":"ArrayObject":private] => array(6) {
    ["title"] => string(70) "Язык HTML. История развития, возможности"
    ["seo_title"] => string(44) "iazyk_html_istoriia_razvitiia_vozmozhnosti_1"
    ["file_id"] => string(6) "607064"
    ["category_seo"] => string(11) "informatika"
    ["subcategory_seo"] => string(7) "prochee"
    ["date"] => string(10) "1652725476"
  }
}

object(ArrayObject)#863 (1) {
  ["storage":"ArrayObject":private] => array(6) {
    ["title"] => string(68) "Практикум по Web-программированию (HTML) "
    ["seo_title"] => string(40) "praktikum-po-web-proghrammirovaniiu-html"
    ["file_id"] => string(6) "124855"
    ["category_seo"] => string(11) "informatika"
    ["subcategory_seo"] => string(5) "uroki"
    ["date"] => string(10) "1414823799"
  }
}

Полезное для учителя




Распродажа видеоуроков!
1780 руб.
2220 руб.
Смотреть все комплекты
Курсы ПК и ППК для учителей!
Смотреть все курсы
ПОЛУЧИТЕ СВИДЕТЕЛЬСТВО МГНОВЕННО

Добавить свою работу

* Свидетельство о публикации выдается БЕСПЛАТНО, СРАЗУ же после добавления Вами Вашей работы на сайт

Удобный поиск материалов для учителей

Ваш личный кабинет

Восстановить пароль
Регистрация
Проверка свидетельства