HTML5

De la Wikipedia, enciclopedia liberă.
Salt la navigare Salt la căutare

1leftarrow blue.svg Element principal: HTML .

Logo-ul.

HTML5 este un limbaj de markup pentru structurarea paginilor web , publicat ca o recomandare W3C din octombrie 2014 .

Istorie

Dezvoltarea a fost inițiată de Web Hypertext Application Technology Working Group ( WHATWG ) (fondat în 2004 de dezvoltatorii aparținând Apple , Mozilla Foundation și Opera Software ) care și-a stabilit scopul de a proiecta specificații pentru dezvoltarea de aplicații web, concentrându-se pe îmbunătățiri și adăugiri la HTML și tehnologii conexe.

Inițial, spre deosebire de World Wide Web Consortium, pentru încetineala procesului de evoluție a standardului html și pentru decizia W3C de a orienta standardizarea către XHTML 2 care nu garantează compatibilitatea înapoi, același W3C a recunoscut apoi aceste motive ca fiind valabile , anunțând crearea unui grup special pentru standardizarea HTML5 și abandonarea XHTML 2.0 [1] .

Din 2007, WHATWG a colaborat cu W3C în acest proces de standardizare și apoi a decis în 2012 să se separe de procesul de standardizare W3C [2] , creând efectiv două versiuni ale HTML5: versiunea WHATWG este definită ca „Standardul de viață HTML” și, prin urmare, în continuă evoluție, în timp ce cea a W3C va fi o singură versiune corespunzătoare unui „instantaneu” al standardului de viață.

Prima recomandare a candidaților a fost publicată de W3C la 17 decembrie 2012, iar prima versiune a standardului a fost publicată ca recomandare la 28 octombrie 2014.

Versiunea HTML 5.1 a fost publicată de W3C ca recomandare la 1 noiembrie 2016.

Versiunea HTML 5.2 a fost publicată de W3C ca recomandare la 14 decembrie 2017 [3]

Versiunea HTML 5.3 a fost publicată de W3C ca o recomandare la 28 ianuarie 2021. [4]

Etichete învechite

HTML5 a depreciat următoarele etichete și atribute găsite în HTML4, deoarece funcția lor este acum gestionată de CSS3 [5] :

Elemente HTML4 depreciate în HTML5
Elemente HTML4 depreciate în HTML5

CSS3

Pictogramă lupă mgx2.svg Același subiect în detaliu: CSS .

HTML5 și CSS3 (evoluția CSS2) constituie un limbaj complet de turing [6] [7] , o condiție suficientă pentru ca un limbaj să fie considerat un limbaj de programare .

SEO

Pictogramă lupă mgx2.svg Același subiect în detaliu: Optimizarea motorului de căutare .

HTML5 este conceput pentru a îmbunătăți SEO față de versiunile anterioare de HTML.

Suport pentru browser

Exemplu de pagină HTML5 în Internet Explorer 7
Exemplu de pagină HTML5 în Internet Explorer 7 . Apare sincronizat, deoarece browserul nu recunoaște specificațiile

La nașterea HTML5, motorul de redare Webkit (Chrome și Safari) a fost primul care a interpretat corect multe dintre noile coduri, al doilea care s-a actualizat din acest punct de vedere a fost Gecko (Firefox) și în cele din urmă Trindent (Internet Explorer). De câțiva ani, site-urile care utilizează noile etichete HTML disponibile au fost vizualizate diferit în funcție de browserul pe care utilizatorul îl folosea [8] . În parte, această problemă a fost rezolvată prin tehnici precum CSS alternativ special pentru Internet Explorer , comentarii condiționate adaptate la aceasta și biblioteci JavaScript precum Modernizr [9] [10] [11] . Începând din 2019, Microsoft Edge acceptă majoritatea specificațiilor HTML5 [12] .

Anunțuri

Pictogramă lupă mgx2.svg Același subiect în detaliu: WebGL , Canvas (element HTML) , grafică vectorială scalabilă și videoclip HTML5 .

