Untuk mengatur huruf dokumen HTML digunakan tag .

MODUL PERKULIAHAN
Interactive
Broadcasting
Pengolahan Citra
Fakultas
Program Studi
Ilmu Komunikasi
Broadcasting
TatapMuka
12
Kode MK
DisusunOleh
41040
Bagus Rizki Novagyatna
Abstract
Kompetensi
Pembahasan
Program adalah kata, ekspresi, pernyataan atau kombinasi yang disusun dan
dirangkai menjadi satu kesatuan prosedur yang berupa urutan langkah untuk
menyelesaikan masalah dan diimplementasikan dengan menggunakan bahasa
pemrograman sehingga dapat dieksekusi oleh komputer. Pemrograman adalah
proses mengimplementasikan urutan langkah untuk menyelesaikan suatu masalah
dengan menggunakan suatu bahasa pemrograman. Bahasa pemrograman adalah
suatu prosedur penulisan program. Sedangkan pemrograman terstruktur adalah
metode untuk mengorganisasikan dan membuat kode-kode program supaya mudah
untuk dimengerti, mudah ditest dan mudah dimodifikasi. Salah satu contoh
pemrograman adalah pemrograman di internet.
HTML merupakan salah satu unsur penting dalam pemrograman di internet. HTML
(Hypertext Markup Language) adalah bahasa pengkodean untuk menghasilkan
dokumen-dokumen hypertext untuk digunakan di World Wide Web. Namun HTML
bukanlah sebuah bahasa pemrograman, tetapi hanyalah berisi perintah-perintah
yang telah terstruktur berupa tag-tag penyusun. HTML merupakan pengembangan
dari standar pemformatan dokumen teks yaitu Standard Generalized Markup
Language (SGML). HTML sebenarnya adalah dokumen ASCII atau teks biasa, yang
dirancang untuk tidak tergantung pada suatu sistem operasi tertentu.
HTML ini merupakan sebuah format bahasa dari world wide web (WWW) untuk
menulis dan menampilkan dokumen. Sehingga dokumen tersebut dapat dengan
mudah tersebar ke PC melalui media jaringan komputer atau internet. HTML ini
berupa kode tag yang menginstruksikan browser untuk menghasilkan tampilan
sesuai dengan yang diinginkan. Sehingga, untuk dapat membuka dokumen yang
ditulis dengan HTML maka diperlukan sebuah tool yaitu browser misalnya Opera,
Mozila, Google Chrome, Netscape, dan banyak lagi yang lainnya. HTML juga dapat
dikenali oleh aplikasi pembuka email ataupun dari PDA dan program lain yang
memiliki kemampuan browser.
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
Adapun pengertian dari HTML5 itu sendiri adalah versi terbaru dari HTML
(HyperText Markup Language) yang mana dikembangkan oleh W3C atau Word
Wide
Web
Consortium. HTML5 diciptakan
bahasa HTML untuk
memperbaiki
konten
dalam
dan
pengembangan
memperbarui teknologi
multimedia yang sudah ada pada HTML 4 dan versi sebelumnya agar mudah
dijalankan oleh browser dan mudah dimengerti. HTML5 merupakan kerjasama
antara World Wide
Web
Consortium
(W3C) dan Web
Hypertext
Application
Teknologi Working Group (WHATWG).WHATWG bekerja dengan bentuk web dan
aplikasi, dan W3C bekerja dengan XHTML 2.0. Tujuan utama pengembangan
HTML5 adalah untuk memperbaiki teknologi HTML agar mendukung teknologi
multimedia terbaru, mudah dibaca oleh manusia dan juga mudah dimengerti oleh
mesin.
Di sisi lain HTML5 sering juga disebut dengan Semantic Web. Semantic web berasal
dari bahasa Yunani (Greek), merupakan bahasa pembelajaran semiotic, yakni
pembelajaran untuk memahami penanda. Semantic sendiri mempunyai arti bahasa
yang berfokus pada penanda untuk mengetahui arti yang terkandung di
dalamnya. Jadi, yang dimaksud semantic web adalah bahasa pemrograman yang
mempunyai penanda khusus dalam implementasinya dengan tujuan agar mampu
mendeskripsikan apa yang terkandung dalam website tersebut. Web semantic ini
bukan hanya dikembangkan di Web 2.0, namun sudah ke Web 3.0 bahkan akan
berkembang ke Web 4.0. Perkembangan teknologi memang cepat sekali berubah.
2.2 Struktur dasar HTML
1.
Struktur dasar HTML
HTML merupakan sebuah bahasa pemrograman yang berisikan perintah kepada browser
yang telah terinstal pada computer client, Untuk pemahaman dan sejarah HTML silahkan
baca “Pengertian dan sejarah HTML”, Bahasa pemograman ini terdapat sebuah elemen, tag
dan attribute didalam perintahnya.
Secara umum Web dokumen terdiri dari menjadi dua elemen ataupun section yaitu head
dan body, kedua elemen tersebut dipisahkan oleh beberapa tag, untuk lebih jelasnya dapat
anda lihat sebuah pola dasar HTML dibawah ini
<html>
<head>
“Informasi Tentang Dokumen HTML”
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
</head>
<body>
“Informasi yang akan ditampilkan dalam web Browser”
</body>
</html>
Dari pola diatas dapat digambarkan adanya sebuah dokumen HTML mulai dari tag pembuka
<html> sampai tag penutup </html>, sedangkan isi dari dokumen html tersebut adalah dua
buah elemen atau section yaitu
•
“HEAD” yang dimulai dari tag pembukanya <head> sampai tag penutup head </head>,
Pada elemen ini biasanya berisikan
–
Title, merupakan judul dokumen
–
Meta tag, informasi yang akan diberikan oleh pengunjung tentang isi halaman web
Dalam Meta Tag dapat kita isikan beberapa atribut penjelasan antara lain, Content, Name,
URL. Sedangkan dalam atribut tersebut terdapat sebuah value, adapun beberapa value
yang dapat kita isikan antara lain abstract, author, copyright, description, distribution,
expires, keywords, revist, refresh maupun language
–
Script java, CSS dan beberapa perintah lain yang nantinya akan diesekusi browser
tanpa ditampilkan oleh browser untuk sebagian besar, dengan kata lain pada elemen ini
kebanyakan hanya mengatur informasi dan visualisasi web tersebut, untuk elemen
keduanya adalah
– “BODY” mulai dari tag pembuka <body> sampai tag penutupnya </body> pada elemen ini
berisikan informasi dan pengaturannya yang akan ditampilkan dalam browser.
Di dalam bahasa pemrograman HTML terdapat beberapa atributh yang perlu kita pelajari,
adapun contoh atributh dan kegunaannya sebagai berikut,
•
<DFN>, untuk menandai sebuah subdefinisi dari daftar ataupun table definisi
•
<STRONG>, Untuk menandai bagian text ataupun kata dari penting dari sebuah kalimat,
paragraph ataupun dokumen
•
<VAR>, untuk menampilkan nama variable
•
<CITE>, Menandai kutipan
•
<CODE>, Menampilakan sebuah kode pemrograman
•
<EM>, Penekanan sebuah kalimat
•
<SAMP>, untuk membuat contoh ataupun sample didalam sebuah dokumen
•
<KBD>, menandai suatu text dimana text tersebut harus dimasukan oleh user melalui
keyboard
•
<B>, Bold membuat tampilan tebal huruf, kata ataupun kalimat
•
<I>, Italic membuat tampilan miring
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
•
<U>, Underline membuat tampilan garis bawah
•
<TT>, Membuat tampilan jenis huruf menyerupai huruf mesin ketik
•
<STRIKE>, membuat garis tengah pada sebuah kalimat
•
<BIG>, memperbesar ukuran huruf
•
<SMALL>, memperkecil ukuran huruf
•
<SUP>, menampilkan superscript
•
<SUB>, menampilkan subscript
•
<FONT>, merupakan sebuah pengaturan huruf, kata ataupun kalimat bahkan paragraph
di mana dalam atribut ini terdapat value yang mengatur tampilan huruf tersebut seperti color.
Size, style dan lainnya
•
<P>, Paragrah untuk membuat sebuah paragraph
•
<BR>, Line break berfungsi untuk mengganti baris
•
<H1>,<H2>,<H3>,<H4>,<H5>,<H6> merupakan sebuah header dimana dari keenam
jenis tersebut mempunyai perbedaan ketebalan dan ukuran huruf
•
<PRE> Preformatted Text berfungsi menampilkan text apa adanya
•
<CENTER> membuat sebuah text berada di posisi tengah
•
<LEFT> membuat sebuah text berada di posisi kiri
•
<RIGHT> membuat sebuah text berada di posisi kanan
•
<Basefont size=”pixel”>mengubah ukuran sebuah huruf
•
<HR> Horizontal rule berfungsi untuk membuat garis bawah
•
<OL>, membuat penomoran pada daftar
•
<UL>, Membuat sebuah tanda pada daftar tanpa nomor (bullet)
•
<LI>, tag yang berada di dalam attribute UL ataupul OL digunakan untuk memisah baris
daftar yang akan di beri penomoron ataupun tanda bullet
•
<TABLE>, membuat sebuah table
•
<TR>, Membuat row atau baris didalam table <TH>, membuat judul kolom di table <TD>
membuat isi pada kolom table, ketiga tag ini diisikan pada atribut table
•
Rowspan, Colspan merupakan pengaturan merge cell pada atribut table
•
<FORM> untuk membuat form
•
<A HREF=”url link”>Hypertext</A> Hyper Link
•
<IMG SRC=”url img”> insert image
Inilah beberapa atributh dasar yang digunakan dalam pemrograman HTML, pada atribut
diatas merupakan sebuah tag pembuka yang pada akhir atribut tersebut harus ditutup
dengan tag penutup atributh tersebut </…..>, untuk lebih jelasnya dilain waktu saya akan
mencoba bahas satu persatu atributh tersebut dan akan saya lengkapi dengan syntax dan
contohnya kompleksnya.
Secara sederhana HTML terdiri dari dua bagian yaitu Header dan Body. Struktur HTML
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
diapit oleh tag awal <HTML> dan tag akhir </HTML>. Standar penulisannya adalah:
<HTML>
<HEAD>
Deskrisi dokumen
</HEAD>
<BODY>
Isi dokumen
</BODY>
</HTML>
Keterangan:
• Tag <TITLE> digunakan untuk memberi judul dokumen HTML. Judul ini dapat Anda lihat
pada pojok kiri atas (title bar) browser. Ketika orang akan mem-bookmark web Anda,
maka judul inilah yang akan disimpan.
Untuk melihat hasilnya, silakan jalankan browser favorit Anda, seperti contoh di bawah ini
digunakan Microsoft Internet Explorer.
Referensi Tag HTML
1. Heading
Heading adalah sekumpulan kata yang menjadi judul atau subjudul dalam suatu dokumen
HTML. Heading berbeda dengan tag <TITLE> yang tidak bisa muncul dalam halaman web.
HTML menyediakan enam tingkatan heading. Heading level 1 biasanya untuk judul utama.
Contoh:
<HTML>
<HEAD>
<TITLE>Headings</TITLE>
</HEAD>
<BODY>
<H1>Heading Level 1</H1>
</BODY>
</HTML>
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
2. Paragraf
Untuk membuat paragraf digunakan tag <P>. Setelah tag <P> Anda bisa menulis isi
paragraf dan paragraf tersebut harus diakhiri dengan penutup </P>. Anda bisa mengatur
posisi paragraf dengan attribut ALIGN. Atribut ALIGN diikuti dengan posisi yang diinginkan.
LEFT untuk rata kiri, CENTER untuk rata tengah dan RIGHT untuk rata kanan.
Contoh:
<HTML>
<HEAD>
<TITLE>Paragraf</TITLE>
</HEAD>
<BODY>
<P ALIGN=”right”>
<P ALIGN=”center”>
<P ALIGN=”left”>
</P>
</BODY>
</HTML>
3. Blockquote
Perintah tag <BLOCKQUOTE> digunakan untuk menulis kutipan teks. Dengan perintah ini
browser akan menampilkan teks menjorok ke dalam (meng-identasi teks) atau menampilkan
teks dalam bentuk huruf miring.
Contoh:
<HTML>
<HEAD>
<TITLE>BLOCKQUOTE</TITLE>
</HEAD>
<BODY>
<H3>Sesuatu yang tidak perlu dicoba</H3>
<BLOCKQUOTE>
</BLOCKQUOTE>
</BODY>
</HTML>
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
4. Preformatted Text
Preformatted Text (PRE) digunakan untuk menampilkan teks sama seperti yang Anda
ketikkan dalam dokumen HTML. Browser akan menampikan teks tersebut dalam font
monospaced, yaitu seperti terlihat dalam teks yang tampilkan oleh aplikasi berbasis teks
(misalnya telnet).
Contoh:
<HTML>
<HEAD>
<TITLE>Preformatted Text</TITLE>
</HEAD>
<BODY>
<PRE>
</PRE>
</BODY>
</HTML>
5. Begin Row (BR)
Tag ini digunakan untuk menulis teks pada baris berikutnya. Tag <BR> membuat baris baru
tanpa memberi baris kosong di bawahnya.
Contoh:
<HTML>
<HEAD>
<TITLE>Begin Row</TITLE>
</HEAD>
<BODY>
<P>Banyak cara yang dapat digunakan untuk melakukan instalasi FreeBSD. Namun ada
tiga cara yang paling sering dilakukan ,yaitu:
<BR>Instalasi melalui FTP
<BR>Instalasi melalui CDROM
<BR>Instalasi melalui partisi DOS
</BODY>
</HTML>
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
6. Ukuran Font
Untuk mengatur huruf dokumen HTML digunakan tag <FONT SIZE>. Tag <FONT SIZE>
memiliki beberapa atribut untuk mengatur ukuran huruf yang akan digunakan.
Contoh:
<HTML>
<HEAD>
<TITLE>Ukuran font</TITLE>
</HEAD>
<BODY>
<FONT SIZE=1>Ukuran font 1</FONT>
<FONT SIZE=2>Ukuran font 2</FONT>
<FONT SIZE=3>Ukuran font 3</FONT>
<FONT SIZE=4>Ukuran font 4</FONT>
<FONT SIZE=5>Ukuran font 5</FONT>
<FONT SIZE=6>Ukuran font 6</FONT>
<FONT SIZE=7>Ukuran font 7</FONT>
</BODY>
</HTML>
7. Jenis Font
Atribut FACE digunakan untuk mengatur jenis huruf yang diinginkan. Atribut FACE harus
diisi dengan string jenis font seperti Arial, Times New Roman,Verdana, dan sebagainya.
Contoh:
<HTML>
<HEAD>
<TITLE>Jenis Font</TITLE>
</HEAD>
<BODY>
<FONT SIZE=5>
<FONT FACE = “Arial”>Arial, contoh AC Milan <P>
<FONT FACE = “Verdana”>Verdana , contoh Persebaya <P>
<FONT FACE = “Times New Roman”>Times New Roman, contoh Indonesia P>
</BODY>
</HTML>
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
8. Warna Font
Atribut COLOR digunakan untuk mengatur warna font yang akan digunakan. Untuk memberi
nilai pada atribut color, ada dua cara. Cara pertama dengan menuliskan nama warna seperti
Red, Blue, Yellow, White, dll. Sedangkan cara kedua adalah dengan menggunakan nilai
RGB (Red Green Blue) dari suatu warna, misalnya FF0000 untuk Red, 00FF00 untuk green,
dan 0000FF untuk Blue.
Contoh:
<HTML>
<HEAD>
<TITLE>Warna Font</TITLE>
</HEAD>
<BODY>
<FONT SIZE=5>
<FONT COLOR = “red”>PSM Makassar<P>
<FONT COLOR = “#FF0000”>tetap PSM Makassar kan?<P>
<FONT COLOR = “#00FF00”>Ini baru Persebaya<P>
</BODY>
</HTML>
9. Link
Perintah anchor <A> digunakan untuk membuat suatu link. Untuk membuat link ke dokumen
HTML lain digunakan perintah <A HREF = “nama_dokumen”>Teks pada browser</A>.
Anda juga bisa membuat link dalam sebuah dokumen HTML. Untuk itu perlu dipersiapkan
nama anchor lokasi tujuan dari link tersebut. Nama anchor dibuat dengan menambahkan
atribut NAME pada tag <A>. Misalnya <A NAME = “Bugs”</A>. Cara melakukan link ke
bagian tersebut adalah <A HREF = “#nama_anchor”>teks pada browser</A>.
Contoh:
<HTML>
<HEAD>
<TITLE>Link</TITLE>
</HEAD>
<BODY>
<A NAME=”lengkap”>Pemain-pemain AC Milan menurut abjad</A>
<BLOCKQUOTE>
<P>Abbiati ,<A HREF=”#abbiati”>info lengkap</A>
<P>Ayala
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
<P>Ambrosini
<P>Albertini
<P>Boban
<P>
<A HREF=”linktujuan.html”>kalo mau tahu lagi klik disini</A>
</BLOCKQUOTE>
<P><A NAME=”abbiati”>Abbiati</A>
<BLOCKQUOTE>
<P>Kiper ketiga timnas Italia runner up Euro 2000
<BR>Kiper utama U-21 juara Piala Eropa U-21
<BR>Kiper utama AC Milan juara Seri-A 1998-1999
</BLOCKQUOTE>
<P><A HREF=”#lengkap”>kembali ke atas</A>
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE>Link tujuan</TITLE>
</HEAD>
<BODY>
<P ALIGN=”center”> Maaf, hanya sedikit
<BR>Chamot
<BR>Dida
<BR>Shevchenko
<BR><A HREF=”contohlink.html”>kembali</A>
</BODY>
</HTML>
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
2.5 Membuat Kode Dasar HTML Table
Untuk Belajar HTML Table dan membuat website sendiri, maka kita harus membuat
persiapan lebih dulu. Pertama kita buka notepad. Kemudian ketik di notepad ini kode html
seperti dibawah ini:
<table>
<head>
<title> </title>
</head>
<body>
</body>
</html>
Kemudian sisipkan kalimat Belajar HTML Table diantara <title> dan </title> sehingga kode
html nya sekarang menjadi:
<table>
<head>
<title>Belajar HTML Table</title>
</head>
<body>
</body>
</html>
a. Menambah heading dan paragraf
Bila anda pernah menggunakan Microsoft Word, anda akan terbiasa dengan style yang ada
untuk heading dengan tingkat kepentingan yang berbeda. Pada HTML ada enam tingkatan
heading. H1 adalah yang paling penting, H2 lebih sedikit kurang penting, seterusnya hingga
H6, yang paling tidak penting.
Berikut adalah cara menambah sebuah heading yang penting:
<h1>Sebuah heading yang penting</h1>
<h2>Sebuah heading yang sedikit kurang penting</h2>
Setiap paragraf yang anda tulis harus diawali dengan tag <p>. Tag </p> merupakan opsi,
tidak seperti end tag untuk elemen seperti heading. Sebagai contoh:
<p>Ini adalah paragraf pertama.</p>
<p>Ini adalah paragraf kedua.</p>
b. Menambahkan perhatian pada halaman dengan gambar – gambar
<img
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
c. Menambahkan link ke halaman lain.
Apa yang membuat Web sangat efektif adalah kemampuan untuk membuat link dari satu
halaman ke halaman yang lain, dan mengikutinya hanya dengan sebuah klik. Sebuah klik
dapat membawa anda langsung ke seberang dunia!
Link didefinisikan dengan tag <a>. Mari membuat sebuah link pada file “peter.html” di
folder/direktori yang sama dengan file HTML yang sedang anda edit::
Ini adalah link ke <a href=”peter.html”>halamannyater</a>.
Teks antara <a> dan </a> digunakan sebagai keterangan dari link. Adalah hal yang umum
bagi keterangan tersebut untuk diberi garis bawah berwarna biru.
Bila file yang anda link adalah direktori asal (parent directory), anda perlu menambahkan “../”
sebelumnya, sebagai contoh:
<a href=”../mary.html”>halamannya Mary</a>
Bila file yang dilink adalah sebuah sub direktori, anda perlu memberikan nama dari
subdirektori tersebut diikuti sebuah “/” setelahnya, sebagai contoh:
<a href=”friends/sue.html”>halamannya Sue</a>
Penggunaan relative path memungkinkan anda melink sebuah file dengan pergi naik atau
turun direktori sesuai kebutuhan, sebagai contoh”:
<a href=”../college/friends/john.html”>halamannya John</a>
Di mana pertama kali akan dicari pada direktori asal, dari sebuah direktori lain
bernama “college”, dan kemudian sebuah subdirektori dengan nama “friends” untuk sebuah
file dengan nama “john.html”.
Untuk melink ke sebuah halaman atau situs Web lain anda perlu memberikan alamat
lengkap Web (umumnya dinamakan URL), sebagai contoh untuk melink ke www.w3.org
anda perlu menuliskan:
Ini adalah sebuah link menuju<a href=”http://www.w3.org/”>W3C</a>.
Anda dapat mengubah sebuah gambar menjadi sebuah link hypertext, sebagai contoh,
berikut ini memungkinkan anda untuk mengklik pada logo perusahaan untuk pergi ke
halaman utama / depan:
<a href=”/”><img src=”logo.gif” alt=”home page”></a>
Contoh ini menggunakan “/” untuk menghubungi direktori asal, yang mana adalah home
page.
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
d. Tiga jenis daftar
HTML mendukung tiga jenis daftar. Jenis yang pertama adalah daftar dengan bullet
(bulletted list), atau sering disebut unordered list. Yang menggunakan tag <ul> dan <li>,
sebagai contoh:
<ul>
<li>list item pertama</li>
<li>list item kedua</li>
<li>list item ketiga</li>
</ul>
Catatan bahwa anda perlu mengakhiri daftar dengan tag </ul>, tetapi tag </li> merupakan
opsi dan dapat di hiraukan. Jenis daftar kedua adalah daftar dengan nomor, yang sering
juga disebut ordered list. Hal tersebut menggunakan tag <ol> dan <li>. Sebagai contoh:
<ol>
<li>list item pertama</li>
<li>list item kedua</li>
<li>list item ketiga</li>
</ol>
Seperti juga bulletted lists, anda perlu mengakhiri daftar dengan tag </ol>, tetapi tag penutup
</li> merupakan opsi dan dapat di hiraukan.
Yang ketiga dan yang terakhir adalah daftar definisi. Daftar ini memungkinkan anda untuk
membuat daftar suatu hal dan penjelasannya. Daftar ini diawali dengan sebuah tag <dl> dan
diakhiri dengan </dl> Tiap hal diawali dengan sebuah tag <dt> dan tiap penjelasannya
diawali dengan sebuah tag <dd>. Sebagai contoh:
<dl>
<dt>hal pertama</dt>
<dd>penjelasannya</dd>
<dt>hal kedua</dt>
<dd>penjelasannya</dd>
<dt>hal ketiga</dt>
<dd>penjelasannya</dd>
</dl>
Tag penutup </dt> dan </dd> merupakan opsi dan dapat diabaikan. Perlu dicatat bahwa
daftar ini bisa saling disisipkan, satu diantari yang lain. Sebagai contoh:
<ol>
<li>list item pertama</li>
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
<li>
list item kedua
<ul>
<li>list pertama yang disisipkan</li>
<li>list kedua yang disisipkan</li>
</ul>
</li>
<li>list item ketiga</li>
</ol>
Anda juga dapat menggunakan paragrapf dan heading dsb. untuk daftar hal yang lebih
panjang..
e. HTML memiliki sebuah head dan body
Bila anda menggunakan fitur view source dari web browser anda (lihat menu View atau File)
anda dapat melihat struktur dari halaman HTML. Dokumen tersebut biasanya dimulai
dengan sebuah perrnyataan versi HTML yang digunakan HTML, dan kemudian diawali
dengan sebuah tag <html> dikuti dengan tag <head> dan diakhiri dengan </html>. Tag
<html> … </html> berfungsi sebagai sebuah kontainer untuk dokumen tersebut. Tag <head>
… </head> mengandung judul, dan informasi style dan script, sementara <body> … </body>
mengandung markup dari isi yang terlihat. Berikut adalah sebuah pola yang dapat anda
copy dan paste ke text editor untuk menciptakan halaman anda sendiri:
<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”
“http://www.w3.org/TR/html4/loose.dtd”>
<html>
<head>
<title> ganti dengan judul dokumen anda </title>
</head>
<body>
ganti dengan isi dokumen anda
</body>
</html>
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id