 |
| poto/unsplash |
Susunan beberapa baris perintah yang berjajar ke bawah, juga memiliki fungsi dan perannya masing-masing. Diawali dengan code pembuka, judul, isi, dan terakhir penutup. Merupakan isi dari struktur HTML yang baku. Artinya, jika salah satu tidak ada, maka sudah dapat dipastikan, website yang dibuat gagal.
Struktur HTML
 |
| poto/pribadi |
Baik di awal dan akhir perintah-perintah yang ada, dibungkus dengan menggunakan tanda kurung </>. Cara agar mudah mengingatnya yaitu, syntax diawali dengan <html>, lalu ditutup dengan </html>, dan setiap penutup ditandai dengan garis miring.
<html>_____</html>
Merupakan perintah pokok, sebagai penanda bahwa code yang sedang dikerjakan ialah HTML. Sesuai fungsi tersebut, maka tidak dapat digantikan oleh yang lain, begitu juga letak posisinya. Berada di atas, atau pertama, dan penutupnya ada di paling akhir.
<head><title>LUSI DAN</title></head>
Berfungsi untuk memberi judul website. Untuk membedakan antara milik kita dengan orang lain. Boleh menggunakan nama sendiri, seperti saya. Atau menyesuaikan niche blog masing-masing. Misalnya “Teknologi Kekinian”, “WEB Makan”, “Distro Biru”, dan lain sebagainya.
<body>_____</body>
Tidak kalah penting dengan code lainnya. Pada bagian ini berisikan semua konten yang terdapat pada website. Berupa teks, gambar, audio, video, grafik. Disusun secara sistematis dan dinamis. Menyampaikan informasi kepada pengunjung.
Teks Perkenalan
Seperti penjelasan sebelumnya, kita akan mencoba menampilkan tulisan singkat mengenai biodata diri. Kita sudah membahas, fungsi code <body>, maka semua konten pada website harus terletak pada bagian tersebut. Agar dapat dijalankan dengan baik. Jika menulis di luar dari itu, ketika dicompile, maka hasilnya akan kosong.
Tahap I
Pertama buka terlebih dahulu aplikasi Sublime Text 3. Lalu buat folder, agar memudahkan silakan diberi nama masing-masing. Caranya yaitu, klik File-Open Folder- Klik Local Disk C. Ketika sudah terbuka, arahkan ke folder XAMPP-double click htdocs.
Tahap II
Selanjutnya, pilih New Folder, langsung ketik “lusidan”(sebagai contoh, tulisan menggunakan huruf kecil dan tanpa spasi). Hal ini dilakukan, agar untuk memudahkan langkah compile. Boleh saja berisi kapital atau angka, namun, dikhawatirkan dapat sulit mengingatnya.
Setelah itu, kita perlu file sebagai lembar kerja. Shortcut yang dapat digunakan yaitu, menekan beberapa perinta pada tombol keyboard, CTRL+N, untuk menampilkan halaman baru. Lalu, CTRL+S, berfungsi menyimpan.
Cukup arahkan ke folder masing-masing, dengan langkah yang sama seperti Tahap I. Simpan dengan nama “file1.html”. Aplikasi Sublime Text 3, memiliki fitur yang mempermudah pekerjaan. Pada lembar kerja yang kosong, silakan ketik “html”, lalu tekan tombol Tab pada keyboard, maka struktur html sudah otomatis akan tampil.
 |
| poto/pribadi |
Tahap III
Aktifkan terlebih dahulu, jaringan LocalHost melalui XAMPP. Lalu buka browser di komputer, seperti Mozilla Fire Fox, namun, saya menggunakan Google Chrome. Pada kotak pencarian, ketik “localhost/lusidan(silakan isi sesuai nama masing-masing)”, selanjutnya tekan enter.
Klik “file1.html”, maka hasil code tadi akan tampil, seperti di bawah ini.
 |
| poto/pribadi |
File Ekstensi
Setiap lembar kerja yang disimpan, akan memiliki format masing-masing, sesuai aplikasi yang digunakan. Pada kali ini, menggunakan .html(dibaca : dothtml). Sebagai pembeda, dan tidak dapat diganti dengan koma, atau tanda baca lainnya.
Semoga pembahasan kali ini tidak membingungkan, dengan kalimat atau gambar pendukung. Sekadar mengingatkan untuk tetap menjaga protokol kesehatan, menggunakan masker ketika bepergian, dan tetap menjaga jarak.
Posting Komentar
Posting Komentar