[PENELITIAN] Steganografi Menggunakan Metode Arnorld Cat Map (ACM), Least Significant Bit (LSB), Dan Scale Invariant Feature Transform (SIFT)

Penelitian Terkait

Pada penilitian ini, telah di cari beberapa penelitian-penilitan yang sudah di rancang kemudian di pilih untuk di gabungkan menjadi satu penilitan dari hasil pilihan tersebut

Pengenalan ACM, LSB, dan SIFT

Komunikasi sudah menjadi bagian dalam kehidupan manusia. Terutama pada era informasi seperti sekarang, komunikasi menjadi hal yang sangat krusial. Ada saat di mana informasi itu bersifat penting dan rahasia. Oleh karena itu metode komunikasi yang digunakan harus dibuat sedemikian rupa sehingga tidak ada pihak lain yang mengetahui tentang informasi tersebut[1]. Citra (image) merupakan salah satu bentuk data atau informasi yang disajikan secara visual. Citra memainkan peranan penting dalam industri multimedia saat ini. Citra juga merupakan unsur pembentuk video, sebab sebuah video pada dasarnya disusun oleh rangkaian frame citra yang ditampilkan dalam tempo yang cepat[2]. Dalam dunia sekarang ini keamanan teknologi menjadi pusat perhatian. Dengan meningkatnya kejahatan di dunia maya (cyber crime), menyediakan keamanan jaringan saja tidak cukup. Keamanan yang disediakan gambar seperti blue print dari perusahaan, gambar rahasia yang digunakan dalam militer Footnote (boleh dikosongkan) atau kepentingan perusahaan [3]. Contoh kejahatan di dunia maya atau cyber crime yaitu mengambil atau memodifikasi informasi yang bukan haknya [4]. Karena hal tersebut munculah teknik pengamanan pesan yaitu kriptografi dan steganografi. Kriptografi diciptakan sebagai suatu teknik untuk mengamankan kerahasiaan komunikasi. Berbagai metode telah dikembangkan untuk mengenkripsi dan mendekripsi data untuk menjaga kerahasiaan pesan. Teknik kriptografi saja tidak cukup untuk menjaga kerahasiaan pesan, sehingga diperlukan teknik steganografi untuk menyembunyikan pesan dengan suatu cara sehingga tidak ada seorangpun yang mengetahui atau menyadari bahwa ada suatu pesan rahasia yang disisipkan [2]. Algoritma Arnold Cat Map (ACM) merupakan salah satu algoritma kriptografi yang biasa digunakan untuk melakukan enkripsi pada citra. Konsep dari algoritma ini adalah memutar citra secara terus menerus sehingga menjadi bentuk yang tidak terlihat. Namun, bila iterasi putaran citra tersebut telah mencapai jumlah tertentu, citra tersebut dapat kembali seperti semula lagi[5]. Hal ini menjadi kelemahan bagi algoritma ACM. Beberapa peneliti mencoba untuk PENYISIPAN PESAN PADA GAMBAR MENGGUNAKAN ALGORITMA ARNOLD CAT MAP (ACM), LEAST SIGNIFICANT BIT(LSB), DAN SCALE INVARIANT FEATURE TRANSFORM (SIFT) menggabungkan algoritma ACM dengan algoritma kriptografi lainnya. Seperti pada penelitian berjudul “An Efficient Image Cryptographic Technique by Applying Chaotic Logistic Map and Arnold Cat Map”[6], peneliti menerapkan algoritma Logistic Map dan ACM untuk melakukan enkripsi pada citra. Disebutkan bahwa hasil dari metode tersebut cukup baik dan waktu yang dibutuhkan untuk melakukan enkripsi cukup singkat sehingga dapat pula digunakan dalam komunikasi melalui video, aplikasi komersil, dan sebagainya. Selain menggabungkan algoritma ACM dengan algoritma kriptografi lainnya, algoritma ACM juga dapat digabungkan dengan teknik steganografi. Pada jurnal yang berjudul “High Security Image Steganography with Modified Arnold’s Cat Map”[7], peneliti mencoba untuk memodifikasi algoritma ACM dan kemudian digabungkan dengan teknik steganografi. Hasil akhir dari penelitian tersebut tidak aman terhadap serangan noise dan teknik kompresi sehingga diperlukan pengembangan lebih lanjut. Dalam steganografi banyak metode yang dikembangakan, salah satu metode yang umum digunakan adalah metode Least Significant Bit (LSB). LSB merupakan bit terendah pada urutan nomor biner. Tujuan dari metode LSB yaitu untuk menempatkan atau menyisipkan data ke bit terakhir dari setiap piksel pada cover image. Penelitian pada jurnal yang berjudul “Improved RGB-LSB Steganography Using Secret Key”[8] memodifikasi algoritma LSB dengan menggunakan key untuk membantu dalam memilih channel warna yang akan disisipkan pesan. Menurut peneliti, metode yang diusulkan tersebut akan susah dipecahkan oleh orang lain bila orang tersebut tidak mengetahui key yang digunakan. Untuk menutupi kelemahan algortima LSB , maka pada penelitian ini dilakukan penggabungan dengan algoritma Scale Invariant Feature Transform (SIFT). SIFT merupakan algoritma yang dapat diaplikasikan pada image matching yang memiliki ketahanan terhadap citra yang mengalami perubahan transformasi seperti rotasi ,ditemukan oleh David G. Lowe pada tahun 1999, seorang peneliti dari University of British Columbia. Dalam penelitian ini algoritma SIFT suatu citra akan di ubah menjadi vektor fitur lokal yang kemudian akan digunakan sebagai pendekatan dalam mendeteksi objek yang dimaksud. Secara garis besar, algoritma yang digunakan pada metode SIFT terdiri dari empat tahap, yaitu mencari nilai ekstrim pada skala ruang, menentukan kandidat keypoint , penentuan orientasi, dan deskriptor keypoint[9]. Scale invariant feature transform merupakan salah satu algoritma yang bekerja cukup baik dalam mendeteksi ciri pada suatu citra, output dari algoritma ini berupa titik titik kunci yang berada di sekitar pola dari citra yang biasa disebut dengan keypoint descriptor, yang mana nantinya keypoint descriptor dari sebuah citra dapat dibandingkan dengan keypoint descriptor pada citra lain yang selanjutnya dapat ditentukan tingkat kemiripannya [10]. Titik-titik kunci inilah yang akan digunakan untuk menyisipkan pesan yang telah dienkripsi menggunakan algoritma ACM. Berdasarkan penelitian dari jurnal[7] algoritma ACM dapat digabungkan dengan teknik steganografi. Namun karena tidak ada pengembangan terhadap teknik steganografi maka keamanan pesan pada steganografi tidak terlalu ada peningkatan. Sementara, pada jurnal [11] menyatakan bahwa teknik kriptografi dapat digabungkan dengan teknik steganografi dengan modifikasi menggunakan algoritma SIFT untuk dijadikan key dan hasilnya sangat aman untuk transaksi data dalam waktu dekat. Oleh karena itu, peneliti memiliki ide untuk menggabungkan teknik kriptografi, yaitu dengan algoritma ACM, dan teknik steganografi, yaitu dengan algoritma LSB. Algoritma LSB akan dimodifikasi dengan algoritma Scale Invariant Feature Transform (SIFT). Penggunaan algoritma ACM, LSB, dan SIFT diharapkan dapat meningkatkan keamanan pesan dan mengatasi kelemahan dari algoritma ACM dan LSB.

