Ta element ima koristi pred drugo tehnologijo
HTML5 vključuje razburljiv element, imenovan CANVAS. Ima veliko uporab, vendar ga je za uporabo treba naučiti nekaj JavaScript, HTML in včasih CSS.
To naredi element CANVAS malo zastrašujoč za mnoge oblikovalce in dejansko bo večina verjetno prezrla element, dokler ne bodo na voljo zanesljivih orodij za ustvarjanje animacij in iger CANVAS, ne da bi vedeli JavaScript.
Za kaj se uporablja HTML5 Canvas
HTML5 CANVAS element se lahko uporablja za veliko stvari, ki so bile prej, morali ste uporabiti vgrajeno aplikacijo, kot je Flash za ustvarjanje:
- dinamična grafika
- spletne in offline igre
- animacije
- interaktivni video in avdio
Pravzaprav glavni razlog, zaradi katerega ljudje uporabljajo element CANVAS, je, kako enostavno je pretvoriti navadno spletno stran v dinamično spletno aplikacijo in nato pretvoriti to aplikacijo v mobilno aplikacijo za uporabo v pametnih telefonih in tabličnih računalnikih.
Če imamo Flash, zakaj potrebujemo platno?
V skladu s specifikacijo HTML5 je element CANVAS:
"... platno, odvisno od ločljivosti, ki se lahko uporablja za prikaz grafik, grafike iger, umetnosti ali drugih vizualnih slik na letalu."Element CANVAS vam omogoča risanje grafik, grafik, iger, umetnosti in drugih slik na spletnem mestu v realnem času.
Morda razmišljate, da to lahko storimo že s programom Flash, vendar med CANVAS in Flashom obstajata dve veliki razliki:
- Element CANVAS je vstavljen v HTML. Skripte, ki se pojavljajo na njem, so v HTML ali v povezani zunanji datoteki. To pomeni, da je element CANVAS del modela predmeta dokumenta ali DOM.
- Flash je vgrajena zunanja datoteka. Uporablja element EMBED ali element OBJECT za prikaz in ne more neposredno vplivati na druge elemente HTML. Ker je element CANVAS del DOM, lahko na različne načine komunicira z DOM.
- Na primer, lahko ustvarite animacijo, ki se spremeni, ko se interaktira drugi del strani - na primer, da je izpolnjen obrazec za obrazec. S programom Flash bi lahko največ, kar bi lahko storili, začeti film Flash ali animacijo, CANVAS lahko ustvarite veliko različnih učinkov, celo dodate besedilo iz polja obrazca v animacijo.
- Element CANVAS izvorno podpirajo spletni brskalniki. Da bi uporabniki dejansko uporabljali Flash, mora imeti svoj brskalnik nameščen vtičnik. To je pogosto težava za večino ljudi zaradi zastarelih namestitev Flash ali dejstva, da jih operacijski sistem preprosto ne podpira.
- Včasih je bilo, da je vsak brskalnik namestil vtič, toda to ni več tako, mnogi pa celo odstranjujejo vtičnik zaradi težav. Plus, sploh ni na voljo na priljubljeni platformi iOS.
Platno je koristno, tudi če niste načrtovali uporabe Flash
Eden od glavnih razlogov, zakaj je element CANVAS tako zmeden, je, da so se mnogi oblikovalci navadili na popolnoma statično splet. Slike so lahko animirane, toda to je storjeno z GIF in seveda lahko vdelate video na strani, toda statični video, ki preprosto sedi na strani in morda začne ali ustavi zaradi interakcije, toda vse je to.
Element CANVAS vam omogoča, da dodate toliko več interaktivnosti na svoje spletne strani, saj zdaj lahko grafično, sliksko in dinamično krmilite s skriptnim jezikom. Element CANVAS vam omogoča, da slike, fotografije, grafikone in grafise spremenite v animirane elemente.
Kdaj razmisliti o uporabi Elementa Canvas
Občinstvo bi moralo biti vaš prvi premislek, ko boste odločali, ali boste uporabili element CANVAS.
Če vaša občinstvo uporablja predvsem Windows XP in IE 6, 7 ali 8, potem bo ustvarjanje funkcije dinamičnega platna nemogoče, saj ti brskalniki tega ne podpirajo.
Če gradite aplikacijo, ki se bo uporabljala samo v napravah Windows, potem je Flash najboljša izbira. Aplikacija Silverlight bi lahko koristila aplikaciji, ki bo uporabljena v računalnikih z operacijskim sistemom Windows in Mac.
Če pa je treba vašo aplikacijo pregledati v mobilnih napravah (tako v napravah s sistemom Android in iOS) kot tudi v sodobnih namiznih računalnikih (posodobljena na najnovejše različice brskalnika), potem je uporaba elementa CANVAS dobra izbira.
Upoštevajte, da lahko z uporabo tega elementa omogočite nadomestne možnosti, kot so statične slike za starejše brskalnike, ki jih ne podpirajo.
Vendar pa ni priporočljivo uporabiti HTML5 platna za vse. Nikoli ga ne smete uporabljati za stvari, kot je vaš logotip, naslov ali navigacija (čeprav je uporaba animiranega dela katerega koli od teh v redu).
V skladu s specifikacijo morate uporabiti elemente, ki so najbolj primerni za tisto, kar poskušate graditi. Torej, z elementom HEADER skupaj s slikami in besedilom je boljši element CANVAS za glavo in logotip.
Če ustvarjate spletno stran ali aplikacijo, ki naj bi se uporabljala v neinteraktivnem mediju, na primer tiskanju, se morate zavedati, da element CANVAS, ki je bil dinamično posodobljen, morda ne bo tiskal, kot pričakujete. Morda boste prejeli natis trenutne vsebine ali nadomestne vsebine.