Monday, 18 May 2015

Pengertian HTML, Fungsi HTML serta Sejarah HTML

Pengertian HTML, Fungsi HTML serta Sejarah HTML. Apa itu HTML ? HTML adalah kepanjangan atau singkatan dari Hyper Text Markup Language. Setiap kita menjelajah di internet, membuka website apapun, kita pasti akan bertemu dengan HTML. Hal ini dikarenakan semua website yang ada diinternet, dibuat dengan menggunakan bahasa markup HTML.

Di Artikel kali ini kita akan mengetahui tentang apa yang dimaksud html, fungsi html, sejarah html, cara membuatnya serta mengenal bahasa HTML terbaru yaitu HTML5. Akan saya mulai dengan pengertian html terlebih dahulu.

Pengertian HTML

pengertian html fungsi html sejarah html
HTML adalah bahasa markup internet (web) berupa kode dan simbol yang dimasukkan kedalam sebuah file yang ditujukan untuk ditampilkan didalam sebuah website. Singkatnya, HTML adalah bahasa markup yang digunakan untuk membuat website. Website yang dibuat dengan HTML ini, dapat dilihat oleh semua orang yang terkoneksi dengan internet. Tentunya dengan menggunakan aplikasi penjelajah internet (browser) seperti Internet Explorer, Mozilla Firefox dan Google Chrome. 

Seperti yang sudah saya jelaskan sebelumnya, HTML adalah singkatan dari Hyper Text Markup Language. Tapi mengetahui singkatannya saja tidak akan cukup. Karena itu saya akan menyajikan arti dari kata kata tersebut. 
  • HyperText adalah metode dimana kita "berpindah" disekeliling web, dengan mengeklik sebuah teks yang bernama hyperlink. Hyperlink adalah sebuah teks khusus di internet, dimana saat teks tersebut diklik, akan membawa kita ke halaman web selanjutnya/halaman web lain yang telah ditentukan.
  • Markup adalah hal yang dilakukan oleh tag HTML kepada teks yang ada didalamnya. HTML menandai teks yang berada didalamnya sebagai tipe teks tertentu. Misalnya saja jika kita menandai sebuah teks dengan tag html <i>, maka teks tersebut akan berubah menjadi italic (huruf yang miring). Sedangkan jika kita menandainya dengan <b>, maka teks tersebut akan berubah menajadi bold (huruf tebal).
  • Language yang berarti bahasa. HTML adalah sebuah bahasa, yang memiliki kata kata berupa kode dan syntax seperti bahasa yang lain.
Saat ini bahasa HTML masih terus dikembangkan Hal ini dikarenakan pengguna internet semakin hari semakin berkembang pesat. Oleh karena itu bahasa HTML harus ditingkatkan lagi agar bisa menciptakan halaman web yang lebih berkualitas. Untuk itulah dibentuk sebuah organisasi yang bertanggungjawab mengembangkan bahasa HTML. Organisasi ini bernama W3C.

Fungsi dan Kegunaan HTML

Sebagai bahasa markup internet, HTML memiliki banyak fungsi dan kegunaan. Beberapa manfaat dari HTML diantaranya
  • Untuk Membuat Halaman Web. Bahasa HTML digunakan untuk membuat halaman web. Semua halaman web pasti dibuat dengan menggunakan HTML.
  • Sebagai Pondasi Bagi Sebuah Website. Sebuah rumah jika tidak memiliki pondasi maka akan cepat roboh. Begitu juga dengan website. Jika tidak memiliki HTML sebagai pondasi, kita tidak dapat mengimplementasikan bahasa lainnya seperti CSS (bahasa untuk mendesain website), Javascript (bahasa untuk menambah prilaku website), dan PHP (bahasa pemrograman server website).
  • Untuk menandai teks pada halaman web. Misalnya, kita dapat menandai sebuah teks menjadi bergaris bawah dengan menggunakan tag html <u>
  • Untuk menandai elemen/bagian pada halaman web. Sebuah website memiliki beberapa bagian seperti header, navigasi, main dan footer. Kita dapat menandai setiap bagiannya dengan HTML.
  • Untuk menampilkan informasi dalam bentuk tabel
  • Untuk menambahkan objek seperti audio, video, gambar, dll dalam halaman web
  • Untuk membuat online form 

Struktur Dasar HTML

#1 Element

Element terdiri dari 3 bagian, yaitu tag pembuka, isi dan penutup. Contohnya untuk menampilkan judul dari sebuah halaman, kita membuat kode html seperti ini

<title>Website Milik Faiz</title>

Yang berwarna biru, itu adalah pembuka. Yang warna hijau adalah isi. Sedangkan yang warna merah adalah penutup. Isi adalah optional, dalam artian tidak masalah jika kita tidak memberikan isi. Beda dengan pembuka dan penutup, keduanya harus ada dalam sebuah kode html. Jika tidak maka akan terjadi error, dan kode tidak akan berfungsi. 

