Pengertian HTML5

Apa itu HTML?

HTML adalah singkatan dari HyperText Markup Language, yang merupakan bahasa yang digunakan untuk membuat suatu halaman web. HTML menggambarkan struktur dari suatu halaman web yang ditulis dengan elemen atau tag sesuai dengan konten teks di dalamnya.
Dikutip dari AgenBolaHebat.com , penjelasan lebih rinci tentang HTML adalah sebagai berikut:

  1. Hypertext adalah istilah teks aset, yang ketika diklik akan menuju ke halaman lainnya. Ini adalah kemampuan dari suatu halaman web agar dapat saling berhubungan antara halaman satu sama lain.
  2. Markup: Sebuah tag, yang biasanya dimulai dengan tag pembuka (opening tag) dan penutup (closing tag) yang memberikan kemampuan untuk mengatur desain atau format struktur isi website teks sederhana dalam file HTML.
  3. Language: bahasa yang digunakan HTML. Label perintah menggunakan bahasa yang dapat dimengerti oleh browser atau interpreter lainnya.
    HTML bukan merupakan bahasa pemrograman pada umumnya, seperti Java, C, C ++, Visual Basic, dan sejenisnya. Namun HTML5 merupakan bahasa markup yang menggunakan tag dan element yang terkandung untuk ditampilkan pada halaman web di browser HTML atau interpreter (penerjemah HTML) lainnya.

Apa itu HTML5?

HTML5 merupakan singkatan dari HyperText Markup Language versi 5, dan merupakan penerus dari HTML 4, XHTML1, dan DOM Level 2 HTML. HTML5 merupakan pengembangan bahasa HTML yang lebih baik yang sebelumnya merupakan bahasa markup sederhana. HTML5 merupakan sebuah teknologi penerus dari generasi sebelumnya yang dirilis oleh W3C (World Wide Web Consortium) dan WHATWG (Web Hypertext Application Technology Working Group).

Apa saja fitur baru di HTML5?

  • New Semantic Elements : Ini seperti pada elemen <header>, <footer>, and <section>.
  • Forms 2.0 : Perbaikan form web HTML di mana atribut baru telah diperkenalkan tag <input>.
  • Persistent Local Storage : untuk menghilangkan ketergantungan pada plugin pihak ketiga.
  • WebSocket : Sebuah generasi teknologi terbaru komunikasi dua arah untuk aplikasi web.
  • Server-Sent Events : memperkenalkan even yang mengalir dari web server ke web browser yang disebut Server-Sent Events (SSE).
  • Canvas : Ini mendukung gambar dua dimensi surface yang dapat diprogram dengan JavaScript.
  • Audio & Video : Anda dapat menanamkan/embed audio atau video pada halaman web Anda tanpa menggunakan plugin pihak ketiga.
  • Geolocation : Pengunjung dapat memilih untuk berbagi lokasi fisik mereka dengan aplikasi web Anda..
  • Microdata : Anda membuat kosakata sendiri di luar HTML5 dan menambah halaman web Anda dengan kostum semantics.
  • Drag and drop : Drag dan drop item dari satu lokasi ke lokasi lain pada halaman web yang sama.

Apa Kegunaan HTML?

HTML berguna untuk menampilkan konten, menghubungkan (link) antara halaman, struktur dan informasi terkait ke halaman web. Isi web tidak hanya terbatas pada teks saja, tetapi konten interaktif lainnya seperti video, audio, gambar dan animasi dapat dimasukkan dan ditampilkan pada halaman web.

List Pemutar Audio Berbasis HTML5 Terunggul yang Mudah Dipakai.
Audio Player

List Pemutar Audio Berbasis HTML5 Terunggul yang Mudah Dipakai.

HTML5 sudah menjadi standar untuk sebuah desain web multimedia, menggantikan pendahulunya yakni plugin Flash dan plugin Silverligh. Ini dikarenakan HTML5 memberikan dukungan untuk elemen halaman audio dan video yang telah membawa semua standar, seperti manfaat SEO dan cache offline.

Keunggulan HTML5 lainnya juga merupakan kemudahannya dalam beradaptasi pada platform yang berbeda-beda. Sehingga ini menciptakan design, develop, dan deploy pemutar audio kustom jauh lebih gampang apabila dibandingkan pada masa lalu. Tak kurang disitu saja, HTML5 juga lebih efisien lantaran dapat bekerja pada desktop, seluler, dan berbagai sistem operasi.

Lantaran HTML5 menjuarai semua web multimedia Toto Online Iblis4d, banyak pengembang audio menggunakan HTML5 sebagai basisnya. Berikut merupakan list pemutar audio berbasis HTML5 terunggul yang mudah dipakai.

