Mengenal HTML dan HTML 5

Mengenal HTML dan HTML 5

Mengenal HTML dan HTML 5MENGENAL HTML DAN HTML 5

HTML dan HTML 5 – Bagi Anda yang baru saja masuk di dunia web design, pasti akan lebih sering menemukan istilah ‘markup’. Nah bagi Anda juga yang belum mengetahui apa itu markup, markup ini memiliki fungsi untuk proses, penentuan dan keberadaan text; tag embedding dan anotasi text dibawa oleh file styled untuk membuat manipulasi text mudah bagi komputer.

Apa itu HTML?

HTML atau Hyper-Text Markup Language bisa dibilang merupakan bahasa utama dunia website. Umumnya halaman web yang beradad di internet ditulis dengan variasi HTML. Lewat HTML, developer bisa memastikan multimedia, text dan link bisa tampil di browser menyatu dengan elemen lainnya. Dari elemen yang membuat hubungan ke dokumen Anda (hypertext) hingga ke elemen yang membuat dokumen menjadi interaktif, semuanya merupakan kesatuan dari HTML.

Standard dalam HTML diciptakan oleh W3C atau World Wide Web Consortium pada tahun 1997. Dalam HTML, tag digunakan untuk menentukan struktur; tag dan elemen didefenisikan dengan menggunakan karakter < dan >. Beberapa contoh tag yang telah disebutkan sebelumnya adalah heading, table, paragraf, dll. Browsers bertanggung jawab untuk me-render halaman website melalui tag ini. Sudah sejak lama, HTML menjadi bukan satu-satunya standard development. Belakangan ini, semua content dan tag untuk style dihadirkan dalam bahasa yang besar dan cukup kompleks. Akhirnya, W3C memutuskan bahwa pemisahan antara content dan style pada website, sangat dibutuhkan; yang kemudian mengantarkan kepada terciptanya style sheets. Seaat ini, tag yang digunakan untuk mendefenisikan style dari dokumen (misalnya Font) sudah mulai ditinggalkan karena orang lebih memilih menggunakan style sheets dan hanya tag yang terkait dengan penentuan content saja yang masih digunakan sebagai inti HTML.

HTML sudah mengalami banyak pembaharuan selama ini dan saat ini, versi HTML terbaru adalah HTML5. HTML5 menjadi bahasa markup primadona saat ini dan telah memiliki penambahan banyak fitur dari HTML biasa serta menghilangkan beberapa kekakuan yang ada pada XHTML. Setiap hari, fitur baru ditambahkan ke HTML5 meskipun tidak ada perubahan versi khusus di setiap rilisnya. Perbedaan utama antara HTML dan HTML5 buka di audio atau video, namun di keseluruhan HTML dimana keduanya merupakan bagian dari HTML5.

History of HTML

Apa perbedaan utama antara HTML dan HTML5 ?

Satu hal yang konsisten tentang bidang IT adalah update periodik / perubahan merupakan hal yang tak terelakkan. Tidak ada bahasa yang tidak pernah di-upgrade atau memiliki rilis baru. Begitu juga dengan HTML, tidak terkecuali. HTML5 ini dirilis dengan tujuan utama meningkatkan pengalaman ber-internet untuk pengembang dan pengguna seperti Anda. Seperti yang telah disebutkan sebelumnya, manfaat terbesar yang dimiliki oleh HTML5 jauh lebih banyak dari pendahulunya, salah satunya adalah memiliki dukungan audio tingkat tinggi dan video yang bukan bagian dari spesifikasi versi di HTML sebelumnya. perbedaan lain antara HTML dan HTML5:

SVG, canvas dan grafis vektor virtual lainnya didukung oleh HTML5, sedangkan di HTML, penggunaan grafis vektor hanya mungkin dilakukan dengan menggunakan bantuan teknologi lain seperti Flash, VML, dan Silver-light, dll

HTML5 menggunakan database SQL web, aplikasi cache untuk penyimpanan sementara, sedangkan, dalam HTML hanya cache browser yang bisa dimanfaatkan untuk tujuan ini.

Perbedaan lain antara HTML dan HTML5 adalah, versi sebelumnya tidak mengizinkan JavaScript untuk berjalan dalam browser (justru berjalan di thread antarmuka browser) sedangkan yang HTML5 mendukung penuh JavaScript bisa berjalan di background.

HTML5 tidak berbasis pada SGML.

Dalam HTML5, inline MathML dan SVG bisa digunakan dalam teks sedangkan dalam HTML tidak memungkinkan.

Beberapa elemen usang yang kini telah dihapuskan adalah: isindex, noframes, acronym, applet, basefont, dir, font, frame, frameset, big, center, strike, tt.

HTML5 mendukung form control yang baru, misalnya: tanggal dan waktu, email, nomor, range, tel, url, pencarian, dll

Ada banyak elemen baru yang diperkenalkan dalam HTML. Beberapa yang paling penting adalah: summary, time, aside, audio, command, data, datalist, details, embed, wbr, figcaption, figure, footer, header, article, hgroup, bdi, canvas, keygen, mark, meter, nav, output, progress, rp, rt, ruby, section, source, track, video.
Difference Between HTML and HTML5

Manfaat HTML5 bagi Developer

HTML5 ingin agar developer mendapatkan lebih banyak fleksibilitas dalam mendesain website dan karena itu justru banyak perkembangan yang signifikan dan layak dibanggakan:

1. Penanganan error yang persisten:

Kebanyakan web browser memiliki kemampuan untuk mem-parse kode HTML yang salah baik secara struktural/sytatic. Namun, hingga beberapa tahun yang lalu, belum ada sama sekali proses yang terstandarisasi unntuk menangani hal ini. Artinya, browser developer harus melukan test HTML di browser yang berbeda untuk membuat penanganan error yang lebih baik melalui reverse engineering. Penanganan error HTML5 yang konsisten kini memberikan banyak solusi untuk hal ini.

Algoritma parsing yang lebih berkembang yang digunakan di HTML5 memiliki banyak manfaat. Survey membuktikan bahwa sekitar 90% website rentan terhadap kode yang salah. Dengan ini, penanganan error yang ada bisa membantu developer dalam pengerjaan.

2. Semantic yang lebih baik untuk element:

Untuk mengembangkan kode, pengembangan dilakukan jug auntuk peran semantic dari berbagai element yang ada. Section, article, nav dan header merupakan beberapa element baru yang kini menggantikan element div dan ini membuat proses perbaikan error menjadi lebih mudah.

3. Dukungan lebih lanjut untuk fitur web application

Salah satu tujuan utama dari HTML adalah agar browser bisa berfungsi sebagai platform aplikasi. Website sebelumnya digunakan untuk penggunaan yang tidak terlalu kompleks, namun kini kebutuhannya semakin tinggi. HTML5 menyediakan kendali penuh kepada developer untuk mengatur performa website mereka. Sebelumnya, web developer harus menggabungkan beberapa teknik karena banyak teknologi server-side dan ekstensi browser belum tersedia. Namun sekarang, dengan HTML5, penggunaan teknik berbasis JS ataupun Flash tidak terlalu dibutuhkan karena sudah tersedia element yang mampu menangani semua itu di HTML5.

4. Website responsive di mobile menjadi lebih mudah

Bahkan hari ini, membuat versi mobile dari sebuah website bisa membuat developer pusing. Pertumbuhan penggunaka smartphone saat ini perlahan terus meningkat, dan hal tersebut mendorong pengembangan standard yang lebih dari HTML. Pengguna ingin bisa mengakses website kapan pun dan dengan perangkat apapun. Hal inilah yag kemudian menjadikan website responsive menjadi semakin dibutuhkan. HTML5 memberikan dukungan untuk perangkat mobile dengan jauh lebih sederhana, sehingga juga bisa berjalan baik di perangkat elektronik seperti table maupun smartphone.

5. Elemen canvas

Salah satu fitur yang paling banyak dibicarakan tentang HTML5 adalah elemen canvas. Dengan menggunakan elemen canvas, developer bisa menggambar menggunakan warna dan bentuk yang berbeda, dengan memanfaatkan script (misalnya JavaScript). Layak dikatakan bahwa canvas mengandung container gambar dan untuk membuat gambar, script akan dijalankan. Salah satu contoh script yang terkait dengan canvas adalah seperti ini:

<canvas id=”TestCanvas” width=”200″ height=”100″></canvas>
var c = document.getElementById(“TestCanvas”);
 
var context = c.getContext(“2d”);
 
context.fillStyle = “#FF0000”;
 
context.fillRect(0,0,140,75);

6. Elemen menu

Elemen dan merupakan bagian dari spesifikasi elemen yang interaktif, namun tidak sering digunakan atau dibicarakan oleh komunitas developer. Bagaimanapun, 2 item ini layak digunakan untuk meningkatkan interaksi pada web.Tag digunakan unutuk merepresentasikan perintah menu di aplikasi mobile dan desktop, agar lebih sederhana. Penggunaannya seperti ini:

    <body contextmenu=”new-menu”>
 
    <menu id=” new-menu” type=”context”>
 
    <menuitem>Hello!</menuitem>
 
    </menu>
   </body>

7. Atribut data yang mudah dikustom:

Memang memungkinkan, bila Anda ingin menambahkan atribut khusus sebelum HTML5, namun sering kali itu berisiko; misalnya, di HTML4, atribut custom kadang-kadang berhenti me-render halaman dengan baik, dan ini sering kali menjadi penyebab dokumen menjadi salah. Atribut data- * di HTML5 menjadi solusi untuk hal ini. Ada beberapa kegunaan atribut ini, namun tujuan utamanya adalah sebagai penyimpanan informasi tambahan tentang elemen yang berbeda. Sekarang, data kustom dapat dimasukkan, dan memberikan developer kemungkinan untuk membuat halaman web yang menarik dan efisien tanpa harus menggunakan pencarian data di sisi server atau panggilan via Ajax.8. CookiesDukungan terhadap penyimpanan lokal merupakan fitur yang paling signifikan di HTML5. Sebelum ada HTML5, jika developer ingin menyimpan apapun, mereka harus memanfaatkan cookies. Cookies bisa menyimpan sedikit data (walaupun banyak orang membencinya) dan ini membuat penambahan object localStorage ke HTML5 menjadi sangat bermanfaat. Object localStorage adalah bagian dari global window namespace dan bisa diakses darimanapun yang diinginkan saat menggunakan script.

HTML5 Cheat Sheet

Cheat sheet bisa sangat berguna jika Anda baru mulai belajar bahasa baru. GUnakan cheat sheet HTML5 berikut ini untuk mulai mempelajari HTML5. Semua tag yang paling sering digunakan dalam HTML dan HTML5 ada disini.

HTML5 Cheat Sheet

Manfaat HTML5

HTML5 membawa pergeseran paradigma untuk developer maupun pengguna biasa. Beberapa diantaranya adalah:

  1. Browser di perangkat mobile lebih jarang crash daripada native application. Hal ini tidak terjadi sebelumnya, saat dimana HTML belum terlalu mendukung pengembangan mobile web.
  2. Ketergantungan pada website mobile sangat tinggi karena hampir 30 persen dari pengguna ponsel tidak suka mendownload aplikasi. Jadi saat ini jika pengguna ingin menggunakan jasa perusahaan tetapi tidak ingin men-download aplikasi mereka, mereka bisa langsung login ke website perusahaan untuk melakukannya.
  3. Pengurangan akan kebutuhan penggunaan Adobe Flash memungkinkan pengembang untuk memberikan pengalaman pengguna yang kaya dengan keindahan grafis. Penggunaan JavaScript dan MPEG4 dalam hubungannya dengan HTML5 membuat semuanya lebih baik.
  4. Kemampuan untuk mendukung elemen audio dan video, artinya pengguna tidak perlu lagi mendownload plugin tambahan untuk menjalankan multimedia di website Anda. Dukungan terhadap rich media yang disediakan oleh HTML5 ini adalah salah satu alasan terbesar mengapa ini lebih sering digunakan daripada HTML5 biasa.

Kesimpulan

Seiring dengan berjalannya waktu, developer akan mendapatkan banyak manfaat dari HTML5. Dengan gelombang perubahan yang menghampiri developer di seluruh dunia, diharapkan adopsi HTML5 terhadap meningkat di tahun-tahun yang mendatang. Untuk memaksimalkan potensi browser modern, sangat penting untuk mengadopsi HTML5 secepat mungkin.

JOGJA ONE SOLUTION – Kami hadir memberi solusi untuk kebutuhan media promosi bisnis atau usaha Anda. Grafik order dan omzet meningkat. Dapatkan website murah, desain menarik, kompleks, dan full maintenance dengan harga yang terjangkau KLIK DISINI. Atau hubungi kami di Telp (0274) 5017127 | WA : 0888 0289 8802


Digital Content Writer, Special Content Creator, Technical Content Writer dan Suka berbagi hal baru yang bermanfaat bagi orang lain.

Recommended Posts

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

WhatsApp chat