Pengertian Dan Belajar HTML

Pada artikel kali ini saya akan sedikit membahas mengenai pengertian dari HTML dan sekaligus belajar membuat kode HTML. Seringkali kita mendengar kata tersebut dalam dunia blog / website. Namun mungkin ada sebagian yang belum memahami artinya. Langsung saja to the point :

1. PENGERTIAN HTML

HTML kepanjangan dari HyperText Markup Language. Yaitu bahasa standar yang digunakan untuk mengolah kode html menjadi sebuah halaman web. Intinya adalah bahasa yang digunakan untuk membuat sebuah web.

2. BELAJAR MEMBUAT KODE HTML


Berikut saya kasih contoh cara membuat dokumen html sederhana :

1. Buka notepad pada komputer Anda

2. Copy kode di bawah ini : 




3. Paste kode pada notepad (lihat gambar 1)
http://hendrasuhendra176.blogspot.com/2014/05/pengertian-dan-belajar-html.html
Gambar 1

4. Klik save as

5. Save as type : pilih All Files (lihat gambar 2)
http://hendrasuhendra176.blogspot.com/2014/05/pengertian-dan-belajar-html.html
Gambar 2

6. Simpan file tersebut di my documents dengan extension .htm atau .html.

Contoh : belajar bikin web.htm atau bisa juga : belajar bikin web.html

7. Buka internet browser Anda

8. Klik menu File -> Open (lihat gambar 3)



http://hendrasuhendra176.blogspot.com/2014/05/pengertian-dan-belajar-html.html
Gambar 3




9. Klik -> Browse (lihat gambar 4)








http://hendrasuhendra176.blogspot.com/2014/05/pengertian-dan-belajar-html.html
Gambar 4

10. Cari file yang Anda save tadi (belajar bikin web.htm) (lihat gambar 5)




http://hendrasuhendra176.blogspot.com/2014/05/pengertian-dan-belajar-html.html
Gambar 5

11. Klik -> Open

12. Klik -> Ok

13. Selesai

Berikut penjelasan tentang kode - kode html diatas :

Tag Dasar HTML :

- tag <html>

Tag ini merupakan tag paling awal dari suatu dokumen HTML. Dan harus selalu diakhiri dengan tag </html>. Isi seluruh dokumen HTML selalu ada diantara tag <html>...</html>.

- tag <head> atau "header"

Tag ini berupa isi informasi dari dokumen HTML (isi web). Dan mesti harus selalu diakhiri dengan tag </head>.

- tag <title> atau "judul"

Tag ini merupakan titel dari dokumen HTML. Titel ini akan muncul di titel dan tab browser. (lihat contoh pada gambar 6 berikut)



http://hendrasuhendra176.blogspot.com/2014/05/pengertian-dan-belajar-html.html
Gambar 6

- tag <body> atau "isi dokumen"

Tag ini merupakan isi dari suatu dokumen HTML yang akan ditampilkan di halaman web browser. Isi dokumen bisa berupa format teks, grafik, audio, video, link maupun animasi.

<p>...</p> tag untuk membuat sebuah paragraf.

<br> tag ini digunakan untuk membuat baris baru. Tag ini tidak perlu tag penutup.

<b>...</b> tag ini digunakan untuk membuat teks / tulisan jadi tebal (bold).

<strong>...</strong> tag ini digunakan untuk membuat teks / tulisan jadi tebal (sama dengan fungsi bold, hanya beda perintah saja).

<i>...</i> tag ini digunakan untuk membuat teks / tulisan jadi miring (italic).

<u>...</u> tag ini digunakan untuk membuat teks / tulisan jadi bergaris bawah (underline).

<strike>...</strike> tag ini digunakan untuk membuat teks / tulisan jadi tercoret (strike).

<big>...</big> tag ini digunakan untuk membuat teks / tulisan lebih besar dari ukuran normal.

<small>...</small> tag ini digunakan untuk membuat teks / tulisan lebih kecil dari ukuran normal.

<sub>...</sub> tag ini digunakan untuk membuat tulisan Subscript.

<sup>...</sup> tag ini digunakan untuk membuat tulisan Superscript.

<hr> tag ini digunakan untuk membuat garis horizontal. Tag ini tidak memerlukan tag penutup.

<h1>...</h1> tag ini disebut juga Heading (kepala). Tag ini merupakan ukuran teks untuk judul, bab atau sub-bab lainnya. Ukuran paling besar h1 dan yang paling kecil h6.

<!--...--> tag ini untuk memasukkan suatu komentar di dalam kode HTML. Komen ini tidak akan tampil pada halaman browser. Berfungsi untuk menjelaskan suatu hal.

<pre>...</pre> tag untuk menampilkan teks sesuai dengan yang kita tulis.

Nah itu tadi sob, artikel saya mengenai pengertian dan belajar html. Kode html diatas hanya sebagian kode - kode dasar, namun masih lebih banyak lagi kode - kode html. Mudah - mudahan dapat bermanfaat buat sobat blogger.

2 comments

makasih mas hendra, tapi tampilan yang explorer saya tidak sama seperti digambar kenapa ya?

Reply

Biasanya beda versi mas, tapi nggak masalah sih selama masih bisa sih. Terimakasih udah mampir di blog saya

Reply

Post a Comment