Belajar HTML5 Dan Memahami HTML5


Apa itu HTML5?

Labkom99.com - Pendahulu draf HTML5 disebut Aplikasi Web 1.0. Ini diusulkan oleh WHATWG pada tahun 2004 dan diterima oleh W3C pada tahun 2007, dan tim kerja HTML baru dibentuk. Pada 22 Januari 2008, draf resmi pertama diumumkan dan secara resmi direkomendasikan kepada publik pada September 2010.

HTML5 menyediakan beberapa elemen dan atribut baru, seperti <nav>dan <footer>Label semacam ini akan memfasilitasi pengindeksan mesin pencari dan lebih membantu perangkat layar kecil dan orang tunanetra menggunakannya. Selain itu, ini juga menyediakan fungsi baru untuk elemen penelusuran lainnya, seperti <audio>dan <video>elemen.

Selain itu, dalam spesifikasi HTML5, beberapa tag HTML4 yang tidak terpakai akan dihapus, termasuk tag yang hanya menampilkan efek, seperti <font>dan <center>Mereka telah digantikan oleh CSS.


Perubahan tag HTML5

HTML5 belajar beberapa saran XHTML2, termasuk beberapa yang digunakan untuk memperbaiki struktur fungsional dari dokumen, seperti tag HTML baru headerfooterdialogasidefiguredan kegunaan lain, akan memungkinkan pencipta konten untuk membuat dokumen lebih semantik. Pengembang sebelum HTML5 menggunakannya pada kesempatan ini div.

HTML5 juga menyertakan beberapa upaya untuk memisahkan konten dan presentasi. Pengembang mungkin akan terkejut bahwa tag bdan imasih ada, tetapi artinya berbeda dari sebelumnya. Makna dari tag tersebut hanya untuk mengidentifikasi paragraf teks, bukan untuk Atur dengan gaya tebal atau miring. ufontcenterstrikeLabel ini telah dihapus sepenuhnya.

Di HTML5, objek masukan formulir baru telah diperkenalkan, termasuk tanggal, URL, dan alamat Email. Objek lain telah menambahkan dukungan untuk karakter non-Latin. HTML5 juga memperkenalkan mikrodata, metode pelabelan konten dengan tag yang dapat dikenali mesin, membuat pemrosesan Web Semantik lebih mudah. Secara umum, perbaikan struktural ini memungkinkan pembuat konten untuk membuat halaman web yang lebih bersih dan lebih mudah dikelola, yang lebih ramah untuk mesin pencari dan pembaca layar.


Antarmuka program aplikasi baru

Selain antarmuka DOM asli, HTML5 menambahkan lebih banyak API, seperti:

  • CanvasLabel untuk gambar 2D instan
  • Pemutaran media berwaktu
  • Penyimpanan database offline
  • Pengeditan dokumen
  • Kontrol seret
  • Manajemen riwayat penjelajahan


Perbedaan antara HTML5 dan HTML4

HTML 5 memiliki dua fitur utama:

  • Pertama-tama, kinerja halaman Web ditingkatkan. Selain menggambar grafik dua dimensi, tag untuk memutar video dan audio juga disiapkan.
  • Kedua, fungsi aplikasi web seperti database lokal telah ditambahkan.


Tag HTML5

Tabel berikut mencantumkan tag HTML yang tersedia. Beberapa tag ditentukan dalam spesifikasi HTML4 dan spesifikasi HTML5 serta dapat digunakan dalam HTML4 dan HTML5.

