Tutorial HTML #2 - Hello, World!

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 menaruh tutorial cara buat menampilkan hello, World ke layar browser kalian. Seperti yang kita tau yah, kebanyakan bahasa pemrogramman, niscaya menciptakan hello world dulu untuk yang pertama kalinya. Sekarang kita pula akan lakukan hal yg sama dalam materi HTML ini.

Hello, World! pada html

Cara Menampilkan Hello, World! Ke layar pada HTML5

  1. 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.
  2. 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.
  3. Siapkan juga web browser, dalam kasus ini, saya akan menggunakan Google Chrome.

Link Download Software yg dibutuhkan :

Google Chrome : Download Disini

Sublime Text 3  : Download Disini

Selanjutnya, sehabis aplikasi nya kalian miliki atau telah di download, silahkan lanjutkan ke tutorialnya.

Tutorial HTML5 #dua - Hello, World!

1. Buka Sublime text, klik file > New File. Atau bisa juga menggunakan CTRL+N.

Tutorial html, hello world

Dua. Save document menggunakan menekan CTRL S & tentukan dimana akan menaruhnya.

Tutorial html, hello world

Tiga. Setelah itu, ketikkan beberapa baris kode dibawah ini.

<!DOCTYPE html>

<html>

<head>

<title>Document</title>

</head>

<body>

</body>

</html>

4. Boleh pada copy paste, atau apabila kalian sudah menginstall emmet di code editor kalian, silahkan ketikkan pertanda seru (!) kemudian tab, maka akan dibuatkan baris kode seperti diatas.

Lima. Tambahkan tag

<h1>Hello, World!</h1>

Diantara tag pembuka & penutup body, sehingga hasilnya seperti ini.

Tutorial html, hello world

5. Terakhir boleh klik kanan pada sublime text nya lalu open in browser, atau cari folder tempat kalian menaruhnya, lalu double klik.

Tutorial html, hello world

Maka tampilannya akan misalnya ini.

Tutorial html, hello world

Bagaimana, gampang bukan.?, setelaj artikal ini dibut, nanti aku akan mengembangkan lagi beberapa tutorial buat html yg lebih lanjut lagi, misalnya membuat link, heading, paragraf dan masih poly lagi.

Nantikan terus artikelnya ya guys.

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 menaruh tutorial cara buat menampilkan hello, World ke layar browser kalian. Seperti yang kita tau yah, kebanyakan bahasa pemrogramman, niscaya menciptakan hello world dulu untuk yang pertama kalinya. Sekarang kita pula akan lakukan hal yg sama dalam materi HTML ini.

Hello, World! pada html

Cara Menampilkan Hello, World! Ke layar pada HTML5

  1. 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.
  2. 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.
  3. Siapkan juga web browser, dalam kasus ini, saya akan menggunakan Google Chrome.

Link Download Software yg dibutuhkan :

Google Chrome : Download Disini

Sublime Text 3  : Download Disini

Selanjutnya, sehabis aplikasi nya kalian miliki atau telah di download, silahkan lanjutkan ke tutorialnya.

Tutorial HTML5 #dua - Hello, World!

1. Buka Sublime text, klik file > New File. Atau bisa juga menggunakan CTRL+N.

Tutorial html, hello world

Dua. Save document menggunakan menekan CTRL S & tentukan dimana akan menaruhnya.

Tutorial html, hello world

Tiga. Setelah itu, ketikkan beberapa baris kode dibawah ini.

<!DOCTYPE html>

<html>

<head>

<title>Document</title>

</head>

<body>

</body>

</html>

4. Boleh pada copy paste, atau apabila kalian sudah menginstall emmet di code editor kalian, silahkan ketikkan pertanda seru (!) kemudian tab, maka akan dibuatkan baris kode seperti diatas.

Lima. Tambahkan tag

<h1>Hello, World!</h1>

Diantara tag pembuka & penutup body, sehingga hasilnya seperti ini.

Tutorial html, hello world

5. Terakhir boleh klik kanan pada sublime text nya lalu open in browser, atau cari folder tempat kalian menaruhnya, lalu double klik.

Tutorial html, hello world

Maka tampilannya akan misalnya ini.

Tutorial html, hello world

Bagaimana, gampang bukan.?, setelaj artikal ini dibut, nanti aku akan mengembangkan lagi beberapa tutorial buat html yg lebih lanjut lagi, misalnya membuat link, heading, paragraf dan masih poly lagi.

Nantikan terus artikelnya ya guys.

0 Response to "Tutorial HTML #2 - Hello, World!"

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel