Wprowadzenie do HTML5

Przykłady HTML5 w każdym rozdziale

Przykład

<!DOCTYPE html>
<html>
<body>
<video width="420" controls>
  <source src="mov_bbb.mp4" type="video/mp4">
  <source src="mov_bbb.ogg" type="video/ogg">
 Twoja przeglądarka nie obsługuje tagu wideo.
</video>
</body>
</html>

Spróbuj sam

Kliknij „Spróbuj sam” aby zobaczyć, jak działa ten przykład.

Co to jest HTML5?

HTML5 jest najnowszym standardem HTML.

HTML5 jest zaprojektowany specjalnie do przenoszenia bogatego treści webowych bez potrzeby dodatkowych wtyczek.

HTML5 ma nowe semantyczne, graficzne oraz multimedia elementy.

Nowe elementy i nowe API w HTML5 upraszczają tworzenie aplikacji webowych.

HTML5 jest wieloplatformowy i zaprojektowany do działania na różnych typach sprzętu (PC, tablety, telefony, telewizory itp.).

Komentarz:W następujących rozdziałach nauczymy się, jak „pomóc” przestarzałym przeglądarkom obsługiwać HTML5.

Co nowego w HTML5?

Nowe oświadczenie typu dokumentu (DOCTYPE) w HTML5 jest bardzo proste:

<!DOCTYPE html>
Nowe oświadczenie kodu znaków (charset) jest również bardzo proste:
<meta charset="UTF-8">

Przykład HTML5:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Tytuł dokumentu</title>
</head>
<body>
Zawartość dokumentu......
</body>
</html>

Komentarz:Domyślnym kodem znaków w HTML5 jest UTF-8.

Nowa gramatyka atrybutów HTML5

HTML5 standard pozwala na 4 różne gramatyki atrybutów.

Ten przykład pokazuje różne gramatyki używane w etykiecie <input>:

Typ Przykład
Pusty <input type="text" value="Bill Gates" disabled>
Bez cytowania <input type="text" value=Bill Gates>
Cytowanie podwójne <input type="text" value="Bill Gates">
Cytowanie pojedyncze <input type="text" value='Bill Gates'>

W standardzie HTML5, w zależności od potrzeb właściwości, może być używane wszystkie 4 rodzaje gramatyki.

Nowe funkcje HTML5

Najbardziej interesujące nowe funkcje HTML5:

  • Nowe elementy semantyczne, takie jak <header>, <footer>, <article> i <section>.
  • Nowe kontrolki formularzy, takie jak liczby, daty, czasy, kalendarze i suwaki.
  • Silne wsparcie dla obrazów (poprzez <canvas> i <svg>)
  • Silne wsparcie dla multimedii (poprzez <video> i <audio>)
  • Silne nowe API, takie jak lokalne przechowywanie w zamian za pliki cookie.

Elementy usunięte z HTML5

Poniższe elementy HTML 4.01 zostały usunięte z HTML5:

  • <acronym>
  • <applet>
  • <basefont>
  • <big>
  • <center>
  • <dir>
  • <font>
  • <frame>
  • <frameset>
  • <noframes>
  • <strike>
  • <tt>