Belajar HTML5 - Elemen Dasar Untuk Pemula

Belajar HTML5 - Elemen Dasar Untuk Pemula
(Belajar HTML5 - Elemen Dasar Untuk Pemula)

HTML5 adalah standarisasi bahasa markup versi terbaru dari HTML yang dikeluarkan oleh W3C. Oh ya... Perlu di inget gan, HTML merupakan bahasa markup bukan bahasa pemrograman! Ok? Lanjut... Pembaruan ini dilakukan oleh pihak W3C(World Wide Web Consortium) karena pada versi sebelum nya yakni HTML4 memiliki banyak sekali kelemahan sehingga para Developer (Pengembang) harus menambahkan beberapa source agar website nya berjalan dengan sempurna. Jadi kalo ente pake versi sebelumnya ente harus nambahin beberapa plugin seperti Silverlight, Flash dll.

Kenapa Ane pilih HTML5 di Artikel ini?

Jawabannya simple. Karena ini update-an terakhir :D haha..
Ulang... Karena di versi 5 ini sudah banyak sekali kelemahan-kelemahan yang sudah ditutup, Selain itu HTML5 Juga memiliki banyak kelebihan, diantaranya :

  • Jika ingin menambahkan Video atau Audio, ente gak perlu repot tambah plugin lagi. Karena di versi yang terakhir ini sudah dilengkapi dengan fitur pemutar file multimedia. Jadi tinggal pilih aja video yang mau di pasang. Kimochi misalnya :v
  • Kode yang terbilang sangat sederhana sehingga terlihat bersih dan mudah digunakan. Semacam hati gitu lah :v
  • Jika ente peminat game, Ente juga bisa membuat game dengan HTML5 ini tanpa menambahkan plugin seperti flash dll. Tapi kayaknya ente lebih minat ke video, jadi ke poin yang pertama aja. Kimochi :v
  • Mudahnya penerapan kode yang tidak hanya untuk komputer aja, tapi juga bisa mengembangkan web mobile dengan mudah :D
  • Browser lebih mudah memproses karena kode yang sangat sederhana. Jadi web bisa lebih cepet :D kaya blog ane ini :D
  • dan banyak lagi... Kalo di bahas semua, nanti gak jadi ke pokok materi :v
    intinya bagus dah titik. Lanjut...
Baca : Membuat Efek Lubang Tag Elemen DIV Html Menggunakan Css


Pahami Elemen Dasar

Ketika ingin membuat sebuah konten maka hal yang harus ente perhatikan adalah tag yang membungkusnya. Tag pembungkus ini terdiri dari tag pembuka dan tag penutup yang berfungsi untuk mengatur konten yang kita tulis.

Cara penulisan tag pembuka yaitu : tanda siku + nama tag + tutup siku
Misal : <div>
dan penulisan tag penutup hampir sama dengan penulisan tag pembuka namun di tambah dengan garis miring sebelum nama tag. yakni: tanda siku + garis miring + nama tag + tutup siku
Misal: </div>

Cara Penulisan :

Contoh Kasus :

Misalnya ente buat suatu artikel yang berisi dengan Judul dan paragraf yang didalamnya terdapat beberapa huruf tebal. Maka tag yang perlu kita tambahkan adalah <!DOCTYPE html> <html> <body><h1>,<p> dan <b>.

Keterangan :

<!DOCTYPE html> adalah pendefinisian seluruh file dokumen yang ente tulis nanti. (Khusus untuk tag ini tidak memiliki penutup)
<html> adalah tag untuk mengawali file html dengan penutupnya yaitu </html>.
<body> adalah tag yang mendifinisikan isi dari fileyang ente buat. penutup tag ini adalah </body>

<h1> adalah heading 1, berfungsi untuk mendefinisikan sebuah heading atau judul konten. Tag heading ada 6 yakni : <h1>,<h2>,<h3>,<h4>,<h5> dan <h6>. Tag heading 1-6 ini hanya berbeda ukurannya saja. Agar lebih jelas silahkan salin kode dibawah kedalam text editor favorit ente (ane pake notepad). kemudian simpan dengan nama "heading.html" dan buka menggunakan browser.


<p> adalah tag untuk mendefinisikan sebuah paragraf. tag ini berakhiran dengan </p>. untuk lebih mudah kita lakukan seperti cara diatas untuk kode di bawah ini. silahkan salin, simpan dan buka menggunakan browser.


<b> adalah tag yang berfungsi untuk mendifinisikan huruf tebal atau yang sering kita sebut dengan Bold.
misal :


Dari contoh diatas coba kita gabungkan semua kode menjadi satu seperti dibawah ini lalu save dengan nama "belajar.html":


Sudah gan gitu aja, semoga artikel singkat tentang Belajar Elemen Dasar HTML5 ini dapat dijadikan sebagai referensi. Sekuat daya ane akan selalu update artikel tentang tutorial, info dll yang masih ada kaitannya dengan teknologi. Ane juga baru belajar, jadi saling tukar ilmu aja :D Mohon koreksinya, jika ada yang mengganjal dihati langsung coret-coret di kolom komen yak.


0 komentar :