HTML5 este cea mai recentă versiune de HTML, în scopul de a simplifica
dezvoltarea de aplicatii web. Sintaxa HTML5 este mult mai ușoară în
comparație cu HTML4, și oferă multe caracteristici noi. Acest articol
oferă o introducere în HTML5.
Cum să utilizați HTML5?
Offline aplicații cache
Aplicațiile HTML5 pot fi pornite pentru a rula offline. HTML5 oferă funcția de stocare offline, numit un cache al cererii pentru stocarea de fișiere. Deci, dacă utilizatorul este offline, browser-ul încă mai are acces la fișierele necesare. Acesta poate fi HTML, CSS, Javascript, sau orice alte resurse necesare pentru a vizualiza pagina de web.
Drag and Drop
HTML5 oferă o funcție incorporată Drag and Drop, care permite dezvoltarea de aplicații interactive. Cu Drag & Drop aveți posibilitatea să mutați orice element în locul potrivit.
Geolocation
Geolocation API în HTML5, permite să partajați locația dvs. cu site-uri de încredere. Confidențialitatea este importantă în funcția de geolocalizare. Browserele nu au nevoie să trimită informații despre locație la site-uri Web, fără permisiunea expresă a utilizatorului. De exemplu, dacă un utilizator accesează o pagină web, în care, de asemenea,este prezentă funcția de geolocalizare folosind browser-ul Firefox. Browser-ul va cere permisiunea, dacă utilizatorul dorește să împărtășească locația lui. Dacă utilizatorul consimte, Firefox va aduna informații despre punctele de acces fără fir în apropiere și adresa IP a computerului vizitatorilor și va trimite aceste informații în Google Location Services, care este un serviciu de geolocalizare Firefox implicit.
Audio și video
În prezent, există facilități HTML necesare pentru punerea în aplicare a fișierelor multimedia. De aceea, fișierele media se includ în HTML folosind diferite plugin-uri . De exemplu, Flash este utilizat pe scară largă pentru a încorpora video și fișiere audio. Cu toate acestea, acest lucru poate fi foarte ușor de făcut în HTML5 cu ajutorul elementelor audio și video, fără utilizarea de plugin-uri.
Formulare de introducere
HTML5 introduce mai multe elemente noi de intrare, cum ar fi pop-up calendare, selectoare de culori și multe altele. Cu aceste funcții de intrare se poate crea o forma foarte eficienta, cu un control mai bun al intrării și verificării.
Sintaxa simplificată
Doctype:
Declarația DOCTYPE este primul lucru, ce trebuie de făcut într-un document HTML. Ea indică browser-ui web versiunea limbajui de marcare a paginii. Exemplu: Versiunea HTML 4.01 Transitional DOCTYPE este definit ca:
Iar versiunea XHTML 1.0 Transitional DOCTYPE este definită ca:
În HTML5, declarația DOCTYPE este mult mai ușoară, și arată astfel:
Codificarea caracterelor:
Pentru a afișa documentul HTML, programul ar trebui să selecteze o codificare. Codificarea caracterelor indică browser-ului ce set de caractere să utilizeze la conversia biților în caractere. Exemplu: Codificarea caracterelor UTF-8 în HTML 4.01:
Pentru XHTML:
Sintaxa de codificare a caracterelor este foarte simplă în HTML 5, și anume:
Astfel, cel mai simplu documentul HTML5 ar fi:
Tag-ul script
Tag-ul script este folosit pentru a defini partea de client, cum ar fi JavaScript. În HTML 4 este necesar de folosit atributul type, dar nu este necesar în HTML5. De exemplu, în HTML4, tag-ul script este folosit astfel:
Iar în HTML 5:
În tag-ul script în HTML5 este introdus un nou atribut opțional «async», care indică browser-ului să execute script-ul asincron cu restul paginii, astfel încât script-ul va fi executat până când pagina încă se încarcă. Acest lucru se scrie astfel:
sau
Tag-ul link
Tag-ul link defineste o relație dintre documente și resursele externe. Această etichetă este frecvent utilizată pentru a include fișiere CSS.
De exemplu:
În HTML5, atributul type este opțional pentru tag-ul link, similar și pentru tag-ul script.
De exemplu:
Elemente noi în HTML5
În HTML5 s-au adăugat unele etichete foarte interesante și utile pentru structurarea aspectului și dezvoltarea mai ușoară. Aici sunt unele dintre cele mai importante tag-uri:
Tag-ul header
Tag-ul header conține titlul paginii web, care este, de obicei, în partea de sus a paginii care conține logo-ul și alte informații, cum ar fi un slogan, și meniuri, etc. În loc de a folosi:
puteți scrie pur și simplu
Tag-ul nav
Tag-ul nav este folosit pentru a naviga prin meniu. De exemplu, în loc de
aveți posibilitatea să utilizați
pentru navigare.
Tag-ul arcticle
Tag-ul arcticle prezintă conținutul independent și separate. Un exemplu de utilizare a tag-ul poate fi un post pe blog, articol de știri, postare pe forum, comentariul utilizatorului, etc.
Tag-ul section
Tag-ul section este folosit pentru a separa diferite secțiuni ale paginii.
Tag-ul grupează conținutul care, de obicei, vine după antet sau înaintea subsolului. Dacă este necesar, secțiunile pot fi imbricate între ele.
Tag-ul aside
Tag-ul aside definește o secțiunea de pagină cu conținut care este tangențial legat de conținutul din jurul lui. Tag-ul poate fi folosit pentru panourile laterale sau orice alt conținut care poate fi analizat separat de conținutul principal al paginii.
Tag-ul figure
Tag-ul figure este folosit pentru comentarii la ilustrații, diagrame, fotografii, și la listele de cod, etc.Tag-ul figcaption este utilizat ca titlu pentru tag-ul figure.
Tag-ul footer
Este folosit pentru a reprezenta secțiunea subsol și este, de obicei, situat în partea de jos a paginii. Footer conține de obicei informații precum numele autorului, privind drepturile de autor, link-uri către termenii de utilizare și politica de confidențialitate, etc. Informațiile de contact în footer trebuie să fie scrisă în tag-ul address.
Elementele exluse
În afară de cele noi, există unele elemente care nu mai sunt acceptate în HTML5. Aici sunt unele dintre elementele șterse:
După cum a-ți văzut, elemente cum ar fi cadrele - frame, frameset și noframes au fost eliminate din HTML5.
Tag-ul Font
Elementul font se utiliza pentru a determina fontul, dimensiunea și culoarea textului.
Tag-ul strike
Elementul strike a fost necesar pentru a determina textul tăiat cu o linie. În schimb, utilizați acum
Tag-urile u, center, big, applet și acroniym
Eticheta
utilizată pentru a determina textul subliniat.
ajustă textul și conținutul în centru.
folosit pentru a mari textul.
utilizată pentru a determina applet-ul încorporat. HTML5 suportă tag-ul object în loc.
Exemplu, de cod complet pentru o pagină simplă în HTML5:
Web Development Cursuri și Tutoriale
Tutoriale HTML5
Învață rapid HTML5
Invata despre noile caracteristici din HTML5.
Tag-uri noi, si elemente pentru structura.
Noile caracteristici din HTML5 sunt bazate pe HTML, CSS, DOM, și JavaScript; si reduc necesitatea plugin-urilor externe (precum Flash).
Multe alte noi caracteristici HTML5 sunt centrate pe crearea unei mai bune platforme pentru aplicatiile web, Cititi mai mult ...
Elemente si attribute noi pentru formular in HTML5
Formularele HTML sunt folosite in general ca sa transfere date adaugate de utilizator la un script de pe server sau JavaScript, ca sa fie procesate de un limbaj de programare.
HTML5 adauga mai multe tipuri de casute input noi, pentru formular (datetime, datetime-local, date, month, week, time, number, range, email, url, search, and color), Cititi mai mult ...