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 zawartości webowej 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.).

Uwaga:W następujących rozdziałach nauczymy się, jak „pomóc” starszym wersjom przeglądarek w obsłudze 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>

Uwaga: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>
Brak znaków cudzysłowów <input type="text" value=Bill Gates>
Ciąg znaków podwójnych <input type="text" value="Bill Gates">
Ciąg znaków pojedynczych <input type="text" value='Bill Gates'>

W standardzie HTML5, w zależności od potrzeb w stosunku do atrybutów, może być używana cała czwórka gramatyczna.

Nowe funkcje HTML5

Niektóre z najciekawszych nowych funkcji HTML5:

  • Nowe elementy semantyczne, takie jak <header>, <footer>, <article> i <section>.
  • Nowe kontrolki formularza, 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 zamiast 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>