Aby zakomentować kod w HTML, należy użyć specjalnej składni komentarza HTML, która umożliwia wstawianie notatek, opisów czy tymczasowe wyłączanie fragmentów kodu. Komentarze w HTML są ignorowane przez przeglądarki i nie są wyświetlane użytkownikom odwiedzającym stronę.
Składnia komentarza w HTML
Komentarz w HTML otwiera się za pomocą sekwencji <!-- i kończy za pomocą -->.
<!-- To jest komentarz w HTML -->
Wszystko, co znajduje się pomiędzy tymi znacznikami, zostanie pominięte podczas wyświetlania strony.
Komentarz jednoliniowy
<!-- Tutaj znajduje się komentarz --> <p>Ten element będzie widoczny na stronie.</p>
Komentarz wieloliniowy
Komentarze mogą obejmować także wiele linii:
<!-- To jest przykład komentarza wieloliniowego. Może on zawierać krótką dokumentację lub fragmenty wyłączonego kodu. -->
Przykłady zastosowań komentarzy w HTML
Komentarze mają szerokie zastosowanie w pracy nad stroną internetową –
- Wyjaśnienie struktury kodu – np. podział sekcji na nagłówki, treść, stopkę;
- Tymczasowe wyłączanie fragmentów kodu – podczas testowania lub prac programistycznych;
- Dodawanie informacji lub ostrzeżeń dla innych programistów – pracujących nad tym samym kodem;
- Oznaczanie początku i końca fragmentów pliku –.
<!-- Początek nagłówka strony --> <header> <h1>Mój blog</h1> </header> <!-- Koniec nagłówka strony -->
<!-- <nav> <ul> <li><a href="#">Start</a></li> <li><a href="#">Kontakt</a></li> </ul> </nav> -->
<!-- UWAGA: Poniższy artykuł wymaga aktualizacji sekcji -> <article> <h2>Stara treść</h2> </article>
<!-- Początek treści głównej --> <main> <p>Witamy na stronie!</p> </main> <!-- Koniec treści głównej -->
Najważniejsze zasady i dobre praktyki
- Komentarze nie pojawiają się na stronie – widoczne są tylko w kodzie źródłowym (np. po użyciu opcji „Pokaż źródło strony”);
- Nie należy umieszczać w komentarzach danych poufnych – (np. haseł), ponieważ każdy może podejrzeć kod źródłowy;
- Unikaj nadmiernej liczby komentarzy – zwłaszcza w projektach, w których istotna jest minimalna waga pliku – same komentarze zwiększają rozmiar kodu;
- Komentarze mogą zawierać polskie znaki, znaki specjalne i wiele linii tekstu;
- W przypadku większych projektów warto przyjąć spójny styl komentowania – np. oznaczanie każdej sekcji rozpoczynającej się w kodzie:
<!-- START: sekcja ofertowa --> <!-- END: sekcja ofertowa -->
Czego nie robić w komentarzach HTML
- Unikaj umieszczania znaku
--– (dwa myślniki obok siebie) wewnątrz komentarza – to może prowadzić do problemów w renderowaniu kodu; - Nie komentuj całych plików – zwłaszcza gdy są to pliki produkcyjne, aby niepotrzebnie nie powiększać ich objętości;
- Unikaj powielonych, nieprzydatnych lub nieaktualnych komentarzy – które mogą wprowadzać w błąd innych programistów.
Przykład praktyczny
<!DOCTYPE html> <html lang="pl"> <head> <meta charset="UTF-8"> <title>Przykład użycia komentarzy</title> <!-- Tutaj możesz dodać pliki CSS --> </head> <body> <!-- Sekcja nagłówka --> <header> <h1>Moja przykładowa strona</h1> </header> <!-- Sekcja główna --> <main> <p>To jest główny tekst strony.</p> <!-- <p>Ta linia jest tymczasowo wyłączona.</p> --> </main> <!-- Sekcja stopki --> <footer> <p>Wszelkie prawa zastrzeżone © 2025</p> </footer> </body> </html>
Komentarze w HTML to uniwersalne narzędzie ułatwiające zarządzanie kodem, współpracę z innymi osobami oraz testowanie i rozwijanie projektów webowych. Warto stosować je świadomie, dbając o przejrzystość i czytelność kodu oraz bezpieczeństwo informacji.