Ringkasan dokumen tersebut adalah: Dokumen tersebut membahas tentang list dan hyperlink pada HTML, termasuk jenis-jenis list seperti ordered list, unordered list, dan description list, serta contoh penerapannya. Dokumen tersebut juga menjelaskan tentang hyperlink, termasuk cara menambahkan hyperlink antarhalaman menggunakan tag <a>.

1. Pemrogram web 1
DISUSUN OLEH :
ALEX WIBOWO
EVA NAULI
SITI HUZAIMAH
LIS DAN
HYPERLINK HTML

2. INTRODUCTION
Dalam memenuhi tugas pada mata kuliah
Pemrograman Web 1, pada kesempatan kali ini kita
akan mempresentasikan mengenai List dan Hyperlink
pada HTML.

3. TABLE OF
CONTENS
Tentang list
Menjelaskan yang
dimaksud dengan List
01
CONTOH
Menjabarkan contoh
dari List
02
Tentang
hyperlink
Menjelaskan mengenai
Hyperlink
03
CONTOH
Menjabarkna contoh
dari Hyperlink
04

4. TENTANG
LIST
01
Menjelaskan apa yang
dimaksud dengan List

5. Apa itu list pada
html?
List atau yang kita kenal dengan daftar berurutan merupakan fungsi
dalam HTML yang digunakan untuk menampilkan daftaran yang
berurutan ke bawah.
Untuk menampilkan list dalam HTML bisa menggunakan tag <li>…</li>
dengan memasukkan atribut <ol>…</ol> untuk menampilkan daftar list
dalam bentuk hutuf maupun angka.
HTML sudah menyediakan elemen untuk membuat list. Ada 3 macam
jenis List yang dibuat di HTML:
1. Ordered List adalah list yang terurut,
2. Unordered List adalah list yang tak terurut,
3. Description List adalah list yang berisi definisi.
4. Nested List adalah list di dalam list

6. CONTOH DARI
LIST
02
Menjabarkan dari contoh
List

7. ordered list
Ordered list dibuat
dengan tag <ol>. Lalu di
dalamnya diisi dengan
item-item yang akan
dimasukkan ke dalam
list. Item dibuat dengan
tag <li> (list item).

8. List di samping diurutkan berdasarkan angka
dari 1, 2, 3, sampai 5.
Lalu kalau kita ingin menggunakan huruf
seperti a, b, c atau angka romawi seperti I, II,
III Untuk membuat yang seperti itu, kita bisa
menggunakan atribut type pada tag ol dan
berikut ini nilai yang bisa diberikan:
a untuk alfabet a, b, c, dan seterusnya;
A untuk alfabet A, B, C, dan seterusnya;
i untuk angka romwari i, ii, iii, dan seterusnya;
I untuk angka romwari I, II, III, dan seterusnya.
Contoh ordered list

9. Unordered list
Unordered list adalah list
yang tak terurut yang
menggunakan symbol-
symbol pada item-nya.
Unordered list dibuat dengan
tag <ul> dan untuk item-nya
dibuat juga dengan tag <li>

10. Secara default simbol yang digunakan oleh
unordered list adalah lingkaran kecil (disc).
Kita juga bisa menggantinya dengan atribut
type.
Berikut ini nilai yang bisa diberikan untuk
atribut type:
- square untuk simbol persegi;
- disc (default) untuk simbol lingkaran disc;
- none tidak memakai simbol;
- circle untuk simbol lingkaran;.
Contoh unordered
list

11. Description
List
Description List adalah list yang
berisi deksripsi atau penjelasan dari
sesuatu.
Ada tiga tag yang digunakan untuk
membuat description list:
- <dl> (description list) tag untuk
memulai description list;
- <dt> (description term) tag untuk
membuat kata yang akan
dideskripsikan;
- <dd> (description description) tag
untuk membuat penjelasan dari
kata.

12. Contoh Description
List

13. Nested list
List juga dapat dibuat di dalam
list, misalkan kita ingin
menggabungkan ordered list
dengan unordered list.Caranya,
list yang di dalam ditulis di
dalam tag <li>

14. Hasil dari nested
list

15. TENTANG
HYPERLINK
03
Menjelaskan apa yang
dimaksud dengan Link atau
Hyperlink

16. Apa itu link
atau hyperlink ?
Hyperlink adalah salah satu bagian dari halaman website. Hyperlink
merupakan salah satu cara untuk menghubungkan satu bagian di
dalam program dengan program lainnya, atau halaman web
dengan sebuah program.
Bagian dari halaman website itu berfungsi untuk menghubungkan
antarhalaman, menyediakan seamless link ke tiap halaman, atau
yang biasa dikenal dengan link.
Link juga dikenal dengan sebutan anvhor tag, karena dibuat dengan
tag <a>.

17. hyperlink
Pada program Link, Ketika kita meng-enter link pada dokumen 1, maka kita
akan bisa masuk pada dokumen lainny yang telah disiapkan. Cara
memasukkan link ini yaitu dengan menggunakan <a> …. </a> yang ditambah
dengan href= dan href ini akan diisi oleh bisa dengan nama folder beserta
formatnya atau bisa juga dengan kode url-nya.
Jadi di dalam href (hypertext reference) ini lah yang akan diisiakan alamat
yang dituju ketika text atau gambar di klik.
Pada Link versi HTML dibagi menjadi dua, yaitu:
1. Internal Link adalah Link yang menuju ke domain atau halaman web itu
sendiri;
2. External Link adalah link yang menuju domain lain.

18. CONTOH DARI
HYPERLINK
04
Menjabarkan dari contoh
Hyperlink

19. Bentuk sederhana hyperlink

20. Link akan ditampilkan dengan warna biru
dan garis bawah. Ini adalah style standar
dari setiap browser. Tetapi dapat kita
ubah sesuai selera.
Pada contoh ini link akan error. Karena
Link yang kita buat ini akan membuka
halaman about.html, tapi file ini belum
kita buat atau belum ada. Karena itu,
pasti error. Jadi kita harus membuat file
about.html dan disimpan dalam satu
folder dengan file link.html.
Contoh penggunaan
hyperlink

21. Isi file pada about.html seperti pada
gambar. Halaman link.html dan about.html
akan berhasil terhubung.
Pada contoh alamat URL ditulis
<a href="about.html">About us</a>.
Ini karena link yang kita buat adalah
internal link dan juga file about.html masih
dalam satu folder dengan file link.html. Jadi
boleh menuliskan langsung nama filenya,
tanpa harus lengkap dengan http.
Contoh penggunaan
hyperlink

22. Kuis
Apa yang
salah
dari
sintaks
ini ?

23. Jawabannya
kawan
Jawabannya adalah :
Setelah <li>List item 3.3</li>
seharusnya penutupnya </ul> bukan
</li>. Karna pada kuis salah, maka
angka angka 4 harusnya masuk di
bagian UL, seperti contoh disamping,
bukan muncul ke bagian list dari
angka 3 :
<li>List item 3.1</li>
<li>List item 3.2</li>
<li>List item 3.3</li>