Acest element are avantaje față de alte tehnologii
HTML5 include un element interesant numit CANVAS. Are o mulțime de utilizări, dar pentru ao folosi, trebuie să înveți niște JavaScript, HTML și, uneori, CSS.
Acest lucru face ca elementul CANVAS să fie puțin descurajător pentru mulți designeri și, de fapt, majoritatea probabil va ignora elementul până când vor exista instrumente fiabile pentru a crea animații și jocuri CANVAS fără a cunoaște JavaScript.
Ce HTML5 Canvas este folosit pentru
Elementul HTML5 CANVAS poate fi folosit pentru o mulțime de lucruri care înainte, a trebuit să utilizați o aplicație încorporată ca Flash pentru a genera:
- grafică dinamică
- jocuri online și offline
- animații
- video și audio interactive
De fapt, principalul motiv pentru care oamenii folosesc elementul CANVAS este datorat cât de ușor este să transformi o pagină web într-o aplicație web dinamică și apoi să transformi acea aplicație într-o aplicație mobilă pentru utilizarea pe smartphone-uri și tablete.
Dacă avem Flash, de ce avem nevoie de panza?
Conform specificației HTML5, elementul CANVAS este:
"... o panza bitmap dependentă de rezoluție, care poate fi utilizată pentru a reda grafice, grafică de joc, artă sau alte imagini vizuale în zbor".Elementul CANVAS vă permite să desenați grafice, grafică, jocuri, artă și alte imagini vizuale direct pe pagina web în timp real.
S-ar putea să vă gândiți că putem face deja acest lucru cu Flash, dar există două diferențe majore între CANVAS și Flash:
- Elementul CANVAS este încorporat chiar în HTML. Scripturile care se bazează pe acestea sunt fie în HTML, fie într-un fișier extern legat. Aceasta înseamnă că elementul CANVAS face parte din modelul de obiect document sau DOM.
- Flash este un fișier extern încorporat. Utilizează fie elementul EMBED, fie elementul OBJECT pentru afișare, și nu poate interacționa direct cu celelalte elemente HTML. Deoarece elementul CANVAS face parte din DOM, acesta poate interacționa cu DOM în multe feluri.
- De exemplu, puteți crea o animație care se schimbă atunci când este interacționată o altă parte a paginii - cum ar fi un element de formular completat. Cu Flash, cel mai mult ar putea fi să începeți filmul Flash sau animația, dar cu CANVAS puteți crea multe efecte diferite, chiar adăugând textul din câmpul de formă în animație.
- Elementul CANVAS este suportat nativ de browserele web. Pentru ca utilizatorii să utilizeze efectiv Flash, browserul lor trebuie să aibă pluginul instalat. Acest lucru este adesea un hassle pentru majoritatea oamenilor din cauza instalărilor Flash depășite sau faptul că sistemul lor de operare pur și simplu nu îl suportă.
- De obicei, fiecare browser avea pluginul instalat, dar nu mai este cazul, iar multe dintre ele chiar elimină pluginul din cauza dificultăților. În plus, nu este nici măcar disponibil pe platforma populară iOS.
Canvasul este util chiar dacă nu ați planificat să utilizați Flash
Unul dintre principalele motive pentru care elementul CANVAS este atât de confuz este faptul că mulți designeri au devenit obișnuiți cu o rețea complet statică. Imaginile ar putea fi animate, dar asta se face cu GIF și, desigur, puteți încorpora videoclipul în pagini, dar din nou, este un film static care pur și simplu se află pe pagină și poate începe sau se oprește din cauza interacțiunii, dar asta e tot.
Elementul CANVAS vă permite să adăugați mult mai multă interactivitate paginilor dvs. web, deoarece acum puteți controla dinamic graficul, imaginile și textul cu un limbaj de scripting. Elementul CANVAS vă ajută să transformați imagini, fotografii, diagrame și grafice în elemente animate.
Când să luați în considerare utilizarea elementului de panza
Publicul dvs. trebuie să vă privească prima dată când decideți dacă să utilizați elementul CANVAS.
Dacă publicul dvs. folosește în primul rând Windows XP și IE 6, 7 sau 8, atunci crearea unei caracteristici canvas dinamice va fi inutilă, deoarece acele browsere nu o acceptă.
Dacă construiți o aplicație care va fi utilizată numai pe mașinile Windows, Flash ar putea fi cel mai bun pariu. O aplicație care va fi utilizată pe computerele Windows și Mac ar putea beneficia de o aplicație Silverlight.
Cu toate acestea, dacă aplicația dvs. trebuie văzută pe dispozitive mobile (Android și iOS), precum și computere desktop moderne (actualizate la cele mai recente versiuni ale browserului), folosirea elementului CANVAS este o alegere bună.
Rețineți că utilizarea acestui element vă permite să aveți opțiuni de rezervă, cum ar fi imaginile statice pentru browserele mai vechi, care nu o acceptă.
Cu toate acestea, nu este recomandat să folosiți panza HTML5 pentru tot. Nu trebuie să - l utilizați niciodată pentru lucruri precum logo-ul, titlul sau navigația (deși folosiți-o pentru a anima o porțiune din oricare dintre acestea ar fi bine).
Conform specificațiilor, ar trebui să utilizați elementele cele mai potrivite pentru ceea ce încercați să construiți. Deci, folosirea elementului HEADER împreună cu imaginile și textul este preferabil elementului CANVAS pentru antetul și sigla.
De asemenea, dacă creați o pagină web sau o aplicație destinată a fi utilizată într-un mediu non-interactiv cum ar fi imprimarea, trebuie să știți că elementul CANVAS care a fost actualizat dinamic nu poate să imprime așa cum vă așteptați. S-ar putea să obțineți o imprimare a conținutului actual sau a conținutului rezervat.