Budowa znacznika HTML
Znaczniki HTML składają się ze specjalnego tekstu umieszczonego między nawiasami ostrymi (" < " i " > "). W języku HTML występują znaczniki pojedyncze i podwójne składające się ze znacznika otwierającego i zamykającego. Znaczniki zamykające umieszczane są zawsze po znaczniku otwierającym i zawierają dodatkowo znak "/" zaraz po znaku mniejszości (" < ") na przykład < strong > i < /strong >. Znaczniki pojedyncze we wcześniejszych wersjach HTML musiały posiadać przez znakiem większości znak "/". W HTML5 nie jest on konieczny, ale jego obecność nie powoduje błędów. Wielkość liter nie ma znaczenia w przypadku nazwy znacznika, ale dobrą praktyką jest stosowanie małych liter.
Znacznik HTML (pojedynczy i otwierający) mogą zawierać dodatkowe dane zwane atrybutami. Atrybuty składają się z nazwy oraz wartości umieszczonej po znaku równa się w cudzysłowie.
Za pomocą znaczników jesteśmy w stanie dodać do kodu dokumentu HTML metadane, wstawić obrazek, umieścić tekst w paragrafach lub oznaczyć go jako nagłówek, pogrubić tekst czy też wstawić fragment innej strony.
Podział znaczników
Znaczniki obecne w kodzie HTML możemy podzielić na kilka sposobów:
- na występujące w sekcji < head > i < body >,
- na semantyczne i niesemantyczne,
- na liniowe i blokowe,
- pojedyncze i podwójne.
Podstawowe znaczniki HTML
Poniżej lista podstawowych znaczników dokumentu HTML:
- < !doctype html > - określa z jakim typem dokumentów mamy do czynienia. Jest to jeden z dwóch znaczników, który po znaku mniejszości ma wykrzyknik,
- < html > ... < /html > - między tym znacznikiem umieszczana jest cała treść dokumentu,
- < head > ... < /head > - zawiera podstawowe informacje o dokumencie, takie jak tytuł, opis, linki do arkuszy stylów i skryptów,
- < title > ... < /title > - tytuł strony, który pojawia się na pasku przeglądarki oraz w wynikach wyszukiwania. Uznawany za jeden z czynników rankingowych.
- < meta ... > - znacznik opisujący szczegółowo opisujący zawartość strony. W zależności od użytych argumentów może on zawierać opis strony (description - widoczne pod tytułem w wynikach wyszukiwania), słowa kluczowe (keywords - meta tag uznany za przestarzały, z którego największe wyszukiwarki już nie korzystają), kodowanie dokumentu czy autora strony.
- < link ... > - element określający relację między dokumentem a zewnętrznym zasobem.
- < style > ... < /style > - wewnętrzny arkusz stylów.
- < script > ... < /script > - umożliwia umieszczenie skryptu w kodzie HTML.
- < body > ... < /body > - znacznik zawierający główną treść dokumentu.
- < div > ... < /div > - blok wykorzystywany do budowy szkieletu dokumentu.
- < hx > ... < /hx > - nagłówek określonego przez x stopnia (od 1 do 6).
- < p > ... < /p > - paragraf tekstu.
- < img ... > - element graficzny.
- < a > ... < /a > - odnośnik, link do innej witryny lub zasobu, wewnętrzny lub zewnętrzny.
- < ul > ... < /ul > - lista nieuporządkowana.
- < ol > ... < /ol > - lista uporządkowana.
- < li > ... < /li > - element listy.
- < table > ... < /table > - tabela.
- < tr > ... < /tr > - wiersz w tabeli.
- < td > ... < /td > - komórka, będąca elementem wiersza.
- < th > ... < /th > - komórka będąca nagłówkiem dla kolumny.
- < form > ... < /form > - formularz. Wewnątrz tych znaczników umieszcza się elementy takie jak pola tekstowe, etykiety, checkboxy, pola wyboru, przyciski.
- < strong >...< /strong > - znacznik semantyczny informujący o ważności tekstu.
- < em > ... < /em > - znacznik semantyczny, wyróżnienie tekstu definiujące emfazę.
- < span >...< /span > - znacznik liniowy używany głównie do stylowania fragmentu tekstu.
- < !-- ... -- > - komentarz, niewidoczny dla użytkownika tekst
Ostatnia aktualizacja: 12 czerwca 2024

Pozyskuj klientów online i zwiększaj zyski dzięki reklamie w Internecie!
Powiązane Artykuły

Ile kosztuje strona internetowa?
Ponoć jeśli Cię nie ma w Internecie, to nie istniejesz... Ten slogan niesie za sobą sporo prawdy. Dziś, w sieci robimy zakupy, umawiamy wizytę u fryzjera, edukujemy...
Przeczytaj artykuł >>
Tworzenie i optymalizacja szablonu strony internetowej - Jak lepiej zrozumieć Google PageSpeed Insight
Tworząc stronę lub sklep internetowy dla Twojej lub innej firmy zastanawiałeś się zapewne co wpłynie na jej szybkość. Prawdopodobnie nie są Ci obce rozmyślania nad...
Przeczytaj artykuł >>