Html dan Text Editor
I. Apa itu HTML?
HTML merupakan kependekan dari Hypertext Markup Language, yang berarti bahasa markup (penanda) berbasis text atau bisa juga disebut sebagai formatting language (bahasa untuk memformat).Kebanyakan orang masih menganggap bahwa HTML adalah Bahasa pemrograman, padahal kalua dilihat dari makna HTML itu sendiri sudah jelas bahwa HTML bukanlah bahasa pemrograman, melainkan bahasa markup/formatting.
HTML merupakan bahasa dasar yang digunakan untuk menampilkan halaman pada sebuah web browser seperti google chrome, mozilla firefox, explore, safari, dll.
II. Belajar membuat HTML sederhana
A. Text EditorDalam membuat HTML, text editor adalah komponen utama yang paling dibutuhkan. Text editor yang dapat digunakan untuk menulis script HTML sangat banyak seperti notepad, notepad++, sublime, dll.
B. Penempatan File dan cara mengaksesnya
1. Buat file sederhana menggunakan text editor
 |
| Gambar II.1 (membuat file sederhana) |
2. Simpan file dengan ekstensi .html
 |
| Gambar II.2 (Menyimpan file) |
Admin memiliki saran penamaan file untuk kalian yang file management nya masih berantakan:
- Sebaiknya kurangi menggunakan spasi dalam menamakan file atau folder. Gunakan underscore “_” sebagai alternatif spasi, contohnya daripada menamai file “belajar html” lebih baik menamainya “belajar_html”. Karena menurut admin, penggunaan spasi dalam penamaan sebuah objek dalam sebuah coding dapat memperbesar kemungkinan error. Walaupun memang ada problem solvingnya, namun bukankah lebih baik mencegah daripada mengobati.
- Sebaiknya, nama file/folder pun dibuat seragam. Seragam yang admin maksud disini adalah penggunaan huruf besar kecil atau case sensitive. Apabila hendak menggunakan huruf kecil, buatlah nama file tersebut agar lowercase, atau dibuat menjadi uppercase, contohnya dari pada menamai file “Belajar_HTML”, lebih baik “belajar_html” atau “BELAJAR_HTML” dan pastikan antar file pun seragamkan. Penulisan alamat file HTML pada web browser memang tidak case sensitive, namun kembali lagi kepada kebiasaan anda coding, semakin rapi code anda, semakin sedikit kemungkinan error dan problem solvingnya lebih mudah.
3. Mengakses file yang telah dibuat
 |
| Gambar II.3 (akses file) |
Cara mengakses file tsb ada 2, yaitu :
- Double-click pada file yang telah dibuat tadi, atau
- Copy path tempat file tersebut berada, dan pastekan di address bar pada web browser
 |
| Gambar II.4(Contoh tampilan file html di web browser) |
C. Membuat File HTML
1. Komponen utama HTML
a) <!DOCTYPE HTML>
Komponen ini harus ada pada file HTML, dan diletakkan di baris pertama code line. Komponen ini menginformasikan kepada web browser bahwa, file yang sedang diakses merupakan file HTML.
b) <HTML> </HTML>
Diantara tag <HTML> dan </HTML>, kode HTML ditulis.
c) <head> </head>
Didalam tag tersebut, akan berisi kode HTML yang berisi informasi tentang dokumen HTML, seperti informasi mengenai judul file atau tampilan file(CSS).
d) <title> </title>
Tag title ini berada didalam tag <head>, yang merupakan salah satu informasi dokumen html tersebut. Diantara tag tersebut akan diisi dengan judul file yang dikehendaki oleh pembuat script.
e) <body> </body>
Diantara tag <body> dan </body> ini akan diisi dengan konten yang akan ditampilkan oleh pembuat script pada web browser
2. Membuat HTML
Setelah belajar mengenai struktur dan komponen utama yang harus ada didalam HTML, satukan komponen tersebut menjadi satu kesatuan file HTML.
a) Susunan dasar file HTML dapat ditulis sebagai berikut:
<!DOCTYPE HTML> <HTML> <head> <title> (Judul file HTML) </title> </head> <body> (Konten yang akan ditampilkan pada web browser) </body> </HTML>
b) Contoh kode
 |
| Gambar II.5 (Contoh penulisan kode HTML) |
c) Tampilan kode pada web browser
 |
| Gambar II.6 (Tampilan file HTML pada web browser) |
Terimakasih mas, Amin.
ReplyDelete