Select Page

Bahasa Pemograman HTML adalah dasar dari seluruh halaman web yang ada di Internet. Saya akan mengajak anda untuk berkenalan dengan HTML. Kita akan mempelajari apa itu HTML, fungsi HTML, serta melihat sekilas cara penggunaan HTML dalam situs online.

Bahasa Pemograman HTML

Pengertian HTML

Tutorial Bahasa Pemograman HTMLWalaupun saya yakin sebagian besar dari anda telah mengenal apa itu HTML, atau sudah pernah membuat beberapa kode HTML, tidak ada salahnya kita membahas sekilas tentang pengertian HTML. Barangkali butuh untuk tugas / bahan presentasi. HTML merupakan singkatan dari Hypertext Markup Language. Singkatan ini terdiri dari 3 komponen kata, yakni: Hypertext, Markup dan Language.

Kata Hypertext dari HTML menekankan pengertian: text yang lebih dari sekedar teks (‘hyper’-text). Maksudnya selain berfungsi sebagai teks biasa, sebuah teks di dalam HTML juga bisa berfungsi sebagai penghubung ke halaman lain atau dikenal dengan istilah link. Nantinya kita juga akan melihat bahwa tidak hanya teks saja yang bisa digunakan sebagai link, tetapi bisa berupa gambar. Link inilah yang menjadi inti dari HTML.

Kata kedua dari singkatan HTML adalah Markup. Markup dapat diterjemahkan sebagai tanda atau penanda (bahasa inggris: mark). Di dalam HTML, kita akan menggunakan tanda-tanda khusus seperti <p>, <a>, atau <li>. Tanda ini diperlukan untuk mengatur format dan membuat struktur halaman web.

Bagian terakhir dari HTML adalah Language. Istilah language jika diterjemahkan berarti: bahasa. Khusus bagi anda yang pernah berkenalan dengan bahasa pemrograman komputer, disini HTML tidak menggunakan ‘Programming Language’, tetapi hanya ‘Language’ saja. Hal ini secara tidak langsung menyatakan bahwa HTML bukanlah sebuah bahasa pemrograman. HTML tidak memiliki struktur dasar seperti variabel, kondisi IF, function, atau class seperti layaknya sebuah bahasa pemrograman komputer.

Walaupun menyebut HTML sebagai sebuah bahasa pemrograman secara teknis tidaklah
‘pas’, namun untuk menyederhanakan konsep belajar, istilah tersebut masih saya
gunakan di dalam buku ini.

Merangkum penjelasan diatas, dapat disimpulkan bahwa HTML adalah sebuah bahasa khusus yang ditulis menggunakan tanda-tanda (mark) untuk membuat halaman web. Agar lebih lengkap, mari kita lihat definisi HTML dari wikipedia

“HTML or HyperText Markup Language is the standard markup language used to
create web pages.”

Terjemahan bebasnya:

“HTML atau HyperText Markup Language adalah bahasa markup standar yang
digunakan untuk membuat halaman web.”

Ternyata lebih sederhana dari penjelasan saya diatas 🙂

Fungsi HTML (Tutorial Bahasa Pemograman HTML)

dalam Tutorial Bahasa Pemograman HTML Seperti yang kita ketahui bahwa HTML digunakan untuk membuat halaman web. Tetapi apa sebenarnya fungsi dari HTML?

Dalam proses web development (proses pembuatan web), HTML berfungsi untuk membuat struktur dari sebuah website. HTML digunakan untuk menandai bagian mana yang akan menjadi judul artikel, bagian mana yang berfungsi sebagai isi artikel, atau bagian mana yang butuh disajikan dalam bentuk tabel. Mengenai tampilan dari website tersebut (misalnya apakah akan menggunakan warna background biru atau merah), diserahkan kepada teknologi web lain yang dikenal dengan CSS (Cascading Style Sheet).

Saat ini, untuk membuat sebuah web modern, tidak bisa hanya menggunakan HTML + CSS saja, tetapi juga memerlukan bantuan bahasa pemrograman web lain seperti JavaScript. Di sini saya menggunakan istilah ‘web modern’, karena kita memang bisa membuat website dari HTML saja (tanpa CSS dan JavaScript), tetapi web yang dihasilkan akan terkesan ‘jadul’ karena tidak memiliki tampilan yang cantik (sesuai standar saat ini).

Sama seperti HTML, CSS sebenarnya juga bukan bahasa pemrograman, tetapi adalah
‘bahasa kode’ yang mirip dengan HTML.

Beberapa pertanyaan yang sering muncul ketika baru pertama kali mempelajari HTML adalah bagaimana cara menampilkan bingkai (border) dari gambar atau bagaimana cara membuat menu bar yang muncul sendiri ketika mouse berada diatasnya (menu rollover)?

Semua efek tampilan dan interaksi seperti ini tidak bisa dilakukan dengan HTML saja (terutama untuk menu rollover), tetapi dibuat dengan gabungan HTML + CSS + JavaScript.

