Tagi HTML i struktura

  • Post category:HTML

Tagi HTML i struktura

Głównym elementem kodu HTML jest TAG ( znacznik). Jest to specjalne słowo kluczowe umieszczone wewnątrz ostrych nawiasów. Budowa tagu wygląda tak:

<tag_name>treść</tag_name>

Nazwa zawarta pomiędzy ostrymi nawiasami określa typ tagu.  Tagi to kod HTML, a teksty między nimi to treść. Tagi okalają te teksty, co pozwala określić strukturę dokumentu HTML. Dzięki niemu możesz np. ustalić kolor tła, rodzaj formatowania tekstu, wstawić obrazek itd. Znacznik nie jest widoczny na ekranie. Widoczne są tylko efekty jego działania.

Cechy tagów

  • Tagi HTML najczęściej występują w parach np. <p> i </p> (tagi paragrafu).
  • Pierwszy tag w parze to tag otwierający, drugi jest tagiem zamykającym.
  • Tag zamykający jest zapisany podobnie jak otwierający, ale dodaje się znak / przed jego nazwą.
  • Są też tagi niewymagające zamykającego taga (a nawet nie należy go wstawiać), takie jak <br> (złamanie linii czyli enter).

Struktura dokumentu HTML i przykładowe tagi

Każdy dokument HTML ma ściśle określoną strukturę podstawową. Struktura, czyli kod początkowy, który w zasadzie powtarza się w każdym pliku HTML. Dopiero w ramach tej struktury dodajemy swoją treść i inne tagi. Struktura wygląda tak:

 

 

Deklaracja Doctype – Linijka, która określa z jakim typem dokumentu mamy do czynienia.

Treść pomiędzy <html> i </html> to nasz dokument HTML.

Sekcja Head     Treść pomiędzy <head> i </head> dostarcza informacji o stronie, które są ważne dla przeglądarki, ale najczęściej niewidoczne dla internauty.

Treść w tagach <meta> (zawsze zagnieżdżone w <head></head>) zawiera  informacje ważne dla przeglądarki. Aby poprawnie wyświetlały się polskie znaki za pomocą tagu meta dodajemy kodowanie UTF-8 – <meta charset=”UTF-8″>.

Tytuł strony, który jest wyświetlany jako największy, niebieski napis w wynikach wyszukiwania Google.

Treść title ma też duże znaczenie w SEO naszej strony – warto dopilnować, by zawierał najważniejsze słowa kluczowe danej strony.

Treść pomiędzy <body> i </body> jest tym, co widzisz potem w przeglądarce. Tu wstawiasz teksty i zdjęcia dla swojej witryny.