HTML5 to najnowsza wersja języka HTML, zaprojektowana do zastąpienia HTML 4.01, XHTML 1.0 i XHTML 1.1. Jest to standard zaprojektowany w odpowiedzi na rosnące wymagania współczesnych stron internetowych i aplikacji webowych, które potrzebują więcej semantycznych znaczników i zaawansowanych funkcji interaktywnych. HTML5 wprowadza wiele nowych elementów i atrybutów, które umożliwiają twórcom stron internetowych budowanie bardziej dostępnych i interaktywnych serwisów bez konieczności stosowania dodatkowego oprogramowania, takiego jak Flash. Ponadto, HTML5 ulepsza obsługę multimediów na stronach internetowych, wprowadzając elementy takie jak <video> i <audio>, a także nowe formy kontrolek formularzy, które ułatwiają zbieranie informacji od użytkowników.
Przykład kodu z prostym HTML5
Poniższy przykład kodu demonstruje wykorzystanie podstawowych elementów HTML5 wraz z prostymi elementami formularza. Kod zawiera komentarze bezpośrednio w kodzie, wyjaśniające poszczególne części.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Formularz HTML5</title>
<style>
.container {
display: flex;
flex-direction: column;
align-items: center;
margin-top: 20px;
}
form {
display: flex;
flex-direction: column;
width: 300px;
}
input, select {
margin-bottom: 10px;
}
</style>
</head>
<body>
<div class="container">
<h3>Prosty formularz HTML5</h3>
<form>
<!-- Pole tekstowe -->
<label for="name">Imię:</label>
<input type="text" id="name" name="name">
<!-- Data -->
<label for="birthday">Data urodzenia:</label>
<input type="date" id="birthday" name="birthday">
<!-- Lista rozwijana -->
<label for="country">Kraj:</label>
<select id="country" name="country">
<option value="">Wybierz kraj</option>
<option value="pl">Polska</option>
<option value="us">Stany Zjednoczone</option>
</select>
<!-- Przycisk wysyłający formularz -->
<button type="submit">Wyślij</button>
</form>
</div>
</body>
</html>
Ten kod demonstruje użycie elementów formularza takich jak tekst, data, lista rozwijana oraz przycisk. Styl CSS jest stosowany do uporządkowania formularza i jego elementów, zapewniając czytelny i estetyczny wygląd.
Podsumowanie
HTML5 znacznie poszerza możliwości twórców stron internetowych, oferując nowe semantyczne elementy, ulepszoną obsługę multimediów i interaktywnych formularzy. Przykład przedstawiony powyżej to tylko niewielka część tego, co HTML5 ma do zaoferowania. Dzięki jego zastosowaniu, tworzenie bogatych, interaktywnych stron internetowych jest łatwiejsze i bardziej dostępne niż kiedykolwiek.
Jeżeli chcesz przyśpieszyć swoją naukę tworzenia stron chciałbym polecić mój kurs WebDevelopera od podstaw w którym nauczysz się tego języka od podstaw do zaawansowanych jego aspektów.