j5XpcW8LPSTMXB3E43AmnBvL2r59s0Bn3s1rqebM

Tutorial Belajar HTML 2: Membuat Halaman Web

Cara membuat halaman HTML - Ok jadi mari kita mulai untuk membuat halaman web sederhana untuk menggambarkan lebih jauh bagaimana cara kerja HTML.

Tutorial html ini adalah bagian dari Web Development Course, harap kunjungi course tersebut untuk informasi pembelajaran lebih lengkap!

Perlu diingat halaman web yang dimaksud disini ialah halaman web offline dimana hanya anda sendiri yang bisa mengaksesnya, dengan kata lain tidak di hosting di server online.

Pertama kita buka terlebih dahulu VS Code kita masing-masing, untuk anda yang belum menginstall VS Code, silahkan ikuti tutorialnya disini Install VS Code, kemudian kita buat file baru dengan cara menekan tombol shortcut Ctrl+N atau buka File kemudian pilih New File.

new file vs code

Setelah kita buat file baru, sekarang kita langsung save file tersebut dalam format HTML, caranya adalah dengan cara masuk ke File Header kemudian pilih Save, atau shortcut Ctrl + S.

save file vs code

Setelah itu kita beri nama 'Test01.html'

Dan pada Save as type pilih ke HTML.

save as type vs code

Dengan memberikan format file HTML, maka secara otomatis, visual studio code akan memberikan color type pada kode html agar lebih mudah dibaca, selain itu hal ini juga akan memberi tahu web browser bagaimana file ini dijalankan. Sebagai tambahan, format file itu ada macam-macam, ada mp4 untuk video, mp3 untuk audio, exe untuk application dll.

Setelah itu kita akan langsung mencoba untuk menuliskan satu paragraf ke dalam file tadi dan menjalankanya di web browser, dalam kasus ini kita akan menggunakan Chrome.

Untuk paragrafnya silahkan anda copy paste dari sumber manapun di internet dan letakan di file ini, disini saya akan mengcopas paragraf dari wikipedia tentang pemrogramman.

membuat halaman html

Kemudian kita pilih save.

Disini kita bisa melihat previewnya di web browser, caranya adalah dengan membuka file yang sudah disimpan tadi dengan cara double klik, atau bisa juga dengan klik kanan, kemudian open with lalu pilih google chrome.

cara buka file html

Jadi ingat-ingat letak kamu menyimpan file tadi, untuk saya sendiri saya biasa menyimpan file HTML di document kemudian buat folder HTML lalu saya simpan di folder ini.

Berikut adalah hasil dari file html yang dibuka dengan chrome.

contoh file html

Seperti yang anda lihat, pada dasarnya file ini hanya menampilkan teks paragraf tanpa ada struktur sama sekali, oleh karena itu mari kita buat beberapa markup html untuk membuat kata 'pemrogramman' bercetak tebal.

Untuk melakukanya kita buka VS Code, kemudian kita masukan tag <b> didepan kata pemrogramman dan kita beri tag </b> di akhir kata pemrogramman, lalu kita save.

<b>pemrogramman</b>

Dengan melakukan ini maka kata pemrogramman akan bercetak tebal, untuk melihatnya silahkan anda refresh halaman tadi.

Dan berikut adalah previewnya.

contoh penggunaan tag html

Untuk tutorial berikutnya kita akan belajar tentang Paragraf Elemen.

Related Posts
Krakenost
Never Stop Dreaming

Related Posts

Post a Comment