Hallo teman-teman semua, postingan kali ini akan melanjutkan postingan mengenai HTML sebelumnya, dimana kita tau, postingan sebelumnya yaitu mengenai Sejarah Singkat HTML, disana kita sudah bahas perkembangan dari HTML mulai dari yang pertama sampai kepada yang terbaru. Yaiutu HTML versi 5. Namun, di artikel sebelumnya, sebenarnya masih banyak yang kurang, jadi, nanti sedikit-sedikit kita akan tambah-tambah kan untuk kedepannya.
Pada postingan artikel kali ini, saya akan mulai mengajarkan atau lebih tepatnya memberikan tutorial cara untuk menampilkan hello, World ke layar browser kalian. Seperti yang kita tau yah, kebanyakan bahasa pemrogramman, pasti membuat hello world dulu untuk yang pertama kalinya. Sekarang kita juga akan lakukan hal yang sama pada materi HTML ini.
Pada postingan artikel kali ini, saya akan mulai mengajarkan atau lebih tepatnya memberikan tutorial cara untuk menampilkan hello, World ke layar browser kalian. Seperti yang kita tau yah, kebanyakan bahasa pemrogramman, pasti membuat hello world dulu untuk yang pertama kalinya. Sekarang kita juga akan lakukan hal yang sama pada materi HTML ini.
Cara Menampilkan Hello, World! ke layar di HTML5
- Pertama kalian siapkan dulu komputer atau laptop yang akan digunakan buat ngodinya. Nah kalau kalian ada yang gk punya PC atau Laptop, ngoding di HP juga bisa, dengan catatan, HP kalian sudah Android dan install software pendukung yang bisa membantu dalam ngoding HTML ini.
- Kedua, siapkan software yang akan digunakan, disini saya akan menggunakan Sublime Text versi 3 untuk materi HTML ini, karena selain ringan, ukurannya juga cukup kecil untuk di download. Sehingga buat kalian yang gk punya spek pc yg high, tetap bisa mengikuti.
- Siapkan juga web browser, dalam kasus ini, saya akan menggunakan Google Chrome.
Link Download Software yang dibutuhkan :
Google Chrome : Download Disini
Sublime Text 3 : Download Disini
Selanjutnya, setelah software nya kalian miliki atau sudah di download, silahkan lanjutkan ke tutorialnya.
Tutorial HTML5 #2 - Hello, World!
1. Buka Sublime text, klik file > New File. Atau bisa juga menggunakan CTRL+N.
2. Save document dengan menekan CTRL+S dan tentukan dimana akan menaruhnya.
3. Setelah itu, ketikkan beberapa baris kode dibawah ini.
<!DOCTYPE html>
<html>
<head>
<title>Document</title>
</head>
<body>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Document</title>
</head>
<body>
</body>
</html>
4. Boleh di copy paste, atau jika kalian sudah menginstall emmet di code editor kalian, silahkan ketikkan tanda seru (!) lalu tab, maka akan dibuatkan baris kode seperti diatas.
5. Tambahkan tag
<h1>Hello, World!</h1>
Diantara tag pembuka dan penutup body, sehingga hasilnya seperti ini.
5. Terakhir boleh klik kanan di sublime text nya lalu open in browser, atau cari folder tempat kalian menaruhnya, lalu double klik.
Maka tampilannya akan seperti ini.
5. Tambahkan tag
<h1>Hello, World!</h1>
Diantara tag pembuka dan penutup body, sehingga hasilnya seperti ini.
5. Terakhir boleh klik kanan di sublime text nya lalu open in browser, atau cari folder tempat kalian menaruhnya, lalu double klik.
Maka tampilannya akan seperti ini.
Bagaimana, mudah bukan.?, setelaj artikal ini dibut, nanti saya akan membuatkan lagi beberapa tutorial untuk html yang lebih lanjut lagi, seperti membuat link, heading, paragraf dan masih banyak lagi.
Nantikan terus artikelnya ya guys.
Nantikan terus artikelnya ya guys.
Tidak ada komentar