Ultimate Responsive HTML5 Audio Player

HTML5 audio player responsif ini merupakan pilihan terbaik dengan API yang apik dan tampilan pemutar yang tidak terbatas. Anda dapat menggunakan pemutar audio ini dengan cara apapun sesuai dengan apa yang anda ekspetasikan. Dalam bentuk dan fungsi, audio ini mempunyai banyak pilihan dan merupakan pilihan yang tepat untuk podcast, SoundCloud, dan lainnya.

Ultimate Responsive HTML5 Audio Player

Single jQuery Audio Player

Pemutar audio ini memiliki desain bersih serta mempunyai fitur unik tersendiri, Single jQuery Audio Player pun terdiri dari 2 yakni musik dan radio yang merupakan solusi tepat untuk live streaming dan artis musik. Tidak sampai disitu saja, pemutar audio berbasis HTML5 ini juga dapat secara otomatis melakukan ‘pause’ dan ‘stop’ apabila pemutar lain aktifkan di halaman yang sama. Dengan desain yang optimal beserta API yang unggul, Single jQuery Audio Player(Music dan Radio) merupakan salah satu pemutar audio HTMl5 terbaik tuk musisi maupun live streaming.

Single jQuery Audio Player

DS SoundCloud

Apabila anda adalah salah satu penyuka musik yang sering menstreaming musik di SoundCloud, tetapi ingin menggunakan pemutar bergaya anda sendiri. Anda dapat menggunakan DS SoundCloud Custome Musik Player. Pemutar audio ini adalah plugin jQuery dinamis yang dirancang tuk membuat streaming audio asli pada situs web, memakai HTML5 dan jQuery. DS SoundCloud dirancang pada dasar teknologi SoundCloud yang dapat digunakan sebagai pemutar SoundCloud yang telah di Embed.

DS SoundCloud

ZoomSound

ZoomSounds-Neat HTML5 Audio Player banyak penggunanya lantaran dengan alasan yang sangat jelas. Dengan desainnya yang condong ke SoundCloud, ia menawarkan beberapa gaya dan skin yang berbeda yang memudahkan mendesain player anda sesuka hati. Zoom Sound juga memberikan fitur SEO Friendly, mendukung stream SoundCloud dengan kunci API, dapat streaming audio youtube, optimasi touch, Full Responsif dengan Adobe Flash, dan banyak lagi yang dapat membuat anda ingin menggunakannya.

ZoomSound

Beberapa Project HTML5 yang Paling Populer dan Sering Digunakan.
Canvas

Beberapa Project HTML5 yang Paling Populer dan Sering Digunakan.

Tak diragukan lagi, HTML5 adalah pilihan terunggul untuk mengembangkan aplikasi berbasis multimedia. HTML5 mempunyai fitur yang bisa dibilang ‘lengkap’ untuk mendukung sebuah teknologi web. Sebagai contoh, HTML5 memberikan dukungan terbaik dalam grafis berbasis vektor dan beberapa fitur online interaktif seperti sharing file maupun foto atau video editing. HTML5 Dewapoker88 pun dapat memungkinkan anda dalam melakukan streaming audio dan video pada browser tanpa memerlukan plugin tambahan dari pihak ketiga, sehingga pada saat anda melakukan streaming koneksi menjadi lebih cepat.

Dengan berkembangnya perangkat-perangkat pintar dengan berbagai ukuran layar serta resolusi, HTML5 membuat pengguna dapat merasakan pengalaman berselancar internet terasa nyaman dan efisien untuk semua model perangkat. Nah, berikut ini merupakan beberapa project HTML5 yang paling populer dan sering digunakan baik itu untuk orang yang awam maupun orang yang telah lama mengenal html5.

Canvas Carousel HTML5

Canvas Carousel merupakan pilihan project terbaik berbasis html5 untuk menampilkan gambar-gambar anda. Galeri foto model 3D berbentuk putaran atau carousel memberikan enam pilihan untuk menampilkan foto-foto anda. Project ini apabila sudah dioptimalkan untuk penggunaan pada perangkat Android dan iOS sangatlah mudah di konfigurasi sesuai kebutuhan, semua pilihan dapat diatur melalui file XML.

Canvas Carousel HTML5

Pemutar Audio Playlist HTML5

Apabila anda ingin mencari pemutar audio, mungkin pemutar audio playlist HTML5 merupakan pilihan terbaik. Lantaran pemutar audio ini memberi anda berbagai pilihan playlist, yakni playlist XML, Podcast, SoundCloud, markup HTML, dan hal lainnya. Dalam unduhan juga diberikan beberapa demo yang dapat anda gunakan sebagai contoh.