Metode Yang Diusulkan

A.    Arnold Cat Map

Algoritma ACM pertama diciptakan oleh Vladimir Arnold pada tahun 1960. Algoritma ACM biasa digunakan untuk melakukan enkripsi pada file citra karena konsep dari algoritma ini adalah memutar citra secara terus menerus sehingga menjadi bentuk yang tidak beraturan. Namun, bila iterasi putaran citra tersebut telah mencapai jumlah tertentu, citra tersebut dapat kembali seperti semula lagi. Rumus dari algoritma ACM adalah:

Dimana x dan y merupakan posisi piksel citra, misal posisi piksel (1,2) berarti x = 1 dan y = 2. Sedangkan x` dan y` adalah posisi piksel yang baru. Pada implementasinya, nilai x` dan y` ditambah dengan 1 untuk menghindari nilai 0 karena pada matriks, posisi awal / terkecil adalah (1,1). Nilai p dan q ditentukan sendiri dengan syarat yaitu angka yang dipilih haruslah bilangan bulat positif dan

Nilai dari n adalah ordo citra. Bila ukuran citra adalah 124 x 124, maka n = 124. Selain inputan rumus diatas, diperlukan satu inputan lagi yaitu jumlah iterasi perputaran citra yang diinginkan.

B. Least Significant Bit LSB

