Formularze w języku HTML

1. Cele lekcji

a) Wiadomości

Uczeń:

1. poznaje polecenia, które umożliwiają umieszczenie formularzy na stronach www;

2. umie wskazać zastosowania formularzy na stronach WWW – np. do wprowadzania danych lub ankietowania;

3. poznaje pola formularzy i różnice w ich zapisie na stronie;

4. poznaje właściwości listy wyboru formularza.

b) Umiejętności

Uczeń potrafi:

1. stosować polecenia i atrybuty formularza ;

2. umieszczać ankietę elektroniczną przy pomocy poleceń formularza;

3. modyfikować i rozbudowywać przykładowe formularze języka HTML.

2. Metoda i forma pracy

Wykład.

Prezentacja.

Praca w grupach przy komputerze.

Praca z kartą pracy ucznia.

3. Środki dydaktyczne

1. Prezentacja multimedialne: „Formularze w języku HTML”

2. Karta pracy ucznia: „Formularze w języku HTML”

4. Przebieg lekcji

a) Faza przygotowawcza

Odczytanie listy obecności, zalogowanie się uczniów do systemu Windows.

b) Faza realizacyjna

Nauczyciel rozpoczyna dyskusję:

1. Czy często spotykamy na stronach WWW ankiety lub formularze do wypełnienia?

Uczniowie podają przykłady: wprowadzanie danych w przypadku rejestrowania się do konta pocztowego, usług bankowych, innych usług oferowanych przez serwery stron www itp.

2. Jaki obiekt języka html pozwala na równomierne rozmieszczanie tekstów i rysunków na stronie www?

Uczniowie odpowiadają: takim obiektem jest tabela, realizowana poleceniem <table>,

Nauczyciel wyjaśnia, że obiektem umożliwiającym wprowadzanie danych na stronie www jest formularz, który wprowadza się za pomocą polecenia: <form> Dzięki formularzom można uzyskać informacje od osób odwiedzających strony.

Po zapoznaniu z tematyką zajęć, zapisanie tematu lekcji na tablicy.

Nauczyciel prezentuje oraz omawia pokaz multimedialny: „Formularze w języku HTML”, z poleceniem zanotowania uwag o tworzeniu formularza

Uczniowie oglądają pokaz.

Nauczyciel dyktuje kroki tworzenia formularza:

Notatka 1:

Elementy formularza są tworzone w pewnych ogólnych ramach, między nimi umieszczamy wszystkie pozostałe elementy. Ramy te tworzymy za pomocą polecenia:

<form>………..</form>

Nastepnie okreslamy akcję, która jest wykonywana przez komputer, gdy czytelnik strony zechce przesłać do autora jakieś informacje pocztą elektroniczną:

<form action=”mailto:autor_strony@jego_domena” method=”post”>

Uczniowie zapoznają się z różnymi polami, które umożliwiają wprowadzanie danych:

Notatka 2:

Formularz zawiera różnego typu pola, które są wypełniane informacjami.

Najważniejszym polem jest pole tekstowe INPUT, które służy o wprowadzania pól, które pozwolą czytelnikowi wpisać jakąś informację lub wybrać jedną z opcji.

Nauczyciel przedstawia zadanie – zasady rozwiązywania zadania z karty pracy ucznia.

Praca własna – wykonanie kolejnych poleceń zapisanych w karcie pracy „Formularze w języku HTML”.

c) Faza podsumowująca

Notatka 3

Formularze to jedne z najciekawszych elementów stron internetowych. Pozwalają one autorom stron uzyskiwać informację od czytelników, zaś tym ostatnim, na przykład, wypełniać ankiety czy zamawiać jakieś towary i usługi. Przykładem formularza może być strona z ankietą.

5. Bibliografia

strony www:

http://www.reporter.pl

http://webmaster.helion.pl/kurshtml/

6. Załączniki

a) Karta pracy ucznia

Formularze w języku HTML

b) Prezentacja

Formularze w języku HTML

c) Zadanie domowe

Zaplanuj test do sprawdzenia wiadomości o poleceniach formatowania tekstu w języku HTML (5 pytań).

Ustal typy pól dla wprowadzania odpowiedzi w formie formularza.