Scribd Logo
Upload

Welcome to Scribd!

  • Membuat Dokumen HTML

    Uploaded by

    ukey_92
    2K views5 pages

    Copyright

    © Attribution Non-Commercial (BY-NC)

    Available Formats

    DOC, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as DOC, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    2K views5 pages

    Membuat Dokumen HTML

    Uploaded by

    ukey_92

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as DOC, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 5

    Membuat Dokumen HTML

    Dokumen HTML merupakan Teks murni (ASCII) dengan kode-kode special. Maksudnya
    adalah dokumen HTML hanya akan berisi Tulisan berupa Huruf, Angka, tanda baca dan
    karakter-karakter lainnya termasuk Kode-kode Tag HTML itu sendiri.

    Membuat dokumen HTML sebenarnya dapat dilakukan dengan 2 cara, yaitu dengan cara
    manual dan dengan cara menggunakan HTML Editor. Cara manual memerlukan banyak
    tenaga dan waktu karena anda akan banyak melakukan pengetikan, sedangkan kalau
    menggunakan HTML Editor seperti MS Front Page, Asymetrix WEB Publisher, Macro
    Media BackStage dll, akan mempermudah pekerjaan anda termasuk tenaga dan waktu.

    Apa yang dibutuhkan?


    Anda hanya memerlukan sebuah program penyunting teks untuk membuat dokumen
    HTML. Penyunting teks disini yang saya kira cukup untuk digunakan adalah Write/Word
    Pad, Note Pad, walaupun masih banyak penyunting teks lainnya seperti MS Word dsb.

    Bentuk Umum HTML


    Dibawah ini ada contoh/bentuk umum dari sebuah dokumen HTML yang akan terlihat
    pada waktu kita membukanya dengan menggunakan Text Editor atau NotePad:

    <HTML>
    <TITLE>Anak Irian's Home Page</TITLE>
    <BODY>Hallo apa kabar?<BR>
    Mudah-mudahan kabarnya Baik.
    </BODY>
    </HTML>

    Dari contoh diatas jika anda membuka file ini dengan menggunakan MicroSoft Internet
    Browser atau Netscape, anda hanya akan melihat tulisan:

    Hallo apa kabar?


    Mudah-mudahan kabarnya Baik.

    Tanda '/' atau "</>" menandakan akhir perintah tag, entah itu untuk </HEAD>,
    </TITLE> dsb.

    Jika ada Pembuka, harus ada Penutupnya juga!

    Keterangan:

    • <HTML>Pembuka/Awal setiap membuat suatu dokumen HTML.


    • </HTML>Penutup/Akhir dari suatu dokumen HTML.
    • <TITLE>Tag Pembuka untuk Judul Halaman/dokumen HTML.
    • </TITLE>Tag Penutup untuk Judul Halaman/dokumen HTML.
    • <BODY>Tag Awal dari Apa yang akan diketikan/diisi pada Dokumen HTML.
    • </BODY>Tag Penutup dari sisan dokumen HTML.
    • <BR> Tag untuk memisahkan satu baris menjadi dua baris

    Yang harus diingat adalah:


    Apa yang kita ketikan di NotePad dengan yang akan ditampilkan sebagai suatu dokumen
    di Internet akan kelihatan beda.

    Kode-kode TAG HTML dan Contohnya


    Saya akan menjelaskan secara singkat mengenai kode-kode Tag pada HTML.

    <!-- Isian Komentar anda -->


    Untuk mengisi Komentar anda (untuk mempermudah perbaikan atau koreksi)
    Semua ketikan yang diapit oleh tag <!-- --> tidak akan tampil saat dokumen dibuka
    oleh browser.

    • Contoh:
    <!-- Aturan Warna, Huruf dan Link Mulai dari sini -->

    <A HREF>
    Untuk membuat Link ke halaman lain atau halaman yang sama dengan topic tertentu.

    • Contoh:
    Klik disini untuk <A HREF="halaman2.htm">Pindah ke halaman 2</A>
    Hasilnya: Klik disini untuk Pindah ke halaman 2
    • Contoh2:
    <A HREF="http://www.yahoo.com/">Klik disini</A>untuk ke Yahoo!
    Hasilnya: Klick disini untuk ke Yahoo!

    </A>
    Menutup suatu Link.

    <A NAME>
    Membuat nama jangkar untuk Link ke tempat tertentu pada halaman yang sama
    ataupun yang berbeda berdasarkan topic yang diinginkan.

    • Contoh:
    <A NAME="kodetaghtml">Kode-kode TAG HTML dan Contohnya</A>
    • Contoh2:
    <A HREF="index.htm#kodetaghtml">Kode-kode TAG HTML</A>

    </A>
    Menutup suatu Link.

    <B>
    Membuat Text yang berada diantara kedua Tag menjadi Tebal (bold)

    • Contoh:
    <B>Peringatan!</B>Pemerintah.
    • Hasilnya: Peringatan Pemerintah.

    • Contoh2:
    Peringatan!<B>Pemerintah</B>.
    • Hasilnya: Peringatan Pemerintah.
    <BGSOUND>
    Menambahkan bunyi, baik itu file MID ataupun WAVE pada dokumen HTML anda.

    • Contoh:
    <BGSOUND SRC="jazz.mid">
    • Contoh2:
    <BGSOUND SRC="tada.wav">

    <BODY>
    Menentukan warna atau gambar latar belakang dokumen, warna text, jenis huruf, warna
    Link, warna Link yang telah dikunjungi serta link yang aktif.

    BGCOLOR = Warna latar belakang


    BACKGROUND = Gambar latar belakang
    FONT SIZE = Ukuran Huruf
    FONT COLOR = Warna Huruf
    LINK = Warna untuk Text Link
    VLINK = Warna untuk Text Link yang telah dikunjungi

    • Contoh:
    <BODY BGCOLOR="FFFFFF" FONT SIZE=3 FONT COLOR="000000"
    LINK="0000FF" VLINK="FF0000">
    • Contoh2:
    <BODY BACKGROUND="logo.gif" FONT SIZE=3 FONT COLOR="000000"
    LINK="0000FF" VLINK="FF0000">

    <BR>
    Membagi Suatu baris menjadi Dua baris (tanpa jarak antara kedua baris), diletakan di
    depan kata/huruf yang mau dipindahkan ke baris berikutnya.

    <CENTER>
    Membuat Teks atau Grafis yang diapit Tag Center berada ditengah-tengah browser (Align
    Center)

    • Contoh:
    <CENTER>Selamat Datang</CENTER>
    • Contoh2:
    <CENTER><IMG SRC="logo.jpg"></CENTER>

    </CENTER>
    Menutup Kode Tag Center.

    <FONT>
    Merubah Jenis Huruf, Ukuran Huruf dan Warna Huruf.

    • Contoh:
    <FONT FACE="Comic Sans MS" FONT SIZE=4 FONT COLOR="000000">Selamat
    Datang di Anak Irian's Home Page!</FONT>
    Hasilnya:
    Selamat Datang di Anak Irian's Home Page

    </FONT>
    Penutup untuk Tag Huruf.
    <H1..H6>
    Menentukan Ukura Header/Topic dari pada Dokumen

    • Contoh:
    <H1>Ini H1</H1>

    •
    Hasilnya:
    Contoh:
    Ini H1
    <H2>Ini H2</H2>

    Hasilnya: Ini H2
    • Contoh:
    <H3>Ini H3</H3>

    Hasilnya: Ini H3
    • Contoh:
    <H4>Ini H4</H4>
    Hasilnya: Ini H4

    <HR>
    Membuat Garis Horizontal pada dokumen HTML anda.

    • Contoh:
    <HR>
    Hasilnya:

    <HTML>
    Perintah yang selalu diletakan pada bagian awal dokumen HTML yang menyatakan
    bahwa dokumen ditulis dalam kode HTML.
    </HTML>
    Perintah yang selalu diletakan di Akhir suatu dokumen HTML.

    <I>
    Membuat Teks pada dokumen yang diapit oleh Tag <I> dan </I> menjadi miring (Italic)

    • Contoh:
    Computer merupakan <I>Ilmu Praktisi</I> dan bukan Teori belaka.
    Hasilnya: Computer merupakan Ilmu Praktisi dan bukan Teori belaka.

    </I>
    Menutup Tag Miring (Italic)

    <IMG>
    Memasukan Gambar Grafis, GrafisMap, serta Animasi kedalam dokumen HTML anda.

    • Contoh:
    <IMG SRC="toshi.gif">
    • Contoh:
    <A HREF><IMG SRC="mirclgo.gif"></A>
    • Contoh:
    <IMG SRC="toshi.avi">
    Contoh pertama merupakan cara memasukan gambar, contoh kedua merupakan contoh
    cara menggunakan gambar sebagai link dan contoh yang ketiga merupakan contoh
    untuk memasukan gambar animasi (AVI) kedalam dokumen HTML.

    <P></P>
    Menentukan Awal dan Akhir sebuah Paragraf.

    • Contoh:
    <P>
    Ini merupakan Awal serta akhir dari Paragraf pertama
    </P>

    <TITLE></TITLE>
    Menentukan Judul untuk tiap dokumen HTML yang anda buat. Judul ini akan nampak
    pada Titlebar browser anda.

    • Contoh:
    <TITLE>Anak Irian's Home Page</TITLE>

    You might also like