Unsur ini Memiliki Manfaat Lebih Dari Teknologi Lain
HTML5 merangkumi elemen menarik yang dipanggil CANVAS. Ia mempunyai banyak kegunaan, tetapi untuk menggunakannya, anda perlu mempelajari beberapa JavaScript, HTML, dan kadang-kadang CSS.
Ini menjadikan elemen CANVAS agak menakutkan bagi banyak pereka, dan pada hakikatnya, kebanyakan mungkin akan mengabaikan elemen sehingga terdapat alat yang boleh dipercayai untuk membuat animasi dan permainan CANVAS tanpa mengetahui JavaScript.
Apa Kanvas HTML5 Digunakan Untuk
Elemen HTML5 CANVAS boleh digunakan untuk banyak perkara yang sebelumnya, anda terpaksa menggunakan aplikasi tertanam seperti Flash untuk menghasilkan:
- grafik dinamik
- permainan dalam talian dan luar talian
- animasi
- video interaktif dan audio
Malah, sebab utama orang menggunakan elemen CANVAS adalah kerana betapa mudahnya untuk menjadikan laman web biasa menjadi aplikasi web dinamik dan kemudian menukar aplikasi itu ke aplikasi mudah alih untuk digunakan pada telefon pintar dan tablet.
Jika Kami Memiliki Flash, Kenapa Kita Perlu Kanvas?
Menurut spesifikasi HTML5, elemen CANVAS ialah:
"... kanvas bitmap yang bergantung kepada resolusi, yang boleh digunakan untuk grafik graf, grafik permainan, seni, atau imej visual lain dengan cepat."Elemen CANVAS membolehkan anda menggambar grafik, grafik, permainan, seni, dan visual lain tepat pada halaman web dalam masa nyata.
Anda mungkin berfikir bahawa kita boleh melakukannya dengan Flash, tetapi terdapat dua perbezaan utama antara CANVAS dan Flash:
- Unsur CANVAS tertanam betul-betul di dalam HTML. Skrip yang menggambar di dalamnya sama ada dalam HTML atau dalam fail luaran yang dipautkan. Ini bermakna elemen CANVAS adalah sebahagian daripada model objek dokumen, atau DOM.
- Flash adalah fail luaran tertanam. Ia menggunakan sama ada EMBED atau elemen OBJECT untuk dipamerkan, dan tidak dapat berinteraksi terus dengan elemen HTML yang lain. Kerana elemen CANVAS adalah sebahagian daripada DOM, ia dapat berinteraksi dengan DOM dalam banyak cara.
- Sebagai contoh, anda mungkin membuat animasi yang berubah apabila sebahagian halaman lain berinteraksi - seperti elemen borang yang diisi. Dengan Flash, yang paling banyak anda boleh lakukan ialah memulakan filem atau animasi Flash, tetapi dengan CANVAS anda boleh membuat banyak kesan yang berbeza, walaupun menambah teks dari medan borang ke dalam animasi.
- Unsur CANVAS secara asalnya disokong oleh pelayar web. Agar pengguna benar-benar menggunakan Flash, pelayar mereka mesti memasang plugin. Ini sering menjadi masalah untuk kebanyakan orang disebabkan pemasangan Flash yang sudah lama atau fakta bahawa sistem operasi mereka tidak menyokongnya.
- Sudah tentu setiap penyemak imbas telah memasang plugin, tetapi itu tidak lagi berlaku, dan ramai juga mengeluarkan plugin kerana masalah. Plus, ia tidak boleh didapati di platform iOS popular.
Kanvas Berguna Walaupun Jika Anda Tidak Merancang Menggunakan Flash
Salah satu sebab utama mengapa unsur CANVAS begitu membingungkan ialah banyak pereka telah digunakan untuk web sepenuhnya statik. Imej mungkin animasi, tetapi itu dilakukan dengan GIF, dan sudah tentu anda boleh membenamkan video ke dalam halaman tetapi sekali lagi, ia adalah video statik yang hanya duduk di halaman dan mungkin bermula atau berhenti disebabkan oleh interaksi, tetapi itu sahaja.
Elemen CANVAS membolehkan anda menambah lebih banyak interaktiviti ke laman web anda kerana sekarang anda dapat mengawal grafik, imej, dan teks secara dinamik dengan bahasa skrip. Elemen CANVAS membantu anda mengubah imej, foto, carta, dan graf ke elemen animasi.
Bila untuk Pertimbangkan Menggunakan Unsur Kanvas
Penonton anda harus menjadi pertimbangan pertama anda apabila memutuskan sama ada untuk menggunakan elemen CANVAS.
Sekiranya khalayak anda menggunakan Windows XP dan IE 6, 7, atau 8, kemudian membuat ciri kanvas dinamik akan menjadi sia-sia kerana penyemak imbas itu tidak menyokongnya.
Jika anda membina aplikasi yang akan digunakan pada mesin Windows sahaja, maka Flash mungkin menjadi pertaruhan terbaik anda. Aplikasi yang akan digunakan pada komputer Windows dan Mac boleh mendapat manfaat daripada aplikasi Silverlight.
Walau bagaimanapun, jika aplikasi anda perlu dilihat pada peranti mudah alih (kedua-dua Android dan iOS) serta komputer desktop moden (dikemaskini kepada versi pelayar terkini), kemudian menggunakan elemen CANVAS adalah pilihan yang baik.
Perlu diingat bahawa menggunakan elemen ini membolehkan anda mempunyai pilihan sandaran seperti imej statik untuk pelayar lama yang tidak menyokongnya.
Walau bagaimanapun, tidak disyorkan untuk menggunakan kanvas HTML5 untuk semuanya. Anda tidak boleh menggunakannya untuk perkara seperti logo, tajuk, atau pelayaran anda (walaupun menggunakannya untuk menghidupkan sebahagian dari mana-mana ini akan menjadi halus).
Menurut spesifikasi, anda harus menggunakan unsur-unsur yang paling sesuai untuk apa yang anda cuba bina. Oleh itu, gunakan elemen HEADER bersama-sama dengan imej dan teks adalah lebih baik untuk elemen CANVAS untuk header dan logo anda.
Selain itu, jika anda membuat halaman web atau aplikasi yang dimaksudkan untuk digunakan dalam medium yang tidak interaktif seperti pencetakan, anda harus menyadari bahwa elemen CANVAS yang telah diperbarui secara dinamik mungkin tidak mencetak seperti yang anda harapkan. Anda mungkin mendapat cetakan kandungan semasa atau kandungan sandaran.