Pemutar Audio Playlist HTML5

Responsive CSS Grid HTML5

Mungkin banyak pilihan desain sistem grid untuk halaman web, namun Responsive CSS Grid HTML5 adalah yang terunggul dalam hal kemudahan untuk membuat website dalam waktu yang paling singkat. Project sistem ini juga kompatibel dengan Chrome, Mozilla Firefox, Safari, IE10/11 serta iOS dan Android.

Responsive CSS Grid HTML5

Plugin jQuery Real3D Flipbook

Plugin ini merupakan project HTML5 yang paling wajib anda coba. Hal ini disebabkan plugin ini adalah salah satu terfavorit di CodeCanyon, plugin ini membantu penggunanya agar secara mudah dapat menciptakan majalah dan brosur dengan efek halaman berbentuk lipatan 3D realistik. Setelah anda mengunduh plugin ini, anda dapat melakukan pengaturan sesuai dengan keinginan, ada banyak sekali pilihan template yang tersedia dan membuat halaman web lebih interaktif yang dapat dilengkapi dengan link, tombol,video, pemutar audio, dan hal lainnya.

Plugin jQuery Real3D Flipbook

Interactive World Map

Interactive world map merupakan sebuah project yang sangat menarik. Seperti namanya project ini adalah peta yang memungkinkan anda menambah tanpa batas tempat-tempat yang dapat diklik dimana saja pada peta. Dimulai dari dapat menambahkan foto, link, beserta deskripsi-deskripsi pada saat pointer melewati suatu titik.

Interactive World Map

Perbandingan Flash dan HTML5 pada Game
Flash Game Game List Html5 Game

Perbandingan Flash dan HTML5 pada Game

 

Bermain game online langsung di browser adalah salah satu kegiatan waktu luang yang sangat populer untuk dilakukan. Banyak orang melakukannya untuk alasan praktis, karena tidak perlu membeli permainan yang akan diinstal pada perangkat dan dapat dimainkan secara langsung pada aplikasi browser setiap kali diinginkan. Alasan lain adalah banyak game baru yang dirilis setiap hari oleh pengembang game di seluruh dunia, bukan sebagai konsol game yang hanya merilis beberapa waktu. Mungkin Anda adalah salah satu dari orang-orang yang tidak pernah atau bahkan hobi game online permainan browser. Teknologi yang digunakan untuk bermain game telah berkembang dari waktu ke waktu dan perkembangan teknologi. Dua raja teknologi di game online ini adalah Flash dan HTML5. Apa bedanya?

Flash

Teknologi flash sangat populer di awal perkembangan Internet saat ini. Flash banyak digunakan untuk menampilkan halaman website interaktif dan game online. Teknologi ini memiliki tampilan yang sama pada semua perangkat, jadi jika Anda melihat konten Flash di komputer, kemudian ditampilkan pada perangkat mobile, bahkan tampilan akan terlihat sama persis.

YouTube adalah contoh dari sebuah situs web yang menggunakan teknologi Flash untuk menampilkan video di Internet. Demikian pula dengan game online, contoh permainan Flash yang Anda kenal tentu Angry Birds. Ya, permainan dengan banyak burung berwarna-warni dalam misi ini untuk menghancurkan babi hijau jahat yang mencuri telur mereka. Untuk melihat konten Flash atau bermain game flash pada aplikasi browser, Anda harus menginstal plug-in disebut Adobe Flash Player. Plug-in biasanya sudah terdapat beberapa aplikasi browser, atau Anda dapat men-download langsung di website resminya.

HTML5

HTML5 meningkat popularitasnya sejak keputusan Steve Jobs tidak mendukung Flash pada perangkat iOS dan ketika Youtube membuat transisi dari penggunaan asli teknologi Flash untuk menampilkan video ke HTML5 pada situs desktop.

HTML5 banyak digunakan untuk pemrograman saat ini oleh webmaster untuk membuat website. HTML5 menggunakan pendekatan yang berbeda dengan Flash dalam penerapannya. Untuk game, HTML5 mengirim API untuk menampilkan teknologi tertentu seperti WebGL dan Canvas. Selain dapat digunakan untuk bermain di web game online, HTML5 dapat digunakan untuk membuat konten yang sangat dinamis karena website statis sudah sangat tradisional dan jumlah pengunjung lebih tertarik dalam berinteraksi dengan sesuatu yang “hidup” dan representatif.

