Blog Business Review Gadget Games General Highlight Humour Internet Mailbox Opinion Tips&Tricks Tutorial

Belajar HTML lebih lanjut – Bagian 1



Author: DHINATACOM
Posted: 12.08.2008 at 20:20.
14 Komentar.

Bahasa HTML memiliki tugas penting dalam sebuah website/blog, yaitu menampilkan isi suatu halaman yang bisa terdiri dari teks, gambar, audio, video, dan lain-lain. Maka HTML memiliki beragam sintaks penting yang sudah dibuat standarnya oleh W3C. Pada artikel kali ini kita akan kembali membahas beberapa sintaks penting HTML dan cara penggunaannya. Materinya sesuai dengan yang saya janjikan kemarin, porsinya sesuai dengan yang Anda butuhkan sebelum membuat theme sendiri. Mari kita mulai..

Pendahuluan

Perintah-perintah dalam HTML biasa disebut dengan tag. Aturan tag standar HTML yang harus ada sudah pernah dibahas. Cara penulisannya tidak bersifat case sensitive. Jadi penulisan tag <HTML> akan dianggap sama dengan <html> oleh browser.

Struktur HTML

3 bagian utama HTML adalah HTML, HEAD, dan BODY. Urutannya sebagai berikut.

  1. <html>
  2. <head>
  3. <title></title>
  4. </head>
  5. <body></body>
  6. </html>

Tag <html> harus ada dibagian awal lalu diakhiri dengan </html>.

Tag <head></head> mengapit tag <title></title> yang fungsinya menampilkan judul halaman pada browser. Tag META juga ada dibagian HEAD. Fungsi dan cara penggunaan tag META juga dibahas diartikel ini.

Tag <body></body> berfungsi untuk menampilkan semua elemen isi dari halaman web seperti teks, link, gambar, dll.

Tag Standar HTML

Meta. Tag META berguna untuk menampilkan informasi mengenai suatu dokumen HTML. Biasanya untuk memuat informasi mengenai author, keyword, dan lainnya.

Cara penulisannya sebagai berikut:
<META name="ATTRIBUTE" content="value">
.

Misal untuk memberikan informasi tentang author, cara penulisannya tagnya sebagai berikut:
<META name=”Author” contents=”Yoki DHINATA”>.

Contoh atribut META tag lainnya yang bisa Anda gunakan bisa dilihat pada source code halaman ini.

Heading (H1 – H6). Berfungsi untuk membuat judul halaman dengan batas antara H1 – H6. Masing-masing tag memiliki ukuran yang berbeda, dari tingkat paling besar hingga lebih kecil. Cara penulisannya sebagai berikut: <h1>Contoh tag H1</h1>.

Paragraf (<p></p>). Fungsinya untuk membuat paragraf, sehingga akan secara otomatis memberikan jarak vertikal antara bagian atas dan bawahnya. Cara penulisannya sebagai berikut: <p>Contoh tag paragraf</p>.

Break (<br />). Fungsinya sama dengan tombol Enter pada keyboard yaitu membuat jarak kebawah 1 baris. Cara penggunaannya sangat mudah seperti ini:

Ini adalah kalimat pertama.<br />Ini adalah kalimat kedua.

Jika dilhat dengan browser, maka letak kalimat kedua akan turun 1 baris berada dibawah kalimat pertama seperti ini:

Ini adalah kalimat pertama.
Ini adalah kalimat kedua.

Horizontal Rules(<hr />). Berfungsi untuk membuat garis horizontal pada halaman. Cukup dengan meletakkan tag <hr /> maka 1 garis horizontal sudah muncul, jadi gunakan saja sebagai pemisah antara bagian halaman.

Besok kita akan melanjutkan lagi dengan pokok bahasan format font, link, dan gambar.

Jangan sampai terlewat ya!



