HTTP (Hypertext transfer protocol) merupakan protokol yang digunakan untuk mentransfer data antara web server ke web browser. Protocol ini mentransfer dokumen-dokumen web yang ditulis atau berformat HTML (Hypertext Markup Language). Dikatakan markup language karena HTML berfungsi untuk ‘memperindah’ file teks biasa untuk ditampilkan pada program web browser hal ini dilakukan dengan menambahkan elemen atu sering disebut sebagai tag-tag pada file teks biasa tersebut
Struktur Dasar Dokumen HTML
Setiap dokumen HTML memiliki struktur dasar atau susunan file
<html>
<head>
<title>Judul
Halaman</title>
</head>
<body>
Berisi tentang text, gambar, atau
apapun yang tampil pada document web.
</body>
</html>Seperti terlihat, struktur file HTML diawali dengan sebuah tag<html> dan ditutup dengan tag </html>. Di dalam tag ini terdapat dua buah bagian besar, yaitu yang diapit oleh tag<head>…</head> dan tag <body>…</body>
Pengaturan Properti Dokumen
Properti document diatur melalui atribut-atribut yang terdapat dalam elemen <body>. Sebagai contoh adalah pengaturan warna latar belakng halaman, wana teks, warna link dan lain-lain
Kode Warna
Dalam pengaturan warna menggunakan kode RGB yang mana ditampilkan dalam nilai heksadesimal. Setiap bagian dua gigit kode menunjukkan banyaknya intensitas dari kombinasi warna merah, hijau dan biru. Sebagai contoh 00 pada dua digit pertama berarti tidak ada warna merah dalam kobinasi warna berikut ini adalah contoh kode warna :
- PC/Laptop
- Aplikasi text editor (notepad++, sublime text, dll)
- Browser
Buatlah
halaman web sebagai berikut (heading):
<html>
<head>
<title>Pemrograman
Web</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>
</body>
</html>
Simpan
kode HTML diatas dengan nama heading.html lalu buka hasilnya dengan menggunakan
web browser. Apabila penulisannya benar maka akan tampil halaman web sebagai
berikut
Pengertian
List
List
adalah bagian teks di dalam dokumen yang berisi daftar item dari suatu kelompok
atau grup tertentu. Sebagai contoh, dalam situs web yang bertema kuliner, list
dapat berupa daftar dari makanan dan minuman, beserta harganya. List dapat juga
berupa prosedur (urutan langkah-langkah) dari suatu pekerjaan tertentu, yang
sifatnya harus dilakukan secara berurutan dari langkah pertama sampai langkah
terakhir
Tipe
Daftar/List dalam Dokumen HTML
- Daftar berurutan (ordered list) Daftar yang berurutan biasanya ditandai dengan penggunaan penomoran tertentu. Penomoran ini bias menggunakan angka (1, 2, 3,…) maupun karakter alphabet terntentu (a, b, c,… atau i, ii, iii,…)
- Daftar tidak berurutan (unordered list) Daftar yang tidak berurutan adalah daftar yang item-itemnya dapat diubah posisinya secara acak
- Daftar definisi (definition list) Daftar Definisi adalah suatu daftar yang berisi kumpulan definisi dari suatu istilah tertentu, misalnya daftar definisi istilah HTML
- List Kombinasi Dapat dilihat bahwa daftar di atas adalah gabungan daftar berurutan dan daftar tidak berurutan. Untuk membuat daftar diatas pada dokumen HTML maka cukup menggabungkan <ol> dangan <ul>
Buatlah
halaman web sebagai berikut (Ordered List):
<html>
<head>
<title>Pemrograman
Web</title>
</head>
<body>
Daftar Program Keahlian SMKN 1 Katapang
<ol>
<li>Tekstil</li>
<li>Elektro</li>
<li>Mesin</li>
<li>Otomotif</li>
<li>TKJ</li>
<li>RPL</li>
<li>Multimedia</li>
</ol>
</body>
</html>
Simpan
kode HTML diatas dengan nama ol.html lalu buka hasilnya dengan menggunakan web
browser. Apabila penulisannya benar maka akan tampil halaman web sebagai
berikut
Buatlah
halaman web sebagai berikut (unordered list):
<html>
<head>
<title>Pemrograman
Web</title>
</head>
<body>
Daftar Program Keahlian SMKN 1 Katapang
<ul>
<li>Tekstil</li>
<li>Elektro</li>
<li>Mesin</li>
<li>Otomotif</li>
<li>TKJ</li>
<li>RPL</li>
<li>Multimedia</li>
</ul>
</body>
</html>
Simpan
kode HTML diatas dengan nama ul.html lalu buka hasilnya dengan menggunakan web
browser. Apabila penulisannya benar maka akan tampil halaman web sebagai
berikut
Buatlah
halaman web sebagai berikut (definition list):
<html>
<head>
<title>Description
List</title>
</head>
<body>
<u>drink</u>
<dl>
<dt>Coffee</dt>
<dd>- Black hot
drink</dd>
<dt>Milk</dt>
<dd>- White cold
drink</dd>
</dl>
</body>
</html>
Simpan
kode HTML diatas dengan nama dl.html lalu buka hasilnya dengan menggunakan web
browser. Apabila penulisannya benar maka akan tampil halaman web sebagai
berikut
Buatlah
halaman web sebagai berikut (list kombinasi):
<html>
<head>
<title>List Kombinasi</title>
</head>
<body>
<u>Kategori Hewan</u>
<ol>
<li>Karnivora</li>
<ul>
<li>Singa</li>
<li>Harimau</li>
<li>Buaya</li>
</ul>
<li>Herbivora</li>
<li>Omnivora</li>
</ol>
</body>
</html>
Simpan
kode HTML diatas dengan nama kombinasi.html lalu buka hasilnya dengan
menggunakan web browser. Apabila penulisannya benar maka akan tampil halaman
web sebagai berikut
Hello, my satria mubarok anwar. I'm a 20 year old and iam a blogger.
bagus banget bang vaedah
BalasHapusok makasih gan
Hapusmakasih gan
BalasHapussama-sama mas
Hapus