⏱️ Czas czytania: 5 min
HTML (ang. Hypertext Markup Language) to podstawowy język znaczników używany do tworzenia i strukturyzowania treści na stronach internetowych. HTML pozwala na definiowanie różnych elementów strony, takich jak tekst, obrazy, linki, formularze, tabele i inne multimedia, które są następnie interpretowane przez przeglądarki internetowe i wyświetlane użytkownikom.
Kluczowe elementy HTML
- Znaczniki (tags):
- HTML składa się z elementów, które są definiowane za pomocą znaczników. Każdy znacznik HTML jest otoczony nawiasami ostrymi
< >i zazwyczaj występuje w parach: znacznik otwierający i zamykający. Na przykład,<p>otwiera akapit, a</p>go zamyka.
- HTML składa się z elementów, które są definiowane za pomocą znaczników. Każdy znacznik HTML jest otoczony nawiasami ostrymi
- Struktura dokumentu HTML:
- Typowy dokument HTML zaczyna się od deklaracji
<!DOCTYPE html>, która informuje przeglądarkę, że dokument używa HTML5, najnowszej wersji HTML. Dokument HTML jest następnie podzielony na dwie główne sekcje:<head>: Zawiera metadane o stronie, takie jak tytuł (<title>), linki do zewnętrznych plików CSS lub skryptów JavaScript, oraz inne informacje, które nie są wyświetlane bezpośrednio na stronie.<body>: Zawiera właściwą treść strony, czyli tekst, obrazy, linki, tabele, listy, formularze i inne elementy, które są widoczne dla użytkownika.
- Typowy dokument HTML zaczyna się od deklaracji
- Elementy blokowe i liniowe:
- Elementy blokowe: To elementy, które zajmują całą szerokość dostępnego miejsca i rozpoczynają się od nowej linii. Przykłady elementów blokowych to
<div>,<p>,<h1>–<h6>,<ul>,<ol>,<table>. - Elementy liniowe (inline): To elementy, które zajmują tylko tyle miejsca, ile jest potrzebne i nie zaczynają się od nowej linii. Przykłady elementów liniowych to
<a>,<span>,<img>,<strong>,<em>.
- Elementy blokowe: To elementy, które zajmują całą szerokość dostępnego miejsca i rozpoczynają się od nowej linii. Przykłady elementów blokowych to
- Atrybuty:
- Znaczniki HTML mogą mieć atrybuty, które dostarczają dodatkowych informacji o elemencie. Atrybuty są dodawane w obrębie znacznika otwierającego i mają postać pary nazwa-wartość, np.
<img src="image.jpg" alt="Opis obrazu">, gdziesrcokreśla ścieżkę do obrazu, aaltdostarcza alternatywnego tekstu.
- Znaczniki HTML mogą mieć atrybuty, które dostarczają dodatkowych informacji o elemencie. Atrybuty są dodawane w obrębie znacznika otwierającego i mają postać pary nazwa-wartość, np.
- Linki i hiperłącza:
- HTML umożliwia tworzenie hiperłączy, które łączą różne strony lub zasoby. Linki są tworzone za pomocą znacznika
<a>, np.<a href="https://www.example.com">Kliknij tutaj</a>, gdziehrefokreśla docelowy adres URL.
- HTML umożliwia tworzenie hiperłączy, które łączą różne strony lub zasoby. Linki są tworzone za pomocą znacznika
- Formularze:
- HTML obsługuje tworzenie formularzy, które umożliwiają interakcję użytkowników ze stroną, np. wprowadzanie danych, przesyłanie plików lub wybieranie opcji. Formularze są tworzone za pomocą znacznika
<form>, a pola formularza to m.in.<input>,<textarea>,<select>,<button>.
- HTML obsługuje tworzenie formularzy, które umożliwiają interakcję użytkowników ze stroną, np. wprowadzanie danych, przesyłanie plików lub wybieranie opcji. Formularze są tworzone za pomocą znacznika
- Multimedia:
- HTML pozwala na osadzanie multimediów, takich jak obrazy (
<img>), filmy (<video>), dźwięk (<audio>), a także osadzanie zawartości z innych stron za pomocą<iframe>.
- HTML pozwala na osadzanie multimediów, takich jak obrazy (
Zastosowania HTML
- Tworzenie stron internetowych: HTML jest fundamentem każdej strony internetowej, umożliwiając tworzenie zarówno prostych, jak i złożonych stron internetowych.
- Strukturyzacja treści: HTML pozwala na logiczne strukturyzowanie treści, co ułatwia jej prezentację i przyswajanie przez użytkowników oraz indeksowanie przez wyszukiwarki.
- Interakcja użytkownika: Dzięki elementom formularzy i linkom HTML umożliwia interakcję użytkownika ze stroną, taką jak wprowadzanie danych, nawigacja i przechodzenie między stronami.
Zalety HTML
- Prostota i dostępność: HTML jest stosunkowo prosty do nauczenia i użycia, co czyni go dostępnym dla szerokiego grona użytkowników, od początkujących po zaawansowanych programistów.
- Wszechstronność: HTML jest wszechstronny i może być używany w połączeniu z innymi technologiami, takimi jak CSS i JavaScript, do tworzenia zaawansowanych i interaktywnych stron internetowych.
- Standardowość: HTML jest standardem sieciowym, co oznacza, że jest wspierany przez wszystkie nowoczesne przeglądarki i urządzenia.
Wady HTML
- Ograniczenia w prezentacji: Sam HTML nie oferuje zaawansowanych narzędzi do stylizacji i formatowania strony. Do tworzenia estetycznych i responsywnych projektów konieczne jest użycie CSS.
- Brak logiki programistycznej: HTML nie jest językiem programowania, więc nie umożliwia implementacji logiki, która jest potrzebna do dynamicznych interakcji na stronie. W tym celu używa się języków skryptowych, takich jak JavaScript.
- SEO i dostępność: Niewłaściwe użycie znaczników HTML może negatywnie wpłynąć na dostępność strony dla użytkowników z niepełnosprawnościami oraz na wyniki strony w wyszukiwarkach.
HTML jest podstawowym narzędziem w tworzeniu stron internetowych i stanowi fundament dla wszystkich treści dostępnych w sieci. Dzięki HTML można tworzyć strony, które są zrozumiałe zarówno dla ludzi, jak i dla przeglądarek, a także łatwe do zintegrowania z innymi technologiami internetowymi.