adalah bit terkecil pada urutan bilangan biner [6]. Sedangkan bit terbesarnya disebut most significant bit (MSB). Bila terdapat bilangan biner 10000000, maka bit LSBnya adalah angka 0 yang terletak di sebelah kanan dan bit MSBnya adalah angka 1 yang terletak di sebelah kiri. Algoritma LSB merupakan algoritma steganografi yang paling sederhana. Algoritma ini paling sering digunakan untuk steganografi citra, walaupun dapat pula dipakai untuk tipe steganografi lainnya. Seperti namanya, algoritma LSB memanfaatkan bit LSB sebagai tempat untuk menyisipkan pesan dengan cara mengubah nilai bit LSB pada cover menjadi nilai biner pesan secara berurutan.

C.     Scale Invariant Feature Transform

Scale Invariant Feature Transform atau SIFT merupakan metode yang digunakan pada computer vision untuk mendeteksi dan mendeskripsikan fitur lokal dari sebuah gambar. Metode ini diperkenalkan oleh David Lowe pada tahun 1999. Metode SIFT ini banyak digunakan pada pengenalan objek, mapping dan navigasi robotik, pemodelan 3D, pengenalan gestur, video tracking, dan masih banyak lagi. Metode SIFT ini banyak digunakan karena invariant terhadap skala dan rotasi gambar, dan juga terhadap perubahan iluminasi/pencahayaan.

D.    Mean Square Error (MSE) dan Peak Signal to Noise Ratio (PSNR)

Penilaian kualitas citra dilakukan dengan menggunakan besaran Mean Square Error (MSE) dan Peak Signal to Noise Ratio (PSNR) [9]. MSE adalah rata-rata kuadrat nilai kesalahan antara citra asli dengan citra hasil pengolahan. Semakin rendah nilai MSE maka akan semakin baik [8]. Rumus untuk menghitung MSE adalah:

Dimana MSE = nilai Mean Square Error citra hasil pengolahan, M = panjang citra hasil pengolahan (dalam piksel), N = lebar citra hasil pengolahan (dalam piksel), = nilai piksel dari citra asli, dan = nilai piksel pada citra hasil pengolahan. Peak Signal to Noise Ratio (PSNR) adalah perbandingan antara nilai maksimum dari sinyal yang diukur dengan besarnya derau yang berpengaruh pada sinyal tersebut. PSNR diukur dalam satuan desibel (dB). Untuk melakukan penghitungan nilai PSNR, terlebih dahulu harus dicari nilai MSE-nya. Semakin besar nilai PSNR maka semakin baik kualitas citra. Rumus untuk menghitung PSNR adalah:

Dimana PSNR = nilai PSNR citra, MAXi = nilai maksimum piksel, dan MSE = nilai MSE citra.

E.     Teknik Penyerangan pada Citra (Attack)

Attack merupakan teknik untuk merusak maupun memodifikasi sebuah citra yang bertujuan untuk merusak maupun menghilangkan watermark dari sebuah citra. Teknik ini biasa dilakukan untuk mengetahui kualitas sebuah citra apabila dilakukan sebuah modifikasi pada citra tersebut. Dalam penelitian ini, digunakan dua teknik attack, yaitu salt & pepper dan scratch. a. Salt & pepper Salt & pepper merupakan salah satu jenis noise. Bentukdari metode attack ini seperti butir-butir garam dan merica, sehingga dinamakan salt & pepper. b. Scratch Scratch merupakan salah satu metode attack pada citra digital. Metode ini dilakukan untuk merusak citra dengan cara membuat garis-garis pada citra.

Hasil Implementasi