Inovațiile introduse de HTML5 în comparație cu HTML4 vizează în primul rând îmbunătățirea decuplării între structură, definită prin marcare, caracteristicile de redare (font, culori etc.), definite de directivele de stil și conținutul unei pagini web, definite de actualul text. În plus, HTML5 oferă suport pentru stocarea locală a unor cantități mari de date descărcate din browserul web , pentru a permite utilizarea aplicațiilor bazate pe web (cum ar fi cutii poștale Google sau alte servicii similare) chiar și în absența conexiunii la internet.

În special [13] :

  • regulile pentru structurarea textului în capitole, paragrafe și secțiuni sunt făcute mai stricte;
  • sunt introduse elemente de control pentru meniurile de navigare;
  • elementele de control pentru formularele electronice sunt îmbunătățite și extinse, adică noi atribute și tipuri de intrare pentru formulare (formulare de înregistrare și de contact);
  • sunt introduse elemente specifice pentru controlul conținutului multimedia (etichete <video> și <audio> ), cu încorporare HTML4 numai prin Adobe Flash .
  • o serie de atribute sunt extinse la toate etichetele, în special la cele care vizează accesibilitatea ( WAI-ARIA ), furnizate anterior doar pentru unele etichete;
  • Canvas este acceptat, care vă permite să utilizați JavaScript pentru a crea animații (posibil doar cu Adobe Flash în momentul HTML4) și grafică bitmap;
Un exemplu de stocare HTML5. Utilizatorul poate crea note și, chiar dacă browserul este reîmprospătat, va rămâne salvat.
Un exemplu de stocare HTML5. Utilizatorul poate crea note și, chiar dacă browserul este reîmprospătat, va rămâne salvat.
  • introducerea geolocalizării , datorită unei extinderi puternice a sistemelor de operare mobile (cum ar fi Android și iOS , printre cele mai populare);
  • sistem alternativ la cookie-urile normale, numit Web Storage, mai eficient, care permite o economie considerabilă a lățimii de bandă;
  • standardizarea programelor JavaScript, numite Web Workers și posibilitatea utilizării unor site-uri offline;
  • înlocuirea lung și complex doctype , cu un simplu <!DOCTYPE html> .
  • Microdate noi care descriu conținutul etichetelor (de exemplu, dacă este un nume, un prenume, o adresă, un număr de telefon, un e-mail etc.);
  • WebSocket API: capacitatea de a stabili și menține o conexiune de date între browser și serverul de la distanță pe care să trimiteți mesaje în ambele direcții;
  • Glisați și fixați ( glisați și fixați obiecte în interiorul unui container, de exemplu în cazul jocurilor video sau al produselor care urmează să fie plasate în coș pe site - urile de comerț electronic );
  • SVG și MathML : posibilitatea de a insera grafice vectoriale și formule matematice în HTML, care în HTML4 ar putea fi importate doar ca imagini sau create în Adobe Flash .
TAG [14] DOMENIU DE APLICARE
Noi elemente structurale și semantice
Antet
Comparație între pagina de bază HTML4 și 5
Comparație între pagina de bază HTML4 și 5
Subsol
Secțiune
Nav
Articol (în cazul articolelor de pe pagina de pornire)
În afară (conținut legat de principal)
Hgroup Grupați etichetele de antet
<figure> și <figcaption> Subtitrări pentru conținut
Încorporare Introduceți conținut interactiv sau multimedia
Rubin Specificați adnotările Ruby
Wbr Browserul poate insera o linie nouă
<comandă> și <meniu> Acestea definesc bare de instrumente sau meniuri contextuale
<detalii> și <sumar> Widget de informații pentru utilizatori
marcă Parte a unui text marcat sau evidențiat de utilizator
Atributele <time> și pubdate și datetime Ora de 24 de ore sau o dată din calendarul gregorian
Metru Măsură scalară a unui interval cunoscut sau a unei valori fracționare
Progres Starea finalizării unei sarcini
Imagine Container pentru imagini
Microdate Atributele semantice pot fi specificate pentru fiecare etichetă HTML
Atribute noi și tipuri de intrare pentru formulare
autofocus, substituent și formă
formă
Autofocusul în acest caz este în roșu. Tipurile de intrare sunt echivalente cu spațiile care trebuie completate (în acest caz există „e-mail”). Substituentul este exemplul de text al fiecărui spațiu
Tipul de intrare: tel
Tipul de intrare: căutare
Tipul de intrare: URL
Tipul de introducere: e-mail
Tipul de intrare: număr
Tipul de intrare: interval
Tipul de intrare: culoare
Datalist Completare automată pe un element de formular
Completare automată Permite sau interzice browserului să completeze câmpurile