Unit WebGL merupakan salah satu teknologi memainkan game online yang menjadi lebih populer setiap hari. Teknologi ini memungkinkan untuk menampilkan konten menggunakan unit sebagai Javascript dengan menggunakan HTML5 dan WebGL render; karena menggunakan teknologi HTML5, permainan bisa dimainkan dengan teknologi ini dalam aplikasi browser. Game disajikan akan menggunakan kemampuan dari kartu video (VGA) yang terhubung ke laptop atau bahkan meningkatkan kualitas gambar dan kinerja. WebGL juga mampu menghasilkan kualitas grafis 3D yang dapat disandingkan dengan konsol game. Contoh dari game online dengan WebGL adalah Combat Reloaded, penembak 3D dengan fitur multiplayer.

Kesimpulan

Di atas dua teknologi tersebut, Flash dan HTML5 adalah teknologi yang dapat digunakan untuk membuat konten digital yang baik. Flash telah terputus begitu lama, sementara HTML5 adalah teknologi yang relatif baru dan juga memiliki potensi yang baik. Mereka berdua memiliki kelebihan dan kekurangan, tetapi jika Anda melihat kurangnya dukungan tambahan untuk perangkat mobile, di mana pengguna meningkat, kita dapat mengatakan HTML5 adalah teknologi yang lebih baik untuk dipilih dan dikembangkan.

Beberapa Langkah-Langkah yang Harus di Perhatikan untuk Membuat Game Menggunakan HTML5
Game List Html5 Game

Beberapa Langkah-Langkah yang Harus di Perhatikan untuk Membuat Game Menggunakan HTML5

Membuat game pada jaman yang modern ini sudah tergolong mudah, sebab hanya menggunakan html5 saja dan tanpa menggunakan java sudah dapat membuat sebuah game sederhana. Hal ini tentu sangat menguntungkan bagi pengembang aplikasi yang sudah sangat mengenal bahasa HTML pada saat ingin membuat game di android ataupun lainnya.

Untuk membuat game di android menggunakan html5, salah satu caranya merupakan dengan menggunakan Intel XDK. Apabila anda sebelum sudah mengetahui membuat web game menggunakan html5, hanya perlu mengubah beberapa bagian kodingan saja supaya game-nya dapat lancar pada saat di jalankan di android.

Dengan menggunakan intel xdk, anda bisa menggunakan kodingan html5 yang sudah ada walaupun didesain untuk web atau anda dapat membuat kodingan sesuai dengan selera anda. Adapun beberapa langkah-langkah yang dapat di perhatikan sebelum membuat game menggunakan html5 adalah sebagai berikut.

-Canvas, Ini merupakan bagian terpenting di game sebab menjadi wadah dimana anda menggambar grafis-grafis untuk menganimasikan game yang telah anda buat.

-Jquery Mobile digunakan untuk memperindah penampilan aplikasi dan supaya komponen-komponen html5 lebih optimal untuk interaksi melalui sentuhan pengguna di laya sentuh perangkat mereka.

-Event onTouchStart element ini berfungsi untuk mendeteksi apabila sebuah komponen html5 disentuh oleh seseorang diperangkatnya.

-Java Script digunakan untuk mayoritas penulisan logika di game supaya game yang anda ciptakan dapat berfungsi seperti yang ditujukan.

-onDeviceReady ini bertujuan untuk sebagai tempat dimana programmer mulai memasukkan langkah-langkah pemrogramannya.

Untuk penjelasan lebih lanjut mengenai detail kodingan dari logic pemrograman untuk membuat game sudah ada pada baris komentar di kodingan dalam source code. Logika dalam kodingan tidaklah terlalu kompleks dan gampang dipahami apabila anda sudah mempunyai dasar matematika yang bagus. Pengembangan game menggunakan intel xdk tidak hanya untuk platform android melainkan anda juga dapat memakainya untuk platform lain seperti iOS dan windows phone tanpa harus mengubah kodingan.

Jenis-Jenis Game Berbasis HTML5 yang Paling Populer Saat Ini
Canvas Game List Html5 Game

Jenis-Jenis Game Berbasis HTML5 yang Paling Populer Saat Ini

Memainkan game online pada perangkat handphone merupakan salah satu kegiatan mengisi waktu luang yang paling populer dilakukan. Banyak orang melakukannya sebab karena kepraktisannya yang tidak perlu membeli game untuk dipasang pada perangkat, dan dapat langsung dimainkan pada aplikasi peramban kapan pun diinginkan. Namun, tahukah anda bagaimana sistem kerja online game? banyak online yang sudah berbasis html5.