Menurut [18], kualitas citra dianggap rendah bila nilai PSNR-nya kurang dari 30dB dan kualitas citra dianggap tinggi bila nilai PSNR-nya di atas 40dB. Sementara bila nilai PSNR-nya berada di antara 30dB dan 40dB, maka kualitas citra tersebut masih dapat diterima. Berdasarkan hasil pengujian non-attack pada tabel di atas, nilai MSE pada masing-masing stego-image cukup rendah, yaitu di bawah 0dB, dan nilai PSNR-nya cukup tinggi, yaitu sekitar 75dB – 78dB. Nilai MSE pada “pesan1.bmp”, “pesan2.bmp”, dan “pesan3.bmp” adalah 0dB dan nilai PSNR-nya adalah Inf (tidak terhingga) yang berarti tidak ada perubahan nilai piksel pada citra hasil proses pengambilan pesan dengan citra pesan yang asli sehingga dapat dikatakan bahwa kualitas stego-image yang dihasilkan dengan menggunakan metode yang diusulkan pada penelitian ini cukup tinggi dan metode yang diusulkan dapat mengambil kembali pesan pada stego-image dengan baik. Sedangkan pada pengujian attack, dapat dilihat bahwa nilai PSNR untuk pengujian salt & pepper pada stegoimage adalah sekitar 24-34 dB dan nilai PSNR pada pesan adalah sekitar 27dB – 37dB. Posisi penyebaran titik hitam dan putih yang acak memberi dampak yang cukup besar terhadap kualitas citra pesan dan stego-image karena posisi penyisipan yang juga dilakukan secara acak memungkinkan seringnya titik dari salt & pepper menempati posisi piksel dimana terdapat bit biner pesan di dalamnya. Dengan demikian metode yang diusulkan pada penelitian ini masih rentan terhadap serangan noise seperti salt & pepper karena kualitas stego-image yang diserang dengan salt & pepper dan pesannya rendah. Sementara pada pengujian scratch, nilai MSE dan PSNR stego-image maupun pesan lebih baik daripada pengujian salt & pepper. Nilai PSNR pada “stego1-scratch”, “stego2- scratch”, dan “stego3-scratch” adalah sekitar 30dB – 36dB. Sedangkan nilai PSNR pada “pesan1-scratch”, “pesan2- scratch”, dan “pesan3-scratch” adalah sekitar 0 dB -0,178 dB. Baik kualitas stego-image maupun pesannya tersebut dapat dikategorikan rendah atau masih dapat diterima. Posisi penyisipan yang acak pada metode yang diusulkan di penelitian ini dapat membingungkan si penyerang. Bila si penyerang tidak mengetahui bahwa posisi penyisipan dilakukan secara acak, maka si penyerang hanya akan melakukan scratch pada bagian atas stego-image seperti yang tampak pada citra “stego3-scratch.bmp”. Walaupun kualitas citra pesan menurun, namun kerusakan yang ditimbulkan tidak terlalu besar bila dibandingkan dengan penyisipan yang dilakukan secara berurutan. Dari kedua pengujian attack tersebut, dapat disimpulkan bahwa kualitas citra stego-image maupun pesan menurun drastis namun pesan tersebut masih dapat diketahui bentuknya.

Kontribusi Penelitian

Penggabungan teknik kriptografi dan steganografi menggunakan algoritma ACM, LSB, dan SIFT dapat digunakan untuk merahasiakan pesan dengan baik. Orang yang tidak mengetahui kunci rahasia yang digunakan akan kesulitan untuk mendapatkan pesan pada stego-image. Kualitas stego-image yang dihasilkan cukup tinggi yaitu lebih dari 70 dB, tetapi masih rentan terhadap serangan citra seperti salt&pepper dan scratch sehingga dalam penelitian selanjutnya perlu pengembangan terhadap algoritma steganografi yang digunakan.

DAFTAR PUSTAKA

1.      R. F.-W. Suadi, “IMPLEMENTASI KRIPTOGRAFI DAN STEGANOGRAFI PADA MEDIA GAMBAR DENGAN MENGGUNAKAN METODE DES DAN REGION-EMBED DATA DENSITY.,” pp. 1–7, 2011.

2.      V. L. Reddy and K. S. R. M. C. Engg, “Implementation of LSB Steganography and its Evaluation for Various File Formats,” vol. 872, pp. 868–872, 2011.

3.      J. Kapur and A. J. Baregar, “Security Using Image Processing,” Int. J. Manag. Inf. Technol., vol. 5, no. 2, pp. 13–21, May 2013.

4.      R. Dean, Septian Ari Moesriami , Barmawi Ema, “MODIFIKASI METODE STEGANOGRAFI DYNAMIC CELL SPREADING ( DCS ) PADA CITRA DIGITAL,” pp. 1–5, 2012.

5.      K. Struss, “A Chaotic Image Encryption,” pp. 1–19, 2009.

