Pengenalan HTML
Pengenalan HTML
Apa itu HTML? HTML adalah singkatan dari Hyper Text Markup Language. yang artinya HTML adalah bahasa Mark Up yang digunakan untuk membuat halaman website.
Jika kamu berkeinginan untuk menjadi seorang Web Developer, atau hanya sekedar ingin membuat website pribadi, Maka HTML menjadi salah satu yang pertama kali wajib kamu kuasai.
Jika diibaratkan dengan sebuah bangunan rumah, HTML adalah pondasi dari sebuah bangunan rumah tersebut.
Begitupun pada halaman website, HTML yang berperan sebagai pondasi atau kerangka dari halaman website.
HTML adalah kerangka dari sebuah halaman website. Jika diibaratkan sebuah bangunan, HTML menjadi pondasi dari bangunan rumah tersebut.
Sejarah HTML
HTML pertama kali dibangun oleh Tim Berners-Lee di tahun 1990. Sejak tahun 1996, wewenang untuk menjaga dan memelihara HTML dipegang oleh World Wide Web Consortium (W3C).
HTML juga menjadi standar internasional atau ISO di tahun 2000.
HTML masih terus dikembangkan, dan sampai saat ini pengembangan HTML sudah sampai ke versi HTML5.
Kegunaan HTML
Seperti yang disinggung sebelumnya, HTML menjadi pondasi atau kerangka dasar sebuah halaman website.
Dengan HTML kita bisa membuat berbagai elemen atau komponen website. Seperti misalnya :
- Membuat struktur website
- Membuat link antar halaman
- Menampilkan gambar
- Membuat list
- Membuat form input
- Membuat form input email
- Membuat form input angka
- Membuat tombol
- Membuat paragraf
- Membuat judul / heading
- Membuat tabel
- Membuat tulisan miring (italic)
- Membuat tulisan tebal (bold)
- Dan masih banyak lagi komponen yang bisa dibuat oleh HTML pada halaman website
Masih banyak kegunaan HTML lainnya yang akan kamu pelajari satu persatu dalam seri tutorial belajar HTML dasar untuk pemula ini.
Apa Yang Dibutuhkan Untuk Belajar HTML?
Yang dibutuhkan untuk belajar membuat halaman website dengan HTML adalah Web Browser dan Text Editor.
Web Browser
Karena HTML dijalankan oleh Web Browser, maka kamu wajib mengetahui apa itu web browser?
Web browser adalah aplikasi atau software yang digunakan untuk mencari informasi di internet.
Bisa itu berupa website, video, gambar dan lain-lain. dan semua informasi tersebut diakses melalui alamat URL.
Contoh dari web browser yang terkenal adalah :
- Google Chrome
- Firefox
- Safari
- Microsoft Edge (Dulu Internet Explorer)
- Dan lain-lain.
Text Editor
Text editor adalah wadah atau tempat kita menuliskan kode program.
Contoh text editor sederhana adalah notepad di windows. Tapi notepad tidak memiliki fitur pendukung untuk menulis coding.
Tapi masih bisa digunakan untuk menulis kode program.
Untuk memudahkan kamu menulis code atau script HTML, kamu bisa menggunakan Text Editor yang sudah banyak tersedia secara gratis.
Misalnya :
- Visual Studio Code
- Sublime Text Editor
- Atom
- Notepad ++
- Vim
- Dan lain-lain.
Masing-masing Text Editor di atas memiliki fitur dan kelebihan masing-masing untuk membantu kita dalam menulis kode program.
Misalnya telah ada fitur syntax highlight yang memberi warna pada coding yang kita tulis. Sehingga menjadi lebih mudah dibaca.
Juga terdapat fitur lain seperti fitur auto complete yang membantu kita menulis script atau coding dengan lebih cepat.
Kamu bisa mencoba dan memilih salah text editor dari pilihan di atas.
Lihat juga contoh text editor online gratis di CodeLab codingan.id.
Struktur HTML
Perhatikan pada coding yang sudah kita tulis dalam belajar.html tadi.
Berikut ini adalah struktur atau kerangka dasar dari HTML.
<!DOCTYPE html>
<html>
<head>
<!-- bagian head -->
<!-- akhir bagian head -->
</head>
<body>
<!-- bagian body -->
<!-- akhir bagian body -->
</body>
</html>
Pada sebuah halaman HTML, terdapat bagian head dan body.
Apa bedanya?
Bagian Head
Pada bagian head dijadikan sebagai tempat kita menuliskan atau menghubungkan CSS, JS, menulis Syntax Internal CSS, menuliskan meta tag, judul halaman dan lain sebagainya.
Yang disebutkan diatas tadi akan dibahas satu per satu pada chapter selanjutnya dalam seri Tutorial Belajar HTML ini.
Di sini kita hanya akan fokus pada pengenalan HTML, agar kamu lebih mudah memahami langkah-langkahnya.
Bagian Body
Bagian body adalah tempat kita menuliskan script atau informasi yang ingin ditampilkan pada halaman website.
Contoh HTML
Untuk membuat sebuah halaman HTML, caranya sangat mudah.
Kita cukup membuat sebuah file baru, dan simpan file tersebut dengan ekstensi .html
.
Tips memberi nama file HTML :
- Buat dengan huruf kecil semua.
- Jangan menggunakan spasi, jika harus menggunakan spasi, maka gunakan “_” sebagai pemisah. misal belajar_coding.html agar mudah dibaca.
- Jangan gunakan angka.
Pada contoh ini silahkan buat sebuah file baru dan simpan dengan nama belajar.html
.
Lalu tulis script contoh HTML berikut di dalam file belajar.html.
<!DOCTYPE html>
<html>
<head>
<title>codingan.id</title>
</head>
<body>
<h1>Belajar HTML Dasar di codingan.id</h1>
<p>Ini adalah halaman website pertama saya</p>
</body>
</html>
Lalu buka file belajar.html
ini dengan menggunakan Web Browser dengan cara double click pada file belajar.html
atau klik kanan pada file belajar.html
> Open With > pilih Web Browser.
dan hasilnya seperti berikut.
Silahkan ikuti Tutorial HTML Dasar selanjutnya di codingan.id untuk memahami dan belajar lebih jauh tentang HTML Dasar.
Kamu akan belajar HTML benar-benar dari dasar sampai mahir.