Nauczyciel: Magdalena Rajewska Przedmiot: Informatyka
Klasa: 1TAP
Temat lekcji: Tworzenie stron internetowych cz.1.
Data lekcji: 23.04.2020 Wprowadzenie do tematu:
Celem zajęć jest zapoznanie się z podstawowymi znacznikami HTML.
1. Język HTML (ang. Hypertext Markup Language) nie jest językiem programowania, jest językiem znaczników nazywanych również tagami. Przy użyciu znaczników opisujemy strukturę strony oraz jej elementy.
Znaczniki umieszczamy w nawiasach trójkątnych. Jeżeli znacznik zostaje otwarty, w tym przypadku znacznik <HTML> należy pamiętać, że musi on zostać zamknięty. Znacznik zamykamy następująco
</HTML>. Są znaczniki, dla których ta reguła nie występuje.
2. Strona internetowa to plik tekstowy, w którym przy użyciu znaczników opisujemy wygląd strony oraz jej elementy. Zatem do tworzenia stron wykorzystamy darmowy program Notepad++ lub Notatnik. Program Notepad++ koloruje składnię – dokument edytowany w nim jest czytelniejszy. Plik strony internetowej powinien mieć rozszerzenie .html lub .htm. Zazwyczaj plik strony nazywamy index.html.
Zapisywanie pliku w Notepad++
3. Struktura strony WWW.
Przykład 1
Struktura strony składa się z dwóch części.
a) HEAD – jest to nagłówek strony.
W nagłówku umieszczamy między innymi następujące znaczniki:
<meta> - pozwala umieścić dodatkowe informacje o stronie m.in.
- Charset - zestaw znaków który wykorzystuje strona internetowa. Obecnie najpopularniejszy jest UTF-8,
- Author - imię i nazwisko autora strony.
<title> - ustawia tytuł strony, który jest wyświetlany na karcie przeglądarki.
Przykład 2
Aby zobaczyć wynik należy plik index.html otworzyć w dowolnej przeglądarce.
Wynik działania.
b) BODY – zawiera całą zawartość, która będzie wyświetlana w przeglądarce m.in. tekst, obrazki, ścieżki dźwiękowe itd.
4. Podstawowe znaczniki.
4.1. Nagłówki.
W HTML mamy 6 poziomów nagłówków od <h1> do <h6>.
Przykład
4.2. Paragrafy.
Znacznik paragrafu <p> służy do formatowania tekstu. Wykorzystuje się go do wprowadzania zwykłej treści.
Przykład
Wynik działania
Instrukcje do pracy własnej:
1. Należy zapoznać się z dostarczonymi materiałami.
2. Należy na dysku C:\ utworzyć folder Strona_WWW.
3. W folderze Strona_WWW należy utworzyć plik o nazwie index.html.
4. Pliku index.html należy wypełnić zgodnie z przykładem 2.
5. Plik index.html należy otworzyć w dowolnej przeglądarce i sprawdzić efekt działania.
6. W pliku index.html przy użyciu znaczników nagłówków od <h1> do <h6> należy zapisać swoje Imię.
7. Plik index.html należy otworzyć w przeglądarce i sprawdzić efekt działania.
8. W pliku index.html przy użyciu znacznika paragrafu <p> należy zapisać klasę do której chodzisz.
Ponieważ będziesz przygotowywać swój projekt strony internetowej zastanów się nad tematyką strony.
Kolejne lekcje będą kontynuacją tworzenia stron internetowych.
Informacja zwrotna:
Termin realizacji zadań: 30.04.2020
Praca zdalna:
W przypadku problemów, pytań, wątpliwości proszę o kontakt mail’owy na adres magrajzs9@gmail.com.
Zachęcam wszystkich do zdalnej komunikacji poprzez komunikator Hangouts w terminach:
Dzień tygodnia Godziny Komunikator Hangouts
Środa 7-45 – 12.50 magrajzs9@gmail.com
Środa 14.40 – 17.05 magrajzs9@gmail.com
