FRONT-END

HTML

HTML & HTML5 - fundament wsplłczesnego Webu

HTML (HyperText Markup Language) jest podstawowym językiem znaczników używanym do tworzenia struktury stron internetowych. Każda strona WWW - niezależnie od technologii — opiera się na HTML.

HTML opisuje strukturę i znaczenie treści, CSS odpowiada za wygląd, a JavaScript za interakcje.

PODSTAWY

Czym jest HTML?

HTML to język znaczników, który pozwala opisać strukturę dokumentu poprzez znaczniki (tagi).

  • nagłówki
  • paragrafy
  • listy
  • linki
  • obrazy
<h1>Witaj świecie</h1>
<p>To jest moja pierwsza strona HTML.</p>
STRUKTURA

Podstawowa struktura dokumentu HTML

<!DOCTYPE html>
<html lang="pl">
  <head>
    <meta charset="UTF-8">
    <title>Moja strona</title>
  </head>
  <body>
    <h1>Hello HTML</h1>
  </body>
</html>

Deklaracja <!DOCTYPE> informuje przeglądarkę, że dokument używa standardu HTML5.

SEMANTYKA

Znaczniki semantyczne

Semantyczny HTML zwiększa:

  • dostępność (a11y)
  • czytelność kodu
  • SEO
<header>...</header>
<nav>...</nav>
<main>...</main>
<article>...</article>
<footer>...</footer>
HTML5

Czym jest HTML5?

HTML5 to nowoczesna wersja HTML, która wprowadziła wiele funkcji wcześniej dostępnych jedynie przez JavaScript lub wtyczki.

  • multimedia
  • grafika 2D
  • formularze
  • API przeglądarki
MULTIMEDIA

Audio i Video w HTML5

<video controls width="400">
  <source src="film.mp4" type="video/mp4">
</video>

HTML5 eliminuje potrzebę używania Flash czy Silverlight.

FORMULARZE

Nowoczesne formularze HTML5

<input type="email" required>
<input type="date">
<input type="range">
  • wbudowana walidacja
  • lepsze UX
  • mniej JavaScript
CANVAS

Canvas i grafika

Element <canvas> umożliwia dynamiczne rysowanie grafiki za pomocą JavaScript.

  • wykresy
  • gry 2D
  • animacje
API

API przeglądarki w HTML5

  • Geolocation API
  • LocalStorage / SessionStorage
  • Drag & Drop
  • Web Workers
SEO & A11Y

HTML a SEO i dostępność

  • poprawna hierarchia nagłówków
  • atrybuty alt
  • ARIA roles
  • semantyka
NOWOCZESNY WEB

HTML w nowoczesnym Front-Endzie

  • SPA
  • SSR
  • Web Components
  • PWA
HTML pozostaje fundamentem nawet najbardziej zaawansowanych aplikacji webowych.
PODSUMOWANIE

Podsumowanie

HTML i HTML5 są niezmiennie podstawą Internetu. Rozwój standardów sprawił, że HTML stał się potężnym narzędziem do budowy nowoczesnych, dostępnych i wydajnych aplikacji webowych.

1
HOME | CSS | HTML | CONTACT
RED | LIME | ORG |copy(Ⓒ)2023:xyh