Budowa strony HTML
- Praktyczne zadania
- Teoria
- Pomoce do ćwiczeń
HTML (ang. HyperText Markup Language) to podstawowy język znaczników używany do tworzenia stron internetowych. Nie jest językiem programowania, lecz językiem opisowym, który określa strukturę i zawartość strony, a następnie jest interpretowany przez przeglądarki internetowe.
<>
ostre nawiasy są niezbędne do oznaczania znaczników (tagów) w HTML obowiązkowo używamy <tag> i </tag>.
<!DOCTYPE html>
To jest deklaracja typu dokumentu. Informuje przeglądarkę, że ma interpretować dokument zgodnie z zasadami HTML5.
Nie jest to znacznik, dlatego nie ma zamykającego </…>
<html lang=”pl”>
Główny znacznik otwierający całą stronę.
<html> – początek dokumentu HTML, wszystko musi znajdować się w nim.
lang=”pl” – atrybut określający język zawartości strony (w tym przypadku polski). Dzięki temu przeglądarki i czytniki ekranowe lepiej rozumieją treść.
<head>
Początek sekcji head.
<meta charset=”UTF-8″>
Tutaj znajdują się informacje o stronie (tzw. meta-informacje), których użytkownik nie widzi bezpośrednio na stronie.
Ustawia kodowanie znaków na UTF-8, czyli uniwersalne kodowanie pozwalające poprawnie wyświetlać polskie litery (ą, ę, ł, ś itd.).
<title>Moja pierwsza strona</title>
Tytuł strony widoczny w karcie przeglądarki i np. w wynikach wyszukiwania Google.
Tutaj tytuł to „Moja pierwsza strona”.
</head>
Zamyka sekcję head wszystko co znajduje się w sekcji head nie jest widoczne na stronie internetowej
<body>
Początek sekcji body – czyli tej części dokumentu, którą widzi użytkownik w przeglądarce.
<h1>Witaj w HTML!</h1>
Nagłówek najwyższego poziomu (h1).
Używamy go zwykle dla najważniejszego tytułu strony.
<p>To jest przykładowy akapit tekstu.</p>
Akapit tekstu.
Znacznik <p> oznacza paragraf, a przeglądarka domyślnie dodaje odstęp nad i pod tekstem.
<a href=”https://example.com”>Przejdź do strony</a>
Link (anchor).
<a> – znacznik linku,
href=”https://example.com” – atrybut określający adres, do którego prowadzi link,
Tekst między znacznikami („Przejdź do strony”) to treść klikalna.
</body>
Zamyka część body.
</html>
Zamyka cały dokument HTML.
Polecenie:
Przepisz kod do notatnika, zapisz go jako index.html
Zamiast strony example.com wpisz dowolnie wybraną stronę internetową