6.      S. V. Kumari and G. Neelima, “An Efficient Image Cryptographic Technique by Applying Chaotic Logistic Map and Arnold Cat Map,” vol. 3, no. 9, pp. 1210–1215, 2013.

7.      M. Mishra, “High Security Image Steganography with Modified Arnold ’ s Cat Map,” vol. 37, no. 9, pp. 16–20, 2012.

8.      A. Gangwar, “Improved RGB -LSB Steganography Using Secret,” vol. 4, pp. 85 –89, 2013.

9.      D. G. Lowe, “Distinctive Image Features from Scale -Invariant Keypoints,” Int. J. Comput. Vis., vol. 60, no. 2, pp. 91 –110, Nov. 2004.

10.  S. Jatmiko, “Analisis Dan Implementasi Penggunaan Scale Invariant Feature Transform ( SIFT ) Pada Sistem Verifikasi Tanda Tangan,” 2013.

11.  N. Hamid, A. Yahya, R. B. Ahmad, and O. M. Al - qershi, “A Comparison between Using SIFT and SURF for Characteristic Region Based Image Steganography,” vol. 9, no. 3, pp. 110 –116, 2012.

12.  P. Bateman, “Image Steganography and Steganalysis,” Fac. Eng. Phys. Sci. Univ. Surrey, no. August, 2008.

Script Dasar HTML

Berjumpa lagi di kertaskuliah tidak lupa saya mengucapkan terimakasih sudah berkunjung kesini hehehe disini saya akan memberikan script dasar HTML, pada pengertian HTML sudah saya post kan disini dan sekarang saya akan memberikan contoh tampilan beserta script dasarnya, langsung saja ke intinya :

Header

- Script di bawah ini untuk menampilkan teks pada halaman web.

- pada <h1> saya berikan judul untuk di tampilkan. <h1> = Header

- dan <p> itu adalah paragraph nya. <p> = paragraph

- anda bisa mengganti nomor pada header misalkan <h4> karena pada header itu untuk menentukan besarnya huruf kata yang di masukan, header di maksimalkan sampai 6 jadi angka yang terbesar adalah 1 yang terkecil itu 6 jika di urutkan dari yang besar ke yang kecil <h1><h2><h3><h4><h5><h6>
<!DOCTYPE html>
<html>

<head>
<title>Page Title</title>
</head>
<body>
<h1>kertaskuliah.blogspot.com</h1>
<p>Terimakasih sudah berkunjung</p>
</body>
</html>

Tampilan :

Link 

- script di bawah ini adalah tulisan untuk memudahkan orang lain untuk mengunjungi sebuah link yang ingin di berikan.

- di bawah ini ada sebuah link yang bertuliskan kertaskuliah.blogspot.com anda bisa menggantinya dengan link yang ingin anda masukan ganti saja jangan lupa harus pakai tanda " di awal dan di akhir

- sebelah link ada tulisan "ini link nya" anda bisa mengganti nya dengan kata-kata yang anda mau, fungsi ini untuk memberikan informasi atau tanda ke pada pembaca untuk menjembatani web yang akan anda berikan.

<!DOCTYPE html>

<html>

<body>

<a href="http://kertaskuliah.blogspot.com">ini link nya</a>

</body>

</html>

Gambar

- script untuk menampilkan gambar ketika anda ingin menampilkannya anda harus membuat folder terlebih dahulu.

- anda buka notepad isikan scipt di bawah simpan dengan nama misalkan kertaskuliah.html , format notepad harus .html 

- masukan ke folder yang tadi di buat, dan di dalamnya buat folder lagi anda isikan images, di folder images isikan foto anda dan nama foto di sarankan yang gampang saja. 

- semua persiapan sudah di lakukan buka lagi pada notepad, ganti img src="kertaskuliah.jpg"   menjadi img src="images/namafotoagan.jpg" lalu save.

<!DOCTYPE html>

<html>

<body>

<img src="kertaskuliah.jpg" width="104" height="142">

</body>

</html>

Membuat heading di tengah

- penjelasan sama pada tahap awal yang membedakan adalah <h1 style="text-align:center"> script ini untuk menempatkan posisi text berada di tengah, jika ingin anda mengganti nya ke kiri atau ke kanan anda ganti yang bertuliskan center menjadi left atau right. 

<!DOCTYPE html>

<html>

<body>

<h1 style="text-align:center">Kertaskuliah di tengah</h1>

