Choć jego rozwój rozpoczął się wiele lat wcześniej, HTML5 po raz pierwszy naprawdę zaczął być powszechnie używany przez projektantów stron internetowych / projektantów w 2010 r. Już od samego początku język ten był znany wielu specjalistom, ponieważ zamiast próbować wymyślać wszystko od zera, HTML5 zbudowany na tym, co było wcześniej. Każdy, kto znał HTML 4.01, szybko odkrył, że całkiem sporo z tej wersji można teraz znaleźć w HTML5.
Podczas HTML5 zawiera wiele elementów, które były w HTML na chwilę, ale także wprowadziła garść elementów, które były nowe w HTML5. W przypadku wielu z tych nowych elementów zastosowano podejście o nazwie "układanie krów". Jest to termin powszechnie używany w IT, aby w istocie oznaczać to, co ludzie już robią i robią to. W przypadku projektantów stron internetowych miało to na celu sprawdzenie, w jaki sposób budowali już strony i podejmowali decyzje dotyczące nowych elementów tych działań. Na przykład wielu profesjonalistów internetowych tworzy strony internetowe z podziałami, które używały atrybutów ID lub Class "header", "nav" i "footer". W związku z tym HTML5 wprowadził je jako nowe elementy, pozwalając profesjonalistom w dziedzinie sieci WWW nadać większą wagę ich dokumentom za pomocą dedykowanych elementów podziału zamiast tylko podziałów. Ta kombinacja znajomości i podejście, które rozpoznało obecne praktyki, pozwoliło HTML5 szybko zostać zaakceptowanym przez branżę projektowania stron internetowych.
Doctype HTML5
Po pierwsze, aby użyć dowolnych nowych elementów HTML5, dokument musi zawierać dokument HTML5, który jest:
Możesz zauważyć, że ten typ dokumentu nie wspomina o "HTML5", ale po prostu określa wersję jako "html". Dzieje się tak dlatego, że ten typ dokumentu jest przeznaczony do użycia w przyszłości dla wszystkich iteracji języka.
W rzeczywistości HTML5 ma być ostatnią numerowaną wersją języka, z nowymi zmianami dodawanymi konsekwentnie w przyszłości. W rzeczywistości, niektóre z elementów na poniższej liście zostały dodane do tego języka również po pierwszym wprowadzeniu w 2010 roku!
Tagi HTML5
Etykietka | Wyjaśnienie | |
---|---|---|
Kotwica lub link | ||
Skrót | ||
Adres lub autorzy dokumentu | ||
Mapa obrazu po stronie klienta | ||
Artykuł | ||
Treść styczna | ||
Strumień audio | ||
Pogrubienie | ||
Podstawowe ścieżki URI dla elementów w dokumencie | ||
Algorytm dwukierunkowy | ||
Długi cytat | ||
Treść strony | ||
Przerwanie linii | ||
Przycisk formularza HTML | ||
Canvas dla dynamicznej grafiki | ||
Komentarz | ||
Tytuł tabeli | ||
Cytat | ||
| Odniesienie do kodu | |
Kolumna tabeli | ||
Grupowanie kolumn tabeli | ||
Polecenie lub akcja na stronie | ||
Definicja typu dokumentu | ||
Siatka danych | ||
Predefiniowane opcje dla innych formantów | ||
Opis listy definicji lub rozpiętość dyskursu | ||
Usunięty tekst | ||
Dodatkowe informacje na żądanie | ||
Definicja | ||
Rozmowa | ||
Podział logiczny | ||
Lista opisów | ||
Termin listy definicji lub głośnik okna dialogowego | ||
Nacisk | ||
Osadzony element dla wtyczek | ||
Formuj grupę kontrolną | ||
Podpis używany do a | ||
Rysunek z opcjonalnym podpisem | ||
Stopka strony | ||
Formularz | ||
Nagłówek pierwszego poziomu | ||
Nagłówek drugiego poziomu | ||
Nagłówek trzeciego poziomu | ||
Nagłówek czwartego poziomu | ||
Nagłówek na piątym poziomie | ||
Szósty nagłówek poziomu | ||
Kierownik dokumentu | ||
| Nagłówek strony | |
Grupa nagłówków | ||
Linia pozioma | ||
Element główny strony internetowej | ||
Styl tekstu kursywy | ||
Ramka Inline | ||
Obraz | ||
Element formularza wejściowego | ||
Element formularza przycisku | ||
Element formularza checkbox | ||
Wprowadzanie kolorów | ||
Wprowadzanie daty | ||
Globalna data i godzina | ||
Lokalna data i czas wejścia | ||
Wprowadzanie adresu e-mail | ||
Element formularza przesyłania plików | ||
Element pola ukrytej postaci | ||
Element formy obrazu | ||
Dane z roku na rok | ||
Numer wejściowy | ||
Element formularza hasła | ||
Element formularza przycisku radiowego | ||
Niepoprawne wprowadzanie liczb | ||
Zresetuj element formularza przycisku | ||
Pole wyszukiwania | ||
Prześlij element formularza przycisku | ||
Wprowadzanie numeru telefonu | ||
Element formularza pola tekstowego | ||
Wprowadzanie czasu | ||
Wprowadzanie adresu URL | ||
Wprowadzanie roku i tygodnia | ||
Wstawiony tekst | ||
Tekst wprowadzany przez użytkownika | ||
Wygeneruj bezpieczne klucze do zarządzania certyfikatami | ||
Etykieta formularza | ||
Utwórz podpis zestawu pól | ||
Element listy | ||
Link do powiązanych dokumentów | ||
Główny obszar treści na stronie | ||
Mapa obrazu po stronie klienta | ||
Zaznaczony lub wyróżniony tekst | ||
Lista poleceń | ||
Meta informacje o dokumencie | ||
Skalarowy wskaźnik | ||
Zdefiniuj obszar z linkami nawigacyjnymi | ||
Treść, gdy skrypty nie są dostępne | ||
Niestandardowy obiekt | ||
| Lista uporządkowana lub numerowana | |
Grupa opcji na liście wyboru | ||
Opcja na liście wyboru | ||
Wynik obliczenia formularza | ||
Ustęp | ||
Parametr elementu obiektu | ||
| Wstępnie sformatowany tekst | |
Wskaźnik postępu | ||
Krótka liniowa oferta | ||
Ruby nawias | ||
Tekst Rubinowy | ||
Adnotacja ruby | ||
Tekst przekreślony | ||
Przykładowe wyjście | ||
Skrypty | ||
Sekcja strony | ||
Wybierz lub rozwijane listy menu | ||
Mały rozmiar czcionki | ||
Źródło multimediów | ||
Ogólny kontener stylowy | ||
Silny nacisk | ||
Arkusze stylów | ||
Indeks | ||
Podsumowanie zawartości elementu DETAILS | ||
Napisany u góry | ||
Stół | ||
Wiersze treści tabeli | ||
Komórka tabeli | ||
Wielokreskowy element formularza | ||
Wiersze w stopce tabeli | ||
Komórka nagłówka tabeli | ||
Wiersze nagłówków tabeli | ||
Definiuje czas | ||
Tytuł | ||
Wiersz tabeli | ||
| Nieuporządkowana lub spreparowana lista | |
Tekst zmienny lub zdefiniowany przez użytkownika | ||
Wideo lub film osadzone na stronie |