HTML (HyperText Markup Language) to język znaczników, którym opisujesz strukturę i treść strony internetowej. Nie jest to język programowania w klasycznym sensie — nie ma w nim pętli, zmiennych ani warunków. Zamiast tego za pomocą znaczników (tagów) mówisz przeglądarce: „to jest nagłówek”, „to akapit”, „tutaj wstaw obrazek”, „to jest odnośnik”. Przeglądarka czyta ten kod i renderuje go jako stronę, którą widzi użytkownik.
Jak to działa
Dokument HTML to drzewo zagnieżdżonych elementów. Każdy element zwykle ma znacznik otwierający i zamykający, a między nimi treść — na przykład To jest akapit. Elementy mogą mieć atrybuty, które niosą dodatkowe informacje, jak link, gdzie href wskazuje adres docelowy. Przeglądarka parsuje cały plik i buduje z niego DOM (Document Object Model) — strukturę, do której później dobierają się CSS (wygląd) i JavaScript (zachowanie).
Warto zapamiętać podział ról: HTML to szkielet i treść, CSS to ubranie, a JavaScript to mięśnie. Sam HTML w zupełności wystarczy, żeby strona istniała i była czytelna — pozostałe dwa to dodatki.
Przykład z praktyki
Minimalny, poprawny dokument wygląda tak:
— deklaracja, że to nowoczesny HTML.— korzeń dokumentu z językiem strony.— metadane: tytuł, kodowanie, linki do CSS.— to, co realnie widać: nagłówki, akapity, obrazy, listy.
W codziennej pracy rzadko piszesz to ręcznie od zera. Otwierasz plik index.html w VS Code, wpisujesz ! i wciskasz Tab — Emmet wygeneruje Ci cały szkielet w sekundę. Potem podglądasz efekt np. przez rozszerzenie Live Server, które przeładowuje stronę po każdym zapisie.
Częste błędy i mity
- „HTML to programowanie” — nie, to język znaczników. Możesz się tym chwalić, ale rekruter techniczny uniesie brew.
- Niezamknięte znaczniki — zapomniany
, czy pomagają dostępności (screen readery) i SEO bardziej niż dziesięć zagnieżdżonych .„Czekam na HTML6″ — nie doczekasz się. Od HTML5 nie ma numerowanych wersji. HTML jest dziś living standardem rozwijanym na bieżąco przez WHATWG. Pojęcia powiązane
Z HTML łączą się bezpośrednio CSS i JavaScript, DOM, semantyka i dostępność (WCAG, ARIA), a także SEO oraz formaty pokrewne jak XHTML i SVG. Jeśli dopiero zaczynasz front-end, to właśnie HTML jest pierwszym klockiem, na którym stawiasz resztę.