<p>ini paragraph</p>

</body>

</html>

Tampilan :

Warna text

- style="color:blue" menentukan warna biru, jika anda ingin menggantinya silahkan rubah blue menjadi warna yang di inginkan. 

- <h1> letak hurup pada heading, <p> letak huruf di paragraph.

<!DOCTYPE html>

<html>

<body>

<h1 style="color:blue">warna biru kertaskuliah di heading</h1>

<p style="color:red">warna merah kertaskuliah di paragrah</p>

</body>

</html>

Tampilan :

Font teks

- <h1 style="font-family:verdana"> script ini untuk menampilkan jenis font disini saya pakai verdana, anda bisa merubahnya dengan font apa saja, font tersebut bisa anda dapatkan di MS word.

<!DOCTYPE html>

<html>

<body>

<h1 style="font-family:verdana">Kertaskuliah teks verdana</h1>

<p style="font-family:courier">Kertaskuliah teks courier</p>

</body>

</html>

Tampilan : 

Table 

- pada script <th> dan <td> anda bisa mengganti nya sesuai yang di inginkan.

- jika ingin merubah warna nya pada background-colour : #eee; rubah huruf #eee nya saja ganti dengan kode warna anda bisa mencari nya di google.

<!DOCTYPE html>
<html>
<head>
<style>
table {
width:100%;
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
th, td {
padding: 5px;
text-align: left;
}
table#t01 tr:nth-child(even) {
background-color: #eee;
}
table#t01 tr:nth-child(odd) {
background-color:#fff;
}
table#t01 th {
background-color: black;
color: white;
}
</style>
</head>
<body>


<table>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Points</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
<tr>
<td>John</td>
<td>Doe</td>
<td>80</td>
</tr>
</table>


<br>


<table id="t01">
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Points</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
<tr>
<td>John</td>
<td>Doe</td>
<td>80</td>
</tr>
</table>


</body>
</html>

Tampilan :

Membuat list tab
- pada # anda bisa mengganti nya dengan url anda untuk menjembatani saat di klik langsung menuju alamat url tersebut.

<!DOCTYPE html>
<html>
<head>
<style>
ul#menu {
    padding: 0;
}

ul#menu li {
    display: inline;
}

ul#menu li a {
    background-color: black;
    color: white;
    padding: 10px 20px;
    text-decoration: none;
    border-radius: 4px 4px 0 0;
}

ul#menu li a:hover {
    background-color: orange;
}
</style>
</head>
<body>

<h2>Horizontal List</h2>

<ul id="menu">
  <li><a href="#">Satu</a></li>
  <li><a href="#">Dua</a></li>
  <li><a href="#">Tiga</a></li>
  <li><a href="#">Empat</a></li>
</ul>

</body>
</html>

Tampilan

Keterangan :
untuk memuncul kan script tersebut, buka notepad copas script yang anda mau, simpan di folder kosong, format nama .html , save kemudian double klik hasil simpan tersebut.

Sampai disini dulu artikel tentang dasar-dasar script HTML semoga bermanfaat, untuk lanjutannya saya akan update setiap hari pantengin saja terus blog kertaskuliah jangan lupa di subcribe ya ...

Mengenal apa itu HTML 5

HTML5

  HTML5 adalah sebuah bahasa markah untuk menstrukturkan dan menampilkan isi dari Waring Wera Wanua, sebuah teknologi inti dari Internet. HTML5 adalah revisi kelima dari HTML (yang pertama kali diciptakan pada tahun 1990 dan versi keempatnya, HTML4, pada tahun 1997[1]) dan hingga bulan Juni 2011 masih dalam pengembangan. Tujuan utama pengembangan HTML5 adalah untuk memperbaiki teknologi HTML agar mendukung teknologi multimedia terbaru, mudah dibaca oleh manusia dan juga mudah dimengerti oleh mesin.

  HTML5 merupakan salah satu karya Konsortium Waring Wera Wanua (World Wide Web Consortium, W3C) untuk mendefinisikan sebuah bahasa markah tunggal yang dapat ditulis dengan cara HTML ataupun XHTML. HTML5 merupakan jawaban atas pengembangan HTML 4.01 dan XHTML 1.1 yang selama ini berjalan terpisah, dan diimplementasikan secara berbeda-beda oleh banyak perangkat lunak pembuat web.

