Perancangan Web ( Pertemuan 2 ) Penulisan,memberi link,memberi komentar

Posted by : Unknown Thursday, March 13, 2014

A. HTML (hypertext markup language)

merupakan suatu format yang digunakan dalam pembuatan dokumen dan aplikasi yang berjalan di halaman web. HTML dirancang untuk digunakan tanpa tergantung pada suatu platform tertentu. Dokumen HTML adalah suatu dokumen teks biasa dan disebut markup language karena menggunakan tanda-tanda tertentu yang disebut tag untuk mengatur bagaimana suatu dokumen ditampilkan pada browser.

B. HTML Bukan Bahasa Pemrograman

· Bentuk dasar ( HTML dasar )

<html>

<head>

<title>berisi teks yang akan muncul pada title bar browser</title>

</head>

<body>

berisi teks, gambar, atau apapun yang ingin ditampilkan

pada halaman web ada pada bagian ini.

</body>

</html>

Animasi. Untuk text

Text berjalan,akan berhenti ketika kursor mendekat

<marquee direction="left" scroll amount="3"

onmouseover=”this.stop()” onmouse= “ this.start()”>

masukan text</marquee>

Text naik turun <marquee behavior=”alternate” direction=”down” height=”200”> masukan text </marquee>

<marquee behavior=”alternate” direction=”down” height=”50”><marquee direction=”left”> masukan text </marquee</marquee>

· Contoh Skrip Sederhana HTML

<html>

<head>

<title>Latihan-2: Paragraf dan Break</title>

</head>

<h1>TOKO BUKU SERBA MURAH</h1>

<h2>Toko kami menyediakan</h2>

<h3>Alat Tulis</h3>

<p>Pensil<br>Ballpoint<br>Penggaris<br>Dll.</p>

<h3>Buku-buku Pelajaran</h3>

<p>Ilmu pasti<br>Ilmu bumi<br>Sejarah<br>Dll.</p>

<h3>Peralatan Kantor</h3>

<p>Meja<br>Kursi<br>File manager<br>Dll.</p>

</body>

</html>

C. Aplikasi Editor Web yang sering digunakan

1. Full text : pada NOTEPAD.

2. WSYWIG : pada DREAMWEAVER.

Cara menambah link

<html>

<head>

<title>Penggunaan BODY</title>

</head>

<body bgcolor="silver" text="blue" vlink="#ff0000" link="green">

Ini adalah contoh penggunaan body.

Dan ini adalah sebuah <a href="">link</a>.

</body>

</html>

Cara Memberi Komentar

<html>

<head>

<title>Penggunaan Komentar</title>

</head>

<body>



Selamat belajar html<br>. Semoga sukses!

</body>

</html>

Cara Memformat HTML

<html>

<head>

<title>Latihan Heading</title>

</head>

<body>

<h1>Ini Heading 1</h1>

<h2>Ini Heading 2</h2>

<h3>Ini Heading 3</h3>

<h4>Ini Heading 4</h4>

<h5>Ini Heading 5</h5>

<h6>Ini Heading 6</h6>

</body>

</html>

Menggabungkan Semuanya

<html>

<head>

<title>Cerita Ramayana</title>

</head>

<body bgcolor="#990066" text="#FFFF00" vlink="#ff0000" link="green">

Cerita wayang Ramayana, di Kerajaan Alengka Diraja

<br>Rahwana membuat geger karena menculik Dewi Sinta

<p>Anoman, Si Kera Putih

ditugaskan Tukul Arwana untuk menjemput Sinta

</p>

Tukul Arwana tidak sempat menjeputnya, karena sedang

mengisi acara di stasiun TV Swasta

<hr />

Rama Tukul Arwana

<hr />

<br />

<h1>Bab I HTML</h1>

Ini adalah isi Bab I

<h2>1.1 Subbab HTML</h2>

Ini adalah isi Subbab 1.1

<h3>1.1.1 Sub-Subbab HTML</h3>

Ini adalah isi Sub Subbab 1.1.1

</body>

</html>