Pelajaran HTML Dasar

Browse » Home » Pelajaran HTML » Pelajaran HTML Dasar

Hari ini kita akan belajar bersama dan mengenal lebih dalam mengenai tag HTML, mungkin perasaan sobat saat mulai memahami apa itu HTML, sobat akan merasa penasaran sama seperti saya, sobat sudah ingin sekali mengetahui apa saja tag tag HTML itu. Saran saya, sebagai weber pemula kita harus bersabar, karena walaupun sobat sudah mengetahui bahwa HTML itu mudah, sobat harus lebih tekun dan fokus serta teliti mempelajarinya.

sebagai pelajaran dasar, seperti w3schools.com ajarkan kepada saya, kita akan memulai mempelajari tag tag dasar dari HTML, seperti <h1>, <p>, <a>, <img> dan masih banyak lagi.

Jangan khawatir jika contoh menggunakan tag HTML belum sobat pelajari.

Sobat akan belajar tentang tag HTML dalam postingan berikutnya.

Mengapa kita harus bersabar, karena ketika kita mempelajarinya satu per satu maka secara otomatis segala macam tag HTML akan tertanam dalam otak kita dan tidak mudah dilupakan. salah satu efek dari belajar instan adalah kita mudah melupakannya. berbeda dengan mempelajarinya secara teliti. Dan tidak usah panjang lebar lagi, ini dia tag HTML yang harus diketahui oleh seorang weber pemula.

Seperti pada postingan sebelumnya tentang Pelajaran HTML Dasar, seperti cara penulisan serta cara meletakan atau struktur HTML, sekarang kita akan kembali mempelajari tentang tag HTML :

HTML Heading

Mengenai HTML Heading, kebanyakan seorang weber pemula menggunakannya untuk memperbesar huruf dan mengecilkan huruf, itu salah. Dari ke enam tag HTML Heading mulai dari <h1> s/d <h6>, itu adalah tag untuk mendeklarasikan sebuah Heading, diperuntukan untuk sebuah judul, seperti judul blog ini, karena Belajar Web Bersama Dat-s adalah sebuah judul blog atau judul teratas maka dia menggunakan tag <h1>, sedangkan judul postingan menggunakan tag <h2>, jangan sobat menggunakan tag ini untuk memperbesar dan mengecilkan suatu kalimat atau huruf, karena, sekali lagi itu salah.

HTML hanyalah bahasa formating atau bahasa markup, untuk mengatur ukuran besar huruf atau warna huruf, itu tugas dari CSS yang nantinya akan kita pelajari bersama pada postingan postingan selanjutnya

Nah di bawah ini adalah contoh penulisan tag HTML Heading :

<!DOCTYPE html>
<html>

<head>

<title>Pengenalan HTML Heading</title>

</head>

<body>

<h1>Ini adalah HTML Heading h1</h1>
<h2>Ini adalah HTML Heading h2</h2>
<h3>Ini adalah HTML Heading h3</h3>
<h4>Ini adalah HTML Heading h4</h4>
<h5>Ini adalah HTML Heading h5</h5>
<h6>Ini adalah HTML Heading h6</h6>

</body>

</html>

Coba sobat, buka Notpad seperti yang sudah kita pelajari bersama pada postingan sebelumnya dan ketikan seperti terlihat pada contoh di atas, setelah itu save dan jalankan file html tersebut.

Maka tampilannya akan terlihat seperti di bawah ini :

Nah demikian contoh penulisan tag HTML Heading dan Tampilannya, selanjutnya, setelah kita mempelajari tag HTML untuk judul, sekarang kita akan mempelajari tentang tag HTML paragraf, dan seperti yang sudah kita pelajari bersama pada pelajaran HTML Dasar sebelumnya, ini dia tag HTML paragraf :

HTML Paragraf

Setiap paragraf didefinisikan dengan tag HTML <p> seperti pada contoh di bawah ini :

<!DOCTYPE html>
<html>

<head>

<title>Contoh Paragraf</title>

</head>

<body>

<h1>Ini adalah Contoh Paragraf HTML</h1>
<p>Ini adalah paragraf.</p>
<p>Ini juga adalah paragraf lainnya.</p>

</body>

</html>

Setelah sobat mengetik tag di atas, saat dijalankan filenya, maka hasilnya akan terlihat seperti pada gambar di bawah ini :

Selanjutnya, setelah kita mempelajari HTML heading dan HTML paragraf, maka selanjutnya kita akan mempelajari cara membuat link dengan tag HTML, atau dalam kata lain kita akan mempelajari tentang tag HTML Link.

Pernahkah sobat melihat suatu text di halaman web yang ketika diklik akan meload suatu halaman atau akan membuka suatu halaman baru? nama dari text tersebut adalah link, di bawah ini adalah cara membuat link dengan tag HTML link.

HTML Link

Untuk membuat suatu link, kita akan menggunakan tag <a> seperti pada contoh di bawah ini :

<a href="http://belajar-web-bersama-dats.blogspot.com">Cara Asik Belajar Web</a>

Catatan : Alamat link ditentukan dalam atribut href.

(Kita akan belajar tentang atribut dalam postingan postingan selanjutnya dari pelajaran HTML).

Selanjutnya kita akan belajar mengenai cara menampilkan gambar pada dokumen HTML, langsung saja pada contoh di bawah ini :

HTML Image

Untuk menampilkan gambar pada dokumen HTML, tag yang kita butuhkan adalah tag <img>, coba ketikan tag sesuai contoh di bawah ini :

Catatan: Nama file dan ukuran gambar disediakan sebagai atribut.

Sobat pasti bertanya kenapa tag <img> tidak menggunakan tag penutup, tetap sabar dan tekun berlatih karena itu akan kita bahas pada postingan postingan selanjutnya.

Oke sobat, demikian dulu pelajaran kali ini mengenai Pelajaran Dasar HTML, semoga bermanfaat.

Sukses Selalu ^_^