Tuesday, May 26, 2020

Tutorial HTML Dasar : Part 2 - Coding Awal "Hello World"

Poseidonwood May 26, 2020 3 Comments

Menampilkan "Text Hello World" pada HTML

"Hello World" - Kali ini kita akan menampilkan tulisan "HELLO WORLD" sebagai permulaan web sederhana yang akan kita buat. Berikut langkah - langkah yang akan kita lakukan :

Silahkan Buka Notepad ++ nya

Ketik kode berikut di notepad++ nya :

Atau bisa liat contoh dibawah ini :

Tulis code berikut pada notepad ++ kalian

Jika sudah kalian simpan dengan cara klik save as maka akan keluar tampilan berikut :

Perhatikan Filename : Pastikan namanya "index" dan di belakangnya ".html"
Perhatikan Save as type : Pastikan menjadi Hyper Text Markup Language (.html)
Jika sudah tekan "Save"
Dan jangan lupa untuk menyimpan di Dekstop saja

Setelah itu coba kita buka file yang sudah kita simpan tadi dengan nama "index.html" di dekstop kalian.

Double Klik "index.html" untuk melihat hasilnya.

Maka hasil web yang kita buat tadi seperti ini :

Tampilan Hello World Pada Google Chrome

Penjelasan :

Pada source code di atas , perhatikan bagian "<!DOCTYPE html>" yang merupakan deklarasi pada dokumen HTML5 yang berfungsi untuk memberikan informasi kepada web browser tentang versi dokumen HTML tersebut.
"<html>" diatas dan "</html" di bawah. Merupakan bagian dari isi code HTML tersebut yang mana code html harus berada di antara <html>dan </html>
"<head>" dan "</head>" sama seperti tag <html> </html> cuman head disini hanya di isi oleh bagian atas html atau metadata : seperti css,title, java script . untuk jelasnya tentang head bisa klik link ini : tag <head>
<body> merupakan element penting dari isi html tersebut yang isi nya meliputi heading , paragrap , gambar , hyperlinks , table , list dan lain lain. Semua element tersebut harus di tempat kan di antara <body> dan </body>.
<h1> adalah heading , yang biasa nya untuk membuat judul di dalam html , adapun h1,h2,h3... h6 yang mana h1 merupakan ukuran tulisan terbesar dan h6 merupakan yang terkecil.
<p> artinya paragraf untuk membuat baris baru sebagai paragraf.

Baik , kita sudah berhasil membuat web sederhana untuk menampilkan tulisan "hello world" pada postingan berikutnya kita akan membuat table pada html.

Terimakasih.