label Arti label HTML5 HTML4
<!DOCTYPE> Tentukan jenis dokumen Ya
Ya
<a> Tentukan hyperlink Ya Ya
<abbr> Tentukan singkatan Ya Ya
<akronim> Tidak didukung di HTML 5. Tentukan akronim
Ya
<alamat> Tentukan elemen alamat Ya Ya
<applet> Tidak didukung di HTML 5. Tentukan applet Ya
<are & Tentukan area di peta gambar Ya Ya
<artikel> Tentukan artikel Ya
<aside> Tentukan konten selain konten halaman Ya
<audio> Tentukan konten suara Ya
<b> Tentukan teks tebal Ya Ya
<base> Tentukan URL dasar dari semua link di halaman Ya Ya
<basefont> Tidak didukung di HTML 5 Ya
<bdo> Tentukan arah tampilan teks Ya Ya
<big> Tidak didukung di HTML 5. Tentukan teks besar Ya
<blockquote> Tentukan referensi yang panjang Ya Ya
<body> Tentukan elemen tubuh Ya Ya
<br> Sisipkan baris baru Ya Ya
<button> Tombol Tentukan Ya Ya
<canvas> Tentukan kanvas grafis Ya
<caption> Tentukan judul tabel Ya Ya
<center> Tidak didukung di HTML 5. Tentukan teks tengah
Ya
label Arti label HTML5 HTML4
<cite> Referensi definisi Ya Ya
<code> Tentukan teks kode komputer Ya Ya
<col> Tentukan atribut kolom tabel Ya Ya
<colgroup> Tentukan pengelompokan kolom tabel Ya Ya
<perintah> Tentukan tombol perintah Ya
<datalist> Tentukan daftar drop-down Ya
<dd> Deskripsi yang ditentukan Ya Ya
<del> Tentukan hapus teks Ya Ya
<detail> Tentukan detail elemen Ya
<dfn> Definisi Tentukan Proyek Ya Ya
<dir> Tidak didukung di HTML 5. Tentukan daftar direktori Ya
<div> Tentukan bagian dalam dokumen Ya Ya
<dl> Daftar definisi Ya Ya
<dt> Tentukan item yang ditentukan Ya Ya
<em> Tentukan teks yang ditekankan Ya Ya
<embed> Tentukan konten atau plugin interaktif eksternal Ya
<fieldset> Tentukan elemen fieldset Ya Ya
<figcaption> Tentukan judul elemen gambar Ya
<figur> Tentukan kelompok konten media dan judulnya Ya
<font> Tidak didukung di HTML 5 Ya
<footer> Definisikan sectionatau pagefooter Ya
<form> Tentukan formulirnya Ya Ya
<frame> Tidak didukung di HTML 5. Tentukan jendela anak (bingkai) Ya
<frameset> Tidak didukung di HTML 5. Tentukan kumpulan bingkai Ya
<h1> - <h6> Tentukan tajuk 1 hingga tajuk 6 Ya Ya
<head> Tentukan informasi tentang dokumen Ya Ya
<header> Header yang mendefinisikan sectionataupage Ya
<hgroup> Untuk definisi sectioninformasi dokumen Ya Ya
<jam> Tentukan garis horizontal Ya Ya
<html> htmlDokumen definisi Ya Ya
<i> Tentukan teks miring Ya Ya
<iframe> Tentukan jendela anak (bingkai) di baris Ya Ya
<img> Tentukan gambar Ya Ya
<input> Tentukan bidang masukan Ya Ya
<ins> Tentukan teks yang disisipkan Ya Ya
<keygen> Tentukan kunci yang dihasilkan Ya
<isindex> Tidak didukung di HTML 5. Tentukan kolom input satu baris Ya
<kbd> Tentukan teks keyboard Ya Ya
<label> Tentukan label dari kontrol formulir Ya Ya
<legend> fieldsetJudul dalam definisi Ya Ya
<li> Tentukan item untuk daftar tidak berurutan Ya Ya
<link> Tentukan referensi sumber daya Ya Ya
<map> Tentukan peta gambar Ya Ya
<mark> Tentukan teks yang ditandai Ya
<menu> Tentukan daftar menu Ya Ya
<meta> Tentukan informasi meta Ya Ya
<meter> Tentukan metrik dalam rentang yang telah ditentukan sebelumnya Ya Ya
<nav> Tentukan tautan navigasi Ya
<noframes> Tidak didukung di HTML 5. Tentukan bagian noframe Ya
<noscript> Tentukan bagian noscript Ya Ya
<object> Tentukan objek yang disematkan Ya Ya
<ol> Tentukan daftar yang dipesan Ya Ya
<optgroup> Tentukan grup opsi Ya Ya
<option> Tentukan opsi dalam daftar drop-down Ya Ya
<output> Tentukan beberapa jenis keluaran Ya
<p> Paragraf definisi Ya Ya
<param> Tentukan parameter untuk objek tersebut Ya Ya
<pre> Tentukan teks yang telah diformat sebelumnya Ya Ya
<progress> Tentukan kemajuan semua jenis tugas Ya Ya
<q> Tentukan referensi singkat Ya Ya
<ri> Tentukan rubykonten yang ditampilkan jika elemen tersebut tidak didukung oleh browser Ya
<rt> rubyAnotasi definisi Ya
<ruby> rubyKomentar definisi Ya Ya
<s> Tidak didukung di HTML5. Tentukan teks coretan Ya
<samp> Tentukan kode sampel komputer Ya Ya
<script> Tentukan skrip Ya Ya
<section> Tentukan sectionelemen Ya
<select> Tentukan daftar opsional Ya Ya
<small> Tentukan teks kecil Ya Ya
<source> Tentukan sumber media Ya
<span> Tentukan spanelemen Ya Ya
<strike> Tidak didukung di HTML 5. Tentukan teks coretan Ya
<strong> Tentukan teks yang ditekankan Ya Ya
<style> Tentukan definisi gaya Ya Ya
<sub> Tentukan teks subskrip Ya Ya
<summary> Tentukan detailsjudul elemen Ya
<sup> Tentukan teks superskrip Ya Ya
<tabel> Tentukan tabelnya Ya Ya
<tbody> Tentukan badan tabel Ya Ya
<td> Tentukan sel tabel Ya Ya
<textarei> Tentukan textareaelemen Ya Ya
<tfoot> Tentukan catatan kaki tabel Ya Ya
<th> Tentukan header Ya Ya
<thead> Tentukan header Ya Ya
<time> Tentukan tanggal / waktu Ya
<title> Tentukan judul dokumen Ya Ya
<tr> Tentukan baris tabel Ya Ya
<tt> Tidak didukung di HTML 5. Tentukan teks mesin tik Ya
<u> Tidak didukung di HTML 5. Tentukan teks yang digarisbawahi Ya
<ul> Tentukan daftar tidak berurutan Ya Ya
<var> Tentukan variabel Ya Ya
<video> Tentukan videonya Ya
<xm> Tidak didukung di HTML 5. Tentukan teks yang telah diformat sebelumnya Ya