komentar pembaca DHINATACOM

  1. adit says:

    maaf saya pemula dan buta akan web dan saya harus belajar dari mana! Makasih mohon pencerahannya….

    • Yoki says:

      pertama belajar HTML
      kedua css
      ketiga baru php

      gitu aja sih biar lebih terarah

      sukses mas!

  2. Bukankah yang bener kayak yang dibawa ini mas???

    thx hehehehhe… mimpi

  3. Ardi says:

    Saya seorang guru, saya ingin sekali membuat blog yang menarik sehingga murid2 saya tertarik jika di beri tugas di blog….Gmna cara membuat header(tag) seperti;home,kontak,profil,dll.
    Mohon dibalas di email saya dan mohon liat juga blog saya untuk tahu masalah saya…
    Matur nuwun Mas, Semoga ilmunya selalu berguna buat Qta semua…

  4. auwibi aqdamana says:

    mimpi keren banget nih ilmu nya…saya mendukung 200 % buat blog yang telah memberikan ilmu nya semoga anda dapat balasan dari yang maha kuasa amin sukses terus ya buat Yoki Dhinata

  5. afdil says:

    kalau untuk mencegah orang lain membuat tautan link di komentar, bagaimana caranya ya?

  6. buce says:

    bos,,,msih bingun ni,,html sih ngerti,,tp yg ga ngerti “meta” fungsinya buat apa ya???????

  7. nda_kidz says:

    mw tnya klo bwat persntasi bgusnya bkin ap ya???
    web atw vb???

    thanxs..
    tlng d blz… malu

  8. asri says:

    Bos, aku g tau sama sekali maslh Html, bisa dikirimin html cara design blog… mohon bantuannya.. salaman

  9. hasben says:

    keren ajarin doonk

  10. mega says:

    mas mo tnya,saya baru bljr html tp koq pada saat saya mau menampilkan gambar gak bisa, saya pake sintaks img src.tolong dibls ke email
    thanks… salaman

  11. belajar html says:

    bro, ada ebooknya yang lebih lengkap nggak bro.. klo ada share disini bro biar bisa kita pelajari, hehe.. salam knal ya….. D

  12. […] HTML ada diurutan pertama karena merupakan bahasa pemrograman utama yang WAJIB dipelajari dalam membangun sebuah halaman blog/website. Setelah halaman dasar dibangun, CSS digunakan untuk memberikan “makeup” pada halaman. Sebagai langkah awal gunakan saja tag PHP standar bawaan dari theme blog yang sudah ada. JavaScript bisa Anda pelajari untuk membuat halaman blog lebih interaktif, tapi tidak mutlak. […]

D . ( . P . diem . piss . kaget . nocomment . malu . mimpi . licik . ide . yess . tipi . tendang . sombong . sinchan . sial . senam . nyerah . ngiler . nggaya . nangis . musik . males . love . konslet . kembar . gatau . damn . bye . ayuk . belajar . tutupkuping . tolong . terharu . strees . serang . sendiri . ngakak . mimisan . mati . mantap . kesel . keren . kartukuning . kartumerah . fiuhhh . cendol . salaman . recseller . maho . marah . najis . kiss . bingung . berduka . takut . ngacir . ngacir2 . janganribut . capedeh .

Petunjuk komentar:
1. Tolong tulis komentar yang berhubungan dengan topik artikel. Jangan mengirim SPAM!
2. Komentar yang tidak berhubungan atau SPAM akan dihapus.
3. Klik gambar emoticon diatas untuk menampilkannya pada komentar Anda.

Catatan: Beberapa emoticon yang ditampilkan merupakan hak cipta dari Kaskus.

(required)

home DHINATACOM


Home Article Index Contact Disclaimer F.A.Q


langganan majalah DHINATACOM
Artikel Terbaru

Membersihkan Jamur di Dinding Apartemen

3 Hal Penting Yang Menentukan Kecantikan Pada Rumah Minimalis

Disclaimer . Contact Info . Privacy Policy . F A Q . Servis Komputer Tangerang
DHINATA.COM © 2008-2017 oleh Yoki DHINATA. Theme: D-Magz 3.1
Desain Tema oleh Yoki DHINATA. My Copyright Is Not Your Right To Copy.
Powered by WordPress. Hak Cipta Dilindungi.
home DHINATACOM