a formularului automat

Minim maxim Acestea definesc valoarea minimă și maximă permisă
Multiplu Permite utilizatorului să introducă mai multe valori pentru aceeași intrare
Model Verificați dacă valoarea introdusă respectă anumite reguli
Necesar Este obligatorie completarea unui spațiu al formularului
Etapa Acesta definește distanța dintre o valoare și următoarea
keygen Generator de chei numerice într-un formular
ieșire Returnează rezultatul unui calcul
API pentru aplicații web
Aplicații web offline (fișier „.manifest”) După prima sesiune de navigare online,

unele obiecte vor rămâne, de asemenea, accesibile

în absența unei conexiuni de rețea.

API de baze de date indexate Creați și manipulați o bază de date în browser
API WebStorage De exemplu, le puteți menține deschise în același timp

două conturi sociale sau de e-mail pe același browser și fiecare navigare

pe primul va rezulta deconectarea celui de-al doilea și invers

API Web Workers Acestea permit executarea unor bucăți de cod Javascript

fără a afecta performanța paginii web

API WebSocket Acestea stabilesc și mențin o conexiune de date între browsere

și server de la distanță pe care să trimiteți mesaje

în ambele sensuri

Tragere și plasare Glisați și fixați obiecte
API de geolocalizare Geolocalizare
Multimedia
SVG și MathML Imagini vectoriale și formule matematice
Canvas / WebGL API-uri potrivite pentru desenarea liniilor, cercurilor, dreptunghiurilor, imaginilor și obiectelor 3D
Video Inserați fișiere video (anterior fezabile numai cu Adobe Flash )
Audio Introduceți fișiere audio

WAI AIR

Pictogramă lupă mgx2.svg Același subiect în detaliu: Accesibilitate (web) , Accesibilitate (design) și Wai-aria .

WAI-ARIA ( Web Accessibility Initiative - Accessible Rich Internet Applications ) este un set de documente publicate de W3C ( World Wide Web Consortium ) care specifică cum să crească accesibilitatea conținutului dinamic și a componentelor interfeței utilizator dezvoltate cu AJAX , HTML , JavaScript și alte tehnologii conexe. HTML5 a adăugat noi reguli WAI ARIA [15] .

Test HTML5

Pagină de test HTML5 vizualizată într-un browser Chrome
Pagină de test HTML5 vizualizată în browserul Chrome

HTML5test este o aplicație web pentru evaluarea acurateței unui browser web în implementarea standardelor web HTML5 și a bazei de date Web SQL (dezvoltat de World Wide Web Consortium ), precum și standardul WebGL (dezvoltat de Mozilla Foundation și Khronos Group ) [ 16] .

Suita de testare a fost dezvoltată de programatorul web olandez Niels Leenheer și lansată în martie 2010. Pentru a testa un browser web, utilizatorul trebuie să viziteze pagina de pornire a site-ului web la adresa html5test.com [17] . Aplicația returnează un scor întreg de până la 555 de puncte. Totalul punctelor s-a schimbat de mai multe ori prin evoluția software-ului; Leenheer a introdus ulterior un sistem de notare ca parte a unei reproiectări majore a testelor introduse în noiembrie 2013 [18] .

HTML5test evaluează suportul browserului pentru stocarea web, API-ul de geolocalizare W3C, elemente HTML specifice HTML5 (inclusiv elementul Canvas ) și alte caracteristici [19] [20] . Nu evaluează conformitatea unui browser cu alte standarde web, cum ar fi Foi de stil în cascadă , ECMAScript , Grafică vectorială scalabilă sau Modelul de obiect document . Testarea conformității pentru aceste standarde este responsabilitatea Acid3 , un test automat publicat de Ian Hickson în 2008 [21] . La fel, Acid3 nu evaluează conformitatea HTML5 a unui browser. Domeniul de testare al testului HTML5 și domeniul de testare al Acid3 se exclud reciproc.

