"HTML-де кестелер құру" тақырыбында ашық сабақ

ФИО педагога

Серкебаева АС

Дата

16.02

Класс 

Количество присутствующих:

отсутствующих:

Тема урока

Таблицы

Цели обучения, которые достигаются на данном уроке (ссылка на учебную программу)

10.4.2.1 использовать HTML (ашти эм эл)-теги при разработке web (веб)-страниц

Цель урока

- Демонстрирует умение создавать, сохранять и открывать собственную веб-страницу.

- Демонстрирует знание структуры веб-документа

- Использует теги для создания таблицы на вашей собственной веб-странице.

Ход  урока

Этапы урока

Деятельность учителя

Деятельность обучающихся

Оценивание

Ресурсы

Организационный этап

вопрос для учащихся:

• можете ли вы вспомнить, что мы обсуждали на нашем предыдущем уроке?

Учитель:

• я хочу представить сегодняшнюю тему
• как вы думаете, что это за сегодняшняя тема?

Изложение темы и целей урока.

"Мозговой штурм".

1. С помощью какого языка можно создать подобную Web-страницу? (язык разметки гипертекста HTML)
2. Что такое тег?
3. Какие бывают теги?
4. Что такое парный тег?
5. Что такое атрибут?
6. Какое должно быть имя главной страницы?
7. Как должны располагаться файлы проекта?
8. Какие программы нужны, чтобы создать weв-страницу?

Слайд "режим дня". Наводящие вопросы:

- важен ли для человека режим дня?

- Какое программное обеспечение я могу использовать для сохранения этих данных?

(Word, Excel)

- какова структура данных в Excel (табличная)

учитель должен подвести вопросы к теме "таблицы".

Преподаватель знакомит с синтаксисом

Ученики делятся на группы. Осмысливают поставленную цель.

Интерактивное обучение

Диалогическое обучение

Саморегулируемое обучение

Критическое мышление

Изучение нового материала

Таблица-это не что иное, как средство упорядочивания данных в строках и столбцах. Эта концепция присутствует в нашем обществе в течение длительного времени и была принята HTML на ранних стадиях, как способ передачи информации, которая в противном случае не была бы очевидной или легко понятной.

В HTML-документах таблица может быть рассмотрена простым способом как группа строк, содержащих каждую группу ячеек. Это концептуально отличается от группы столбцов, содержащих группу ячеек, и это различие будет иметь некоторое влияние на состав и поведение таблицы.

Как и многие другие структуры в HTML, таблицы строятся с использованием элементов. В частности, базовая таблица может быть объявлена с использованием трех элементов, а именно: table (основной контейнер), tr (представляющий строки, контейнеры для ячеек) и td (представляющий простые ячейки). Давайте проясним это на примере:

<table class="egt">

<tr>

<td>Cell 1</td>

<td>Cell 2</td>

<td>Cell 3</td>

</tr>

<tr>

<td>Cell 4</td>

<td>Cell 5</td>

<td>Cell 6</td>

</tr>

</table>

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

Ячейка заголовка - это особый тип ячейки, используемый для организации и классификации других ячеек таблицы. Сказав это, трудно представить себе таблицу, в которой ячейка заголовка не была бы полезной. Почти любая таблица может извлечь выгоду из хорошо размещенной группы ячеек заголовка.

В следующем примере мы строим таблицу для отображения информации о погоде в ближайшие дни. Здесь ячейки заголовка, представленные элементом th, помещаются в первую строку таблицы, поверх обычных ячеек.

<table class="egt">

<tr>

<th>Today</th>

<th>Tomorrow</th>

<th>Monday</th>

</tr>

<tr>

<td>Sunny</td>

<td>Mostly sunny</td>

<td>Partly cloudy</td>

</tr>

<tr>

<td>19°C</td>

<td>17°C</td>

<td>12°C</td>

</tr>

<tr>

<td>E 13 km/h</td>

<td>E 11 km/h</td>

<td>S 16 km/h</td>

</tr>

</table>

Создание таблицы

    Сама таблица в HTML создаётся тегами < TABLE>и < /TABLE>, строки таблицы (помещаются между тегами < TABLE> и < /TABLE>) тегами < TR>и < /TR>, а столбцы таблицы (помещаются между тегами < TR> и < /TR>) тегами < TD>и < /TD>.

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

< table>— начало таблицы
  < tr>— начало строки
    < td>Первая ячейка< /td>— первый столбец
    < td>Вторая ячейка< /td>— второй столбец
  < /tr>— конец строки
< /table>— конец таблицы

Работа в группе, создание постера

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

Создать таблицу

Как вы считаете, трудоемкий ли процесс написания HTML-кода?

практическая работа. индивидуально создайте таблицу “Расписание уроков”, используя теги для создания таблицы ..

Рекомендуемые дескрипторы:

1.  Используйте теги для создания таблицы.

2.  Используйте теги для заполнения таблицы

3.  Творчество

Работая в группах, ученики самостоятельно изучают новый материал.

Дети решают задание в парах

Словесная оценка учителя

. Взаимооценивание

Стратегия «Стикер

Критическое мышление.

Саморегулируемое обучение (самонаправленность в процессе работы над заданиями).

Рефлексия

Повторить формулы и определения по теме: «Погрешности»

В конце урока учащиеся проводят рефлексию:

- что узнал, чему научился

- что осталось непонятным

- над чем необходимо работать

Учащиеся подытоживают свои знания по изучаемой теме.