HTML5 sendiri merupakan revisi kelima dari html, yang dapat disebut sebuah bahasa markah untuk menstrukturkan teknologi inti dari internet. Adanya hmtml5 mengubah segalanya, walaupun web umumnya menyetujui bahwa flash dan html5 mempunyai kelebihan dan spesialisasinya sendiri. Namun harus diketahui bahwa banyak web developer maupun pengembang game online sekarang cenderung menggunakan html5 ketimbang flash.

HTML5 juga lebih banyak digunakan karena html5 memiliki banyak fitur-fitur optimal dan keren seperti element Canvas, Audio, dan Video untuk membuat web-game tanpa menggunakan Flash, dan anda tidak membutuhkan lagi plug-in agar dapat bermain game. Lalu, apa saja jenis-jenis game berbasih html5 terbaru yang paling populer saat ini? berikut beberapa yang sudah kami rangkum.

-Agent 008 Ball, game biliar yang berbasis html5 ini paling banyak dimainkan sebab tidak membuat perangkat anda terasa lagging dan memiliki fitur unik seperti bom waktu pada saat bermain.

– Web Snooker yakni game snooker online yang dapat anda mainkan bersama teman-teman anda, apabila anda merasa bosan bermain snooker sendirian.

-Angry Birds Chrome untuk game ini pastilah semua orang tahu, game yang mengalahkan babi hijau jahat yang mencuri telur dari burung yang memiliki ragam warna. Game ini sendiri sudah dapat dimainkan di web yang menggunakan html5 dan pada saat bermain terasa lebih optimal.

-Canvas Rider yaitu permainan sepeda dengan trek yang ekstrem dan ditarik oleh pemain, game ini paling populer sebab dapat membuat anda ingin memainkannya lagi.

– Pac-Man Google Chrome, siapa yang tak mengenal game legenda ini. Ya, game ini sekarang dapat dimainkan pada web-game yang sebenarnya pada saat diciptakan menggunakan html5 untuk menciptakan logo animasi tuk permainan 30th anniversary pada tanggal 22 mei 2010 lalu.

Ingin Belajar Pemrograman Grafis dan Game, Wajib Mengenal HTML Canvas Terlebih Dahulu
Canvas Flash Game Html5 Game

Ingin Belajar Pemrograman Grafis dan Game, Wajib Mengenal HTML Canvas Terlebih Dahulu

Sebelum kedatangan HTML5, game dan elemen multimedia lainnya yang disajikan dalam browser menggunakan flash. Banyak game yang menggunakan flash dapat dimainkan pada browser, bahkan flash pun digunakan untuk memutar video di youtube apabila tidak ada flash maka video tak dapat di berjalan.

Akan tetapi semuanya itu berubah semenjak adanya html5. HTML5 memiliki banyak elemen baru yang lebih optimal ketimbang flash pada browser, yang salah satunya adalah canvas. Pada situs ini, canvas merupakan alat yang digunakan sebagai wadah untuk menggambar dan melukis, yang biasanya menggunakan pensil dan cat. Dalam pemrograman, canvas adalah elemen yang dapat digambar dengan banyak kode.

Elemen canvas pada html5 merupakan tag HTML yang hampir sama dengan tag

atau

dengan pengecualian apabila kontennya dirender menggunakan javascript. Untuk memanfaatkan canvas html5, anda harus menempatkan tag kanvas di suatu tempat dalam domen html, mengakses tag menggunakan javascript, menciptakan context, dan selanjutnya memanfaatkan HTML5 Canvas API untuk menggambar sesuatu.Pada saat anda ingin menggunakan canvas, wajib untuk mengetahui perbedaan antara elemen canvas dan context canvas, lantaran sering kali banyak yang bingung tentang keduanya. Elemen canvas merupakan DOM node yang sebenarnya ada lantaran disematkan di halaman html.

Context canvas yaitu objek dengan properti dan metode yang berfungsi sebagai merender grafik di dalam elemen canvas, context nya dapat 2D maupun 3D atau webgl.Setiap elemen canvas hanya dapat memiliki satu context. Apabila anda menggunakan metode getContext beberapa kali, hal tersebut akan mengembalikan referensi ke objek context yang sama. Adapun contoh sederhana dalam menggunakan canvas pada HTML5 yaitu:

<style>
body { margin: 0px; padding: 0px;}
</style>

<canvas id=”myCanvas” width=”578″ height=”200″></canvas>
<script>
var canvas= document.getElementByid(‘myCanvas’);
var context= canvas.getContext(‘2d’);
context.font=’40pt Calibri’;
context.fillStyle=’blue’;
context.fillText(‘Hello World!’, 150, 100);
</script>