PENGENALAN HTML DAN XHTML
PENGATURAN TEKS
A. PEMBAHASAN
1.
Pengenalan
HTML dan XHTML
HTML
bukan bahasa pemrograman, tetapi berupa markup language yaitu bahasa yang di
bentuk dari kumpulan markup tags.
Tag
Dasar dalam HTML adalah <html>…</html>
Bagian
yang terdapat dalam tag <html> :
a. Kepala
<head>…</head>
Didalamnya ada
tag <title>
<head><title>…</title></head>
b. Badan
<body>…</body>
Bagian
<body> akam berisi konten yang akan di tampilkan di halaman web.
Dokumen
HTML berisi HTML element. Element konten adalah semua yang terletak diantara
start tag dan end tag :
Contoh
:
<p>Ini
sebuah paragraph</p>
<p>
adalah HTML element.
Beberapa
HTML tidak mempunyai content, di sebut dengan empty element sehingga closing
tag diletakkan di start tag. Contoh : <br/> dan <hr/>
HTML
element bisa tersarang (berisi HTML element yang lain atau biasa disebut
nested. Dokumen HTML berisi nested HTML element.
Contoh
:
<html>
<body>
<p>Ini sebuah paragraph</p>
</body>
</html>
Contoh
ini terdiri dari 3 HTML elements
v
<p>
element à mendefinisikan paragraph
dalam dokumen HTML
v
<body>
element à mendefinisikan body dari document HTML
v
<html>
element à mendefinisikan
keseluruhan dokumen HTML
XHTML merupakan
generasi berikutnya setelah HTML, tetapi dia menuntut kemampuan lebih tinggi
untuk mengoperasikannya. Struktur XHTML dalam penggunaannya hampir sama dengan
HTML, hanya lebih terstruktur dan konsisten.
Berikut ini perbedaan
antara XHTML dan HTML :
v
Dalam
XHTML Nested Element ( element bersarang ) tidak boleh bersilangan sedangkan
dalam HTML bisa ditulis secara bersilangan.
v
Dalam
XHTML semua element harus memiliki End Tag sedangkan dalam HTML bisa sebagian
tidak mempunyai end tag.
v
Dalam
XHTML Semua element di tulis memakai huruf kecil sedang dalam HTML bisa ditulis
memakai huruf capital.
v
Dalam
XHTML document harus mempunyai satu root element
v
Dalam
XHTML semua element yang kosong tetap harus ditutup dengan tag penutup.
2. Pengaturan Text
Untuk
mendapatkan halaman web yang baik Anda harus melakukan pengaturan terhadap teks
seperti memilih jenis dan ukuran huruf, perataan, dll. Tag-tag di bawah ini
yang biasa digunakan dalam pengaturan teks :
Headers:
<Hn>..</Hn> Digunakan untuk
mengatur ukuran huruf pada header. “n” mempunyai nilai antara 1 – 6 atau antara
<H1> sampai <H6>, dengan <H1> merupakan ukuran terbesar dan
<H6> merupakan ukuran terkecil.
Contoh :
<H2>Tutorial
Html</H2>
Hasilnya akan terlihat seperti :
Tutorial Html
Paragraph
Baru: <P> Digunakan untuk pindah alinea
atau paragraf. Tag ini bisa diberi akhiran </P> tapi juga bisa tidak
diberi.
Line
Break: <BR> Digunakan untuk pindah ke
baris baru.
No
Line Break: <NOBR> Bila digunakan tag
ini maka teks yang panjang tidak secara otomatis pindah baris bawahnya bila
baris pertama sudah terlalu panjang.
Font
<FONT> Untuk mendefinisikan berbagai
attribut FONT, yaitu : SIZE, FACE, COLOR.
SIZE: Ukuran font yang digunakan, berkisar antara 1 – 7 dengan 1
merupakan ukuran terkecil dan 7 merupakan ukuran terbesar.
COLOR: Warna font, didefinisikan dengan menggunakan nilai RGB/HEX atau
bisa juga langsung menggunakan nama warna (red misalnya).
Selain tag dan atribut di atas,
masih terdapat lagi tag-tag yang berhubungan dengan pengaturan teks, yaitu :
Perhatian : Semua tag di bawah ini membutuhkan tap penutup.
<B> Bold text
<I> Italic text
<U> Underscore
<TT> Typewriter
<S> Strikeout – draws a line through the text
<PRE> Preformatted Text <DFN> Definition
<BLINK> Text berkedip (lebih baik jangan digunakan)
<STRONG> Strong
<CITE> Digunakan untuk quoting text
<CODE>
<SAMP> Monospaced font (digunakan bila Anda ingin meletakkan (memperlihatkan) kode HTML pada dokumen HTML Anda)
<KBD> Monospaced font (digunakan bila Anda ingin meletakkan (memperlihatkan) kode HTML pada dokumen HTML Anda)
<BIG> Ukuran teks akan lebih besar satu ukuran
<SMALL> Ukuran teks akan lebih kecil satu ukuran
<SUP> Membuat tekssuperscript
<SUB> membuat tekssub script
<ABBREV> Abbreviations
<ACRONYM> Untuk akronim
<PERSON> Digunakan untuk indexing
<Q> Membuat short inline quotation
<VAR> Membuat variable name, selalu dalam italics.
<I> Italic text
<U> Underscore
<TT> Typewriter
<S> Strikeout – draws a line through the text
<PRE> Preformatted Text <DFN> Definition
<BLINK> Text berkedip (lebih baik jangan digunakan)
<STRONG> Strong
<CITE> Digunakan untuk quoting text
<CODE>
Monospaced font (digunakan bila Anda
ingin meletakkan (memperlihatkan) kode HTML pada dokumen HTML Anda)<SAMP> Monospaced font (digunakan bila Anda ingin meletakkan (memperlihatkan) kode HTML pada dokumen HTML Anda)
<KBD> Monospaced font (digunakan bila Anda ingin meletakkan (memperlihatkan) kode HTML pada dokumen HTML Anda)
<BIG> Ukuran teks akan lebih besar satu ukuran
<SMALL> Ukuran teks akan lebih kecil satu ukuran
<SUP> Membuat tekssuperscript
<SUB> membuat tekssub script
<ABBREV> Abbreviations
<ACRONYM> Untuk akronim
<PERSON> Digunakan untuk indexing
<Q> Membuat short inline quotation
<VAR> Membuat variable name, selalu dalam italics.
Suatu
paragraf dalam dokumen HTML ditandai dengan pasangan elemen
<P>…</P>. Atribut yang digunakan dalam paragraf ALIGN mempunyai
tiga nilai, yaitu :
v LEFT,
untuk meratakan teks ke margin kiri
v RIGHT,
untuk meratakan teks ke margin kanan
v CENTER,
untuk meratakan teks ke tengah margin
v Untuk
menyatakan suatu heading, digunakan tag <Hx> dimana x adalah nomor
v level
heading dari 1 sampai 6. pemakaian heading diawali dengan tag<Hx> dan
diakhiri dengan tag </Hx>
v Garis
pemisah antara satu baris dengan baris lainnya, digunakan elemen HR. Elemen ini
akan membuat garis horisontal sepanjang lebar jendela browser. Atribut yang
menyertai adalah :
ALIGN,
dapat diset dengan nilai LEFT, CENTER dan RIGHT
WIDTH,
untuk mengatur panjang garis horisontal yang dapat ditentukan dengan nilai
pixel atau persen.
SIZE, untuk mengatur ketebalan garis horisontal
mempunyai nilai dalam satuan pixel.
NOSHADE,
menampilkan garis horisontal tanpa bayang-bayang 3-D.
COLOR,
memberi warna pada garis horisontal.
Atribut align digunakan untuk meratakan tabel,
gambar, objek, paragraf dan lainnya. Pemakaian umum atribut ini : Align=left|center|right|justify
LEFT
= teks rata dengan margin kiri
CENTER
= teks rata tengah
RIGHT
= teks rata dengan margin kanan
JUSTIFY
= teks rata dengan margin kiri dan kanan
Ordered List
Adalah
suatu daftar dimana item-item yang ada dalam daftar memiliki nomor secara urut.
Ordered List dimulai dengan tag awal <OL> dan diakhiri dengan tag
</OL>, dan diantara kedua tag tersebut terdapat tag <LI> yang
menyatakan list item.
Unordered List
Adalah daftar dimana urutan item tidak diutamakan.
Item-item tampil dalam sembarang urutan. Setiap item dalam Unordered List
biasanya ditandai dengan bulatan, kotak atau lingkaran. Penggunaan Unordered
List diawali dengan tag <UL> dan diakhiri dengan tag </UL>, dan
didalamnya ditandai dengan tag <LI>.
Tidak ada komentar:
Posting Komentar