MARKUP

  Pada HTML 5 diperkenalkan beberapa elemen baru dan atribut yang merefleksikan tipikal penggunaan website modern. Beberapa diantaranya adalah pergantian yang bersifat semantik pada blok yang umum digunakan: yaitu elemen (<div>) dan inline (<span>), sebagai contoh (<span>) (sebagai blok navigasi website) dan<footer> (biasanya dikaitkan pada bagian bawah suatu website atau baris terakhir dari kode html). Banyak elemen lain yang memberikan kegunaan baru melalui antar muka yang telah distandarkan, seperti elemen multimedia <audio> dan <video>.[14][15][16] Beberapa elemen yang telah ditinggalkan juga ditiadakan, termasuk elemen presentasi semata seperti <font> dan <center>, yang sebenarnya dapat dikerjakan menggunakan Cascading Style Sheet (CSS).

API baru

  Untuk menambah keluwesan pemformatan, pada HTML5 telah dispesifikasikan pengkodean application programming interfaces (APIs).[17] antarmuka document object model (DOM) yang ada dikembangkan dan fitur de facto didokumentasikan. Beberapa APIs terbaru pada HTML5 antara lain :

  Elemen canvas, sebagai mode untuk menggambar object dua dimensi (2D). Lihat spesifikasi 1.0 untuk canvas 2D.

- Timed media playback

- Media penyimpanan luring (aplikasi web luring). Lihat Web Storage

- Penyuntingan dokumen

- Drag and Drop

- Cross-document messaging

- Manajemen sejarah kunjungan penjelajah web

- Tipe MIME dan penanggung jawab protokol registrasi.

  Tidak semua teknologi di atas dimasukkan pada spesifikasi HTML5 W3C, meski teknologi tersebut telah termaktub dalam spesifikasi milik WHATWG HTML.[20]Beberapa teknologi yang juga terkait namun tidak dijadikan bagian dalam spesifikasi HTML5 W3C dan WHATWG HTML5 adalah :

- Geolocation

- Web SQL Database, media penyimpanan database lokal.

- API Database terindeks, mode penyimpanan hierarkis key-value (WebSimpleDB).

- Web Speech API

PERBEDAAN 4.01 DAN HTML 1.x

Berikut disajikan beberapa contoh perbedaan yang spesifik.

- Aturan baru saat melakukan parsing berorientasi pada towards dan kompatibilitas; tidak berbasis pada SGML

-  Kemampuan untuk mendukung format SVG dan MathML pada text/html

- Elemen baru: article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen,mark, meter, nav, output, progress, rp, rt, ruby, section, source, summary, time, video, wbr

-  Tipe baru pada kontrol form : dates and times, email, url, search, color

-  Atribut baru: ping (pada elemen a and area), charset (pada meta), async (pada script)

- Atribut global (atribut berikut dapat diterapkan pada setiap elemen html) : id, tabindex, hidden, data-* (atribut data kustom)

-  Selain dapat bernilai GET atau POST, elemen attribut <form> kini telah mendukung nilai PUT dan DELETE. (Sebagai contoh kasus lihat Representational State Transfer)

- Elemen yang telah deprecated secara bersamaan akan dihapus : acronym, applet, basefont, big, center, dir, font, frame, frameset, isindex,noframes, s, strike, tt, u

  Kunjungi dev.w3.org untuk melihat pembaharuan draft terkini antara HTML5 dan HTML4, tautan ini menyediakan secara lengkap berbagai daftar tambahan, penghapusan, dan perubahan yang terjadi di dalam spesifikasi HTML5.

PENANGANAN KESALAHAN

  Sebuah peramban web HTML5 (text/html) akan fleksiblel dalam menangani kesalahan sintaks. HTML5 telah didesain agar peramban web lama dapat dengan aman mengabaikan konstruksi HTML5 yang baru. Perbedaan mendasar dengan HTML 4.01 adalah spesifikasi HTML5 memberikan aturan detail untuk meleksikalkan danmemparsing sebagai persyaratan agar berbagai peramban web tetap memberikan hasil yang sama saat terjadi kesalahan sintaks. Meskipun HTML5 telah memiliki perilaku konsisten untuk menangani dokumen-dokumen "Tag Soup", dokumen seperti ini tidak dapat dikatakan telah memenuhi standar HTML5.

Berikut contoh tampilan yang di gunakan pada HTML : Tampilan HTML