HTML to podstawowy język kodowania, który buduję każdą witrynę i aplikację webową. Nie jest on typowym językiem programowania, ponieważ nie obsługuje zdarzeń, nie manipuluje danymi, nie wykonuje instrukcji warunkowych czy nie można w nim pisać funkcji. Jego główną i niezwykle ważną rolą jest opisywanie struktury strony – wykorzystując odpowiednie znaczniki i atrybuty HTML nadaje poszczególnym elementom kodu znaczenie semantyczne.

 

Znaczniki i atrybuty HTML

HTML (HyperText Markup Language) to hipertekstowy język znaczników (tagów), który umożliwia zbudowanie struktury strony i jej zawartości oraz przełączanie się między poszczególnymi podstronami witryny. To za jego pomocą oznacza się sekcję <head> odpowiedzialną za najważniejsze informacje istotne dla przeglądarki internatowej oraz sekcję <body>, która zawiera wszystko to, co widzi użytkownik. Za sprawą HTML można zdecydować jaki element na stronie będzie nagłówkiem (h1-h6), paragrafem (p), linkiem (a), zdjęciem (img), listą (li) czy tabelą (table), a każdy z tych elementów może posiadać atrybuty HTML, które przechowają o nich dodatkowe informacje i najczęściej posiadają swoją nazwę i wartość np.:  <p nazwa="wartość">Atrybuty HTML</p>. Warto przy tym pamiętać, że HTML nie odpowiada za wygląd strony, za który odpowiedzialny jest CSS (ang. Cascading Style Sheets), czyli kaskadowe arkusze stylów. 

Kodowanie strony

Najczęściej wykorzystywane atrybuty HTML

  • alt – alternatywny tekst dla obrazka;
  • href – adres WWW dla hiperłącza;
  • id – unikalny identyfikator elementu;
  • class – klasa elementu;
  • src – adres obrazu lub innego pliku;
  • style – wbudowany CSS dla elementu;
  • title – dodatkowa informacja o elemencie;
  • autofocus – określa aktywacją wybranego elementu po załadowaniu strony;
  • autoplay – pozwala na automatyczny start audio/wideo po załadowaniu strony;
  • download – wskazuje, że po kliknięciu w link element zostanie pobrany;
  • form – łączy wskazany formularz z elementem;
  • height – określa wysokość elementu;
  • multiple – określa, czy użytkownik może wprowadzić więcej niż jedną wartość;
  • rel – określa relację pomiędzy dwoma dokumentami HTML;
  • required – określa, czy pole formularza jest wymagane;
  • target – określa cel otwierania linku lub przesyłania formularza;
  • width – określa szerokość elementu.

Powiązane artykuły

Zobacz wszystkie artykuły powiązane z #front end