Ada juga pembuka dan penutup yang berbeda dengan contoh diatas. Contohnya seperi ini

<input type="text" value="isian" />

Pada tag input kita tidak perlu menutupnya dengan </input> ,cukup dengan /> . Bahkan dengan menuliskan > saja juga bisa.

#2 Tag

Tag adalah teks khusus berupa dua karakter < dan >. Contohnya tag <head> dengan nama head, <body> dengan nama body, dan sebagainya. Tag ini sudah diatur dari sananya, jadi kita tidak boleh membuatnya sendiri. Misal jika kita menulis <bodi>, jelas tidak akan berfungsi.

Untuk lebih memperjelas, berikut ini struktur dasar kode html

<html>

<head>
<title>Website Faiz Agil Wirawan</title>
</head>

<body>
Hai teman teman, ini website pribadi saya lho..
</body>

</html>

Penjelasan
    1. <html></html> untuk menandai awal dan akhir dari file HTML
    2. <head></head> berisikan keterangan informasi seperti title dan jenis dokumen
    3. <title></title> sebagai judul halaman web
    4. <body></body> bagian ini adalah konten utama web seperti header, navigasi, artikel , sidebar dan footer
      Anda dapat menuliskan kode html di aplikasi bawaan Windows, Notepad. Bisa juga mendownload aplikasi khusu untuk menulis kode yaitu Notepad++

      #3 Atribut 

      Atribut terdapat didalam script sebuah elemen, fungsinya untuk memberi informasi tambahan tentang elemen. Nilai dari atribut harus ditutup dengan tanda kutip.

      <input type="password" />

      Kode diatas akan membuat sebuah kotak isian yang dikhususkan untuk menulis password. Dalam artian, jika kita menulis di isian tersebut, tulisan kita akan berubah menjadi bintang bintang seperi ini ******.


      Sejarah HTML

      HTML pertama kali diciptakan oleh IBM pada tahun 1980. Saat itu tercetus ide untuk menempatkan elemen elemen yang berguna untuk menandai bagian suatu dokumen seperti judul, alamat dan isi dokumen. Pada akhirnya elemen element tersebut dibentuk menjadi suatu program untuk melakukan pemformatan dokumen secara otomatis.

      Bahasa pemrograman untuk melakukan tugas ini disebut sebagai bahasa markup. IBM menamai program ini sebagai Generalized Markup Language. Pada tahun 1986, konsep ini disetujui oleh ISO (International Standard Organization) sebagai standar untuk pembuatan dokumen. Bahasa ini dinamai oleh ISO sebagai Standard Generalized Markup Language (SGML)

      HTML sendiri, adalah bagian dari SGML. Tim Berners-Lee dari CERN mengemukakan sebuah ide tentang pembuatan skrip bahasa pemrograman dan dokumen yang dapat diakes oleh semua komputer tanpa melihat jenis platformnya. Sejak saat itu HTML menjadi lebih populer dibandingkan SGML.


      Perkembangan HTML

      Sejak dirilis, bahasa HTML terus mengalami perkembangan

      HTML 1.0 

      HTML 1.0 adalah versi pertama dari HTML. Pada saat ini tidak banyak orang yang ikut berpartisipasi dalam pembuatannya. Fitur dari versi ini pun masih terbatas. Antar lain heading, paragraf, hypertext, list, efek tebal dan miring pada teks. Versi 1.0 juga mendukung peletakan gambar, namun tidak mendukung adanya teks disekeliling gambar.

      HTML 2.0

      HTML 2.0 masih membawa fitur sebelumnya dari versi 1.0, dengan tambahan beberapa vitur baru. Fitur tersebut adalah form. Dengan form, kita dapat memasukkan data data seperti nama, alamat, serta komentar. Hadirnya fitur form ini menjadi awal terbentuknya website yang interaktif.

      HTML 3.0

      Pada versi ini, mulai banyak orang yang ikut memberikan kontribusi pada HTML. Fitur baru yang hadir di versi ini salah satunya adalah tabel. Versi HTML ini tidak bertahan lama dikarenakan banyak permasalahan seperti perang antar browser. Karena itu, HTML ini segera diganti lagi menjadi versi 3.2

      HTML 3.2

      Perang antar browser terus berlanjut dikarenakan mereka membuat tag HTML mereka sendiri. Untuk menghentikan hal ini, dibentuklah sebuah organisasi yang menangani standard dari HTML. Organisasi ini bernama World Wide Web Consortium (W3C).

      HTML 4.0

      Dengan hadirnya W3C sebagai standarisasi HTML, perang browser terhenti. HTML lalu berkembang menjadi HTML 4.0. Versi ini memuat banyak sekali revisi dan perubahan dari versi sebelumnya. Perubahan ini terjadi di hampir seluruh perintah HTML seperti text, link, image, imagemaps, table, form, meta, dan lain lain.

      HTML 4.01

      Versi ini hadir untuk memperbaiki beberapa kesalahan di versi sebelumnya

      XHTML 1.0

      XHTML adalah gabungan dari HTML dan XML. Karena XHTML tidak se-fleksibel HTML, tidak banyak orang yang menyukai versi ini.

      HTML 5

      HTML 5 adalah versi terakhir dari HTML saat artikel ini ditulis. HTML 5 membawa banyak sekali perubahan terhadap versi sebelumnya. Banyak tag baru yang diperkenalkan, seperti <header>,<aside>,<section>,<footer>,dan tag menarik lainnya. Selain itu, HTML 5 mendukung streaming video tanpa menggunakan flash. Lebih lengkapnya akan dibahas dibawah ini

      Fitur Baru HTML 5

      pengertian html fungsi html sejarah html
      Kelebihan HTML 5 sebagai versi terbaru dari HTML, adalah dengan hadirnya fitur fitur menarik. Fitur tersebut diantaranya

      #1 Doctype dan Meta yang lebih pendek

      Doctype dan Meta di HTML 5 menjadi lebih pendek dan mudah diingat. Bentuk Doctype di html 5 seperti ini

      <!doctype html>

      Sedangkan meta tagsnya

      <meta charset="utf-8">

      Jauh lebih pendek daripada versi sebelumnya

      #2 Struktur Baru

      Pada versi sebelumnya, ketika kita ingin membuat struktur website dengan html, kita akan membuatnya dengan tag <div>. Namun di HTML5 ini, hadir beberapa tag yang dikhususkan untuk membuat struktur suatu halaman web.
      • <header> untuk mendefinisikan header halaman
      • <nav> untuk mendefinisikan navigasi halaman
      • <section> untuk mendefinisikan bagian dari sebuah halaman
      • <article> untuk mendefiniskan artikel atau konten utama dari sebuah halaman
      •  <aside> untuk mendefinisikan konten tambahan seperti sidebar dari sebuah halaman
      • <footer> untuk mendefinisikan footer dari sebuah halaman

      #3 Form Web Baru

      Tag <input> pada HTML 5 memiliki banyak tipe baru. Beberapa diantaranya yaitu
      • email : untuk mendefinisikan input yang berupa email
      • tel : untuk mendefinisikan input yang berupa nomor telpon
      • date: untuk mendefinisikan input yang berupa tanggal
      Dan masih banyak lagi. Selain itu ada juga atribut baru required . Dengan atribut ini kita dapat menandai sebuah input wajib diisi, dan jika dikosongi akan mendapat peringatan.

      #4 Tidak Membutuhkan Flash

      Sebelumnya, web sangat membutuhkan flash terutama untuk konten seperti video. Namun pada versi baru ini, hadir tag baru seperi <video> dan <audio> yang dapat diimplementasikan tanpa menggunakan flash. Selain itu ada juga tag <canvas> yang memfasilitasi profuksi grafik permainan interaktif, aplikasi paint, dan grafis lain dengan cepat, tentunya tanpa menggunakan flash.

      masih banyak lagi fitur fitur lainnya yang dibawa oleh HTML 5.....

      Belajar HTML

      HTML adalah bahasa web yang paling mudah dipelajari, karena ini adalah bahasa dasar. Untuk mempelajari bahasa ini anda bisa mengunjungi situs W3C di w3schools.com . Pembelajaran disana lengkap, namun menggunakan bahasa inggris.

      Bagaimana jika tidak bisa bahasa inggris ? Gampang, cari saja di google "Belajar HTML" . Maka akan ada ribuan website yang akan mengajarkan anda bagaimana membuat kode HTML. Jika anda masih belum puas, silakan cari ebook tentang html di google, atau beli buku tutorial HTML di toko buku terdekat.

      Jika anda tidak suka membaca, ada banyak video tutorial html di youtube yang bisa anda tonton.


      Sekian artikel tentang Pengertian HTML, Fungsi HTML serta Sejarah HTML. Semoga bermanfaat. Bagikan juga artikel ini ke teman anda agar mereka juga ikut mendapatkan manfaatnya, serta anda mendapat pahala :)

      8 komentar

      Saya baru mengenal istilah html tapi dengan penjelasan ini serasa membuka pintu ilmu yang lebih luas lagi.
      Terima kasih banyak,,,semoga sukses

      Permisi Gan. Ane Mau Minta Izin Copas Buat Blog Ane. Ane Anak IT Jurusan RPL Dan Ane Mau Belajar NgeBlog, Tpi Ane Masih Pemula. Mao Minta Izin Copas Buat Belajar

      maaf fungsi ini kalau gabar buruk dalam jikau melakukan jiwaku

      Lengkap banget infonya.. Terimakasih

      maksih buat infonya gan ,, smoga bermanfaat

      jelas n lengkap ,.thnks
      sukses

      Komentar yang anda masukkan akan dimoderasi terlebih dahulu oleh admin. Komentar berbau promosi, akan dihapus.

      EmoticonEmoticon