Exemple

Notă

  1. ^ (EN) Grupul de lucru XHTML 2 se așteaptă să oprească lucrările la sfârșitul anului 2009, W3C va crește resursele pe HTML5 , pe w3.org, consorțiul World Wide Web. Adus la 15 februarie 2011 .
  2. ^ (EN) Actualizare privind relația dintre standardul de viață WHATWG HTML și specificația W3C HTML5 , pe lists.w3.org, World Wide Web Consortium. Adus la 22 iulie 2012 .
  3. ^ https://www.w3.org/TR/html52/ Recomandare HTML 5.2 W3C
  4. ^ https://www.w3.org/TR/html53/ Recomandare HTML 5.3 W3C
  5. ^ (EN) Etichete HTML care sunt depreciate în HTML5 , pe www.c-sharpcorner.com. Adus la 3 februarie 2021 .
  6. ^ Mașini stupide - regula 110 , pe github.com .
  7. ^ Regula 110 Demonstrație on-line , la eli.fox-epste.in .
  8. ^ (EN) Getting to Grips with HTML5 Browser Compatibility , on Speckyboy Design Magazine, 26 martie 2012. Accesat la 3 februarie 2021.
  9. ^ Css3 pe Internet Explorer 8? - de astăzi puteți , pe Target Web.it , 8 aprilie 2011. Adus pe 3 februarie 2021 .
  10. ^ (EN) Comentarii condiționate Internet Explorer - SitePoint pe www.sitepoint.com. Adus la 3 februarie 2021 .
  11. ^ Faruk Ateș, Profitând de HTML5 și CSS3 cu Modernizr , în Italian A List Apart , 5 iulie 2010. Accesat la 3 februarie 2021 .
  12. ^ Test HTML5 - Cât de bine acceptă browserul dvs. HTML5? , la html5test.com . Adus la 3 februarie 2021 .
  13. ^ HTML5: ghid complet , pe HTML.it. Adus la 28 ianuarie 2021 .
  14. ^ HTML5: ghid complet , pe HTML.it. Adus pe 29 ianuarie 2021 .
  15. ^ (EN) Accessable Rich Internet Applications (WAI-ARIA) 1.1 , pe www.w3.org. Adus la 22 februarie 2021 .
  16. ^ Niels Leenheer , Întrebări frecvente HTML5test , la HTML5test.com , Niels Leenheer . Adus pe 10 iulie 2014 .
  17. ^ Martin Brinkmann, HTML5 Testează-ți browserul web , pe gHacks Technology News . Adus pe 10 iulie 2014 .
  18. ^ Niels Leenheer, noul test HTML5 este aici! , pe blog.html5test.com , 13 noiembrie 2013. Adus pe 12 iulie 2014 .
  19. ^ Scriitor de personal , Testează-ți browserul pentru compatibilitatea HTML5 , pe CyberNet News . Adus pe 10 iulie 2014 .
  20. ^ Erez Zukerman, Testează abilitatea HTML5 a browserului tău cu testul HTML5 . Comutat , AOL , 8 august 2010. Accesat la 10 iulie 2014 .
  21. ^ Acid3: Punerea din nou a Browser Makers. , pe webstandards.org , Web Standards Project , 3 martie 2008. Accesat la 10 iulie 2014 .

Bibliografie

  • Jeffrey Zeldman, Ethan Marcotte, Dezvoltarea site-urilor cu standarde web , Milano, Apogeo, 2010, ISBN 978-88-503-2964-9 .
  • Mark Pilgrim, HTML5: Ghid operațional , Milano, Hops noi tehnici, 2010, ISBN 978-88-481-2504-8 .
  • Gabriele Gigliotti, HTML5: Developing the Web of Tomorrow Today , Milano, Apogeo, 2012, ISBN 978-88-503-3116-1 .

Elemente conexe

Alte proiecte

linkuri externe

Controlul autorității GND ( DE ) 7704810-6