Dilihat dari sisi fungsinya, ketiga teknologi web ini berbagi peran masing-masing. HTML digunakan untuk membuat struktur konten atau isi dari halaman web. CSS berfungsi untuk memperindah tampilan, sedangkan JavaScript berperan untuk membuat interaksi. Sebutan kerennya: HTML for content, CSS for presentation and JavaScript for behavior. Ketiga teknologi inilah yang mendasari semua website yang ada di internet saat ini.

Walaupun HTML sepertinya tidak terlalu powerful, tetapi ia adalah dasar dari semuanya. Baik CSS maupun JavaScript harus memiliki struktur HTML untuk dapat bekerja. Bahasa pemrograman web lain seperti PHP atau ASP juga digunakan untuk menghasilkan HTML. Sehingga HTML memiliki peran paling penting dan mutlak harus dikuasai sebelum masuk ke dalam teknologi web lain seperti CSS, JavaScript, atau PHP.

Dalam buku ini saya akan fokus membahas tentang HTML, namun seperti yang
dijelaskan diatas, HTML sangat berkaitan dengan CSS dan JavaScript. Oleh karena itu,
saya akan menggunakan CSS dan JavaScript ketika membahas beberapa fitur HTML.
Sebagai bahan perkenalan dengan kedua teknologi ini, terdapat bab khusus di akhir
buku yang membahas sekilas tentang cara penggunaan CSS dan JavaScript.

Melihat Sekilas HTML

Salah satu hal yang unik dari HTML (juga CSS dan JavaScript) adalah kita bisa melihat dengan bebas kode-kode yang digunakan untuk membuat sebuah halaman web. Caranya, silahkan jalankan web browser (Google Chrome atau Mozilla Firefox), buka sebuah situs web, kemudian klik kanan pada halaman situs dan pilih View page source. Sebagai contoh, di dalam gambar dibawah ini anda dapat melihat kode-kode yang digunakan untuk membuat halaman home dari situs adiperdana.com

berkenalan dengan html

Dalam tampilan ini anda dapat melihat (dan juga bisa mempelajari) seluruh kode HTML, CSS dan JavaScript yang digunakan untuk membuat situs adiperdana.com.

berkenalan dengan html 2

Mengenal Jenis-jenis Bahasa Pemrograman Web

Walaupun buku ini hanya akan membahas tentang HTML, tetapi saya juga ingin memperkenalkan anda dengan teknologi-teknologi pemrograman yang dibutuhkan untuk membuat website. Saya rasa informasi ini cukup penting terutama jika anda baru pertama kali mengenal HTML dan ingin fokus menjadi web programmer.

Seperti yang anda lihat dari source code adiperdana diatas, menguasai HTML saja tidaklah cukup. Dengan jujur saya katakan bahwa jika anda telah selesai membaca buku ini, itu barulah awal dari berbagai teknologi pemrograman web yang harus dikuasai. Selain HTML, bahasa pemrograman lain yang ‘wajib dipahami’ adalah CSS, JavaScript, PHP dan database MySQL. Kelima teknologi ini menjadi dasar untuk dapat membuat website modern.

Sebagai contoh, di dalam buku ini nantinya saya akan membahas tentang cara membuat formdengan HTML. Form biasanya digunakan untuk proses registrasi atau pendaftaran di dalam sebuah situs. Walaupun struktur form dibuat menggunakan HTML, tetapi untuk memperindah tampilan form kita harus menggunakan CSS.

JavaScript berguna untuk menampilkan pesan error secara interaktif ketika user salah memasukkan beberapa data di dalam form. Ketika form selesai di input, untuk dapat memproses isi dari form tersebut, kita harus menggunakan bahasa pemrograman PHP. Sebagai langkah akhir, tentu saja kita ingin menyimpan isi form tersebut ke dalam database MySQL untuk dapat diakses kembali di lain waktu. Dari alur diatas, dapat dilihat bahwa baik HTML, CSS,

JavaScript, PHP dan MySQL saling berhubungan. Kelimanya teknologi web ini secara bersama-sama digunakan untuk menghasilkan web yang modern dan interaktif. Sama seperti disiplin ilmu yang lain, pengetahuan dasar yang kuat akan membantu anda untuk menguasai berbagai aspek seputar cara membuat website, dan sebagai langkah pertamanya adalah dengan mempelajari HTML.

HTML sendiri adalah teknologi yang telah ada selama puluhan tahun dan terus dikembangkan. Saat ini versi HTML terakhir adalah HTML5. Agar lebih mengenal tentang HTML, dalam bab selanjutnya saya akan menjelaskan tentang sejarah dan perkembangan versi HTML.

HTML sendiri adalah teknologi yang telah ada selama puluhan tahun dan terus dikembangkan. Saat ini versi HTML terakhir adalah HTML5. Agar lebih mengenal tentang HTML, dalam bab selanjutnya saya akan menjelaskan tentang sejarah dan perkembangan versi HTML.