HTML5 mengubah web

HTML5 adalah lompatan terbesar dalam standar Web dalam dekade terakhir. Berbeda dengan versi sebelumnya, HTML5 tidak hanya digunakan untuk merepresentasikan konten Web. Misinya adalah membawa Web ke dalam platform aplikasi yang matang. Pada platform ini, video, audio, gambar, animasi, dan interaksi dengan komputer semuanya standardisasi. Meskipun realisasi HTML5 masih memiliki jalan panjang, HTML5 sedang mengubah Web.

Apa yang akan dibawa oleh HTML5Berikut adalah bagian paling menarik dari draf HTML5:

Tag baru dan lebih masuk akal, objek multimedia tidak lagi terikat dengan objek atau tag embed, tetapi tag video memiliki tag video, dan tag audio memiliki tag audio. Database lokal. Fitur ini akan menyematkan database SQL lokal untuk mempercepat pencarian interaktif, cache, dan pengindeksan. Pada saat yang sama, program Web offline tersebut akan mendapatkan banyak manfaat. Animasi yang kaya tanpa plugin. Objek Canvas akan memberikan browser kemampuan untuk menggambar grafik vektor langsung di atasnya, yang berarti kita dapat melepaskan diri dari Flash dan Silverlight dan menampilkan grafik atau animasi langsung di browser. Beberapa browser terbaru, kecuali IE, sudah mulai mendukung Canvas. Program nyata di browser. API akan disediakan untuk mengimplementasikan pengeditan, drag-and-drop, dan berbagai kemampuan antarmuka pengguna grafis di browser. Tag modifikasi konten akan dihapus dan CSS akan digunakan. Secara teori, HTML5 adalah tanah untuk mengembangkan standar Web baru, yang memungkinkan berbagai ide untuk dibagikan di antara penyelenggara.

Komentar