Kamis, 07 November 2013

MACAM MACAM LIST DALAM PEMROGRAMAN BERBASIS WEB (HTML)

SOAL :
1.      Mengenai list? Sebutkan dan berikan contohnya !
2.      Apakah Definition List itu ? Sebutkan dan berikan contohnya !
3.      Apa itu link / hyperlink ? Berikan contohnya !
JAWAB :
1.      Untuk menampilkan list (daftar item) dalam sebuah halaman Web, HTML menyediakan beberapa list, antara lain sebagai berikut :
Ø Ordered List
Ordered list atau numbered list merupakan sebuah daftar dengan item-item dalam daftar berupa nomor secara berurut. Tag yang digunakan adalah <OL> …</OL>. Di antara kedua tag tersebut di dalamnya terdapat tag <LI> untuk menyatakan list item dalam daftar. Sebagai contoh adalah penulisan program di bawah ini :
<OL>
<LI> MOZILLA FIREFOX </LI>
<LI> SAFARI </LI>
<LI> INTERNET EXPLORER </LI>
</OL>
* Hasilnya menjadi :
1.      MOZILLA FIREFOX
2.      SAFARI
3.      INTERNET EXPLORER
* Untuk mengganti jenis pengurutan menggunakan atribut TYPE yang diletakkan pada tag <OL>. Macam-macam atribut untuk mengubah jenis nomor pada tag <OL> antara lain sebagai berikut :
1)     Atribut TYPE = A, untuk membuat daftar berurut dengan huruf besar (A, B, C, D, E…)
Contoh:
<OL TYPE="A">
<LI>BEBEK</LI>
<LI>SAPI</LI>
<LI>AYAM</LI>
</OL>
Menghasilkan :
A.     BEBEK
B.     SAPI
C.     AYAM
2)     Atribut TYPE = a, untuk membuat daftar berurut dengan huruf kecil (a, b, c, d, e…)
Contoh :
<OL TYPE="a">
<LI>BEBEK</LI>
<LI>SAPI</LI>
<LI>AYAM</LI>
</OL>
Menghasilkan :
a.      BEBEK
b.      SAPI
c.      AYAM
3)     Atribut TYPE = I, untuk membuat daftar berurut dengan bilangan Romawi huruf besar (I, II, III,IV, V…)
Contoh :
<OL TYPE="I">
<LI>BEBEK</LI>
<LI>SAPI</LI>
<LI>AYAM</LI>
</OL>
Menghasilkan :
                                                                    I.            BEBEK
                                                                  II.            SAPI
                                                                III.            AYAM
4)     Atribut TYPE = i, untuk membuat daftar berurut dengan bilangan Romawi huruf kecil’(i, ii, iii, iv, v,…)
Contoh :
<OL TYPE="i">
<LI>BEBEK</LI>
<LI>SAPI</LI>
<LI>AYAM</LI>
</OL>
Menghasilkan :
                                                                     i.            BEBEK
                                                                   ii.            SAPI
                                                                  iii.            AYAM
5)     Atribut TYPE = 1, untuk membuat daftar berurut berupa nomor (default).
Contoh :
<OL TYPE="1"> =====>(CUKUP <OL> SAJA)
<LI>BEBEK</LI>
<LI>SAPI</LI>
<LI>AYAM</LI>
</OL>
Menghasilkan :
1.      BEBEK
2.      SAPI
3.      AYAM
Ø Unordered List
Unordered list adalah suatu daftar yang mengabaikan urutan item. Unordered list bisa juga disebut bulleted list. Setiap item dalam unordered list biasanya ditandai dengan bentuk objek tertentu, misalnya kotak, bulat, panah, clan lain-lain. Tag yang digunakan dalam unordered list adalah <UL>…</UL>, dan setiap item di dalamnya dinyatakan dalam tag <LI> sama seperti pada ordered list. Contoh penggunaan unordered list adalah sebagai berikut :
<UL>
<LI>BUKU</LI>
<LI>PENSIL</LI>
<LI>PENGHAPUS</LI>
</UL>
* Hasilnya menjadi :
·         BUKU
·         PENSIL
·         PENGHAPUS
* Untuk mengubah bentuk tanda item dari suatu list atau daftar, biasanya menggunakan beberapa atribut TYPE antara lain sebagai berikut.
1) TYPE = circle, berfungsi untuk membuat tanda lingkaran untuk item.
Contoh :
<UL TYPE="CIRCLE"> 
<LI>SINGA</LI>
<LI>ULAR</LI>
<LI>GAJAH</LI>
</UL>                                                   
Menghasilkan :
o   SINGA
o   ULAR
o   GAJAH
2) TYPE = square, berfungsi untuk membuat tanda kotak untuk item.
Contoh :
<UL TYPE="SQUARE">
<LI>SINGA</LI>
<LI>ULAR</LI>
<LI>GAJAH</LI>
</UL>
Menghasilkan :
§  SINGA
§  ULAR
§  GAJAH
3) TYPE = disc, berfungsi untuk membuat tanda cakram untuk item.
<UL TYPE="DISC"> =====>(CUKUP <UL> SAJA)
<LI>SINGA</LI>
<LI>ULAR</LI>
<LI>GAJAH</LI>
</UL>
Menghasilkan :
·         SINGA
·         ULAR
·         GAJAH
2.      Daftar Definisi / Definition List merupakan daftar yang dibuat untuk menjelaskan suatu teks atau istilah, yang letaknya menjorok dengan istilah yang berhubungan.
Contoh daftar penjelasan tentang sesuatu yang berhubungan dengan internet :
E-mail
Dalam hal ini surat elektronik merupakan pesan elektronik berbentuk surat yang dikirimkan melalui internet.
Chat
Obrolan melalui internet berupa teks secara interaktif.
Modem
Merupakan alat yang diperlukan untuk mengakses internet.


Berikut kode yang bisa di gunakan :
<dl>
<dt>Teks</dt>
<dd>Diskripsi Teks</dd>
<dt>Teks</dt>
<dd>Diskripsi Teks</dd>
<dt>Teks</dt>
<dd>Diskripsi Teks</dd>
</dl>
Keterangan :
a.Definition List <dl> : di gunakan sebagai tag awal dalam sebuah penulisan istilah.
b.Definition Term <dt> : istilah yang akan didefinisikan.
c.Definition Data <dd> : definisi dari istilah yang didefinisikan.
Contoh :
<dl>
<dt><b>Electronic Markets</b></dt>
<dd>EMs adalah sebuah sarana yang menggunakan teknologi informasi dan komunikasi untuk melakukan/menyajikan penawaran dalam sebuah segmen pasar, sehingga pembeli dapat membandingkan berbagai macam harga yang ditawarkan.</dd>
<dt><b>Electronic Data Interchange</b></dt>
<dd>EDI adalah sarana untuk mengefisienkan pertukaran data transaksi-transaksi reguler yang berulang dalam jumlah besar antara organisasi-organisasi komersial.</dd>
<dt><b>Internet Commerce</b></dt>
<dd>Internet commerce adalah penggunaan internet yang berbasis teknologi informasi dan komunikasi untuk perdagangan. Kegiatan komersial ini seperti iklan dalam penjualan produk dan jasa.</dd>
</dl>
Menghasilkan :
Electronic Markets
EMs adalah sebuah sarana yang menggunakan teknologi informasi dan komunikasi untuk melakukan/menyajikan penawaran dalam sebuah segmen pasar, sehingga pembeli dapat membandingkan berbagai macam harga yang ditawarkan.
Electronic Data Interchange
EDI adalah sarana untuk mengefisienkan pertukaran data transaksi-transaksi reguler yang berulang dalam jumlah besar antara organisasi-organisasi komersial.
Internet Commerce
Internet commerce adalah penggunaan internet yang berbasis teknologi informasi dan komunikasi untuk perdagangan. Kegiatan komersial ini seperti iklan dalam penjualan produk dan jasa.

3.      Link (hyperlink) adalah sebuah acuan dalam dokumen hiperteks  ke dokumen yang lain atau sumber lain.  Seperti hal nya suatu kutipan di dalam literatur, dikombinasikan dengan sebuah jaringan data dan sesuai dengan protokol akses sebuah komputer dapat diminta untuk memperoleh sumber yang direferensikan. Pengertian Link atau dalam bahasa Indonesia disebut dengan tautan adalah tulisan atau gambar yang apabila di klik akan menuju halaman tertentu sesuai dengan yang di tentukan oleh pembuat link.
Tujuan dibuatnya link adalah sebagai jalan pintas atau shortcut menuju halaman atau website lain. Link dapat berupa tulisan ataupun gambar.

Cara mengenali link :
-        Pointer akan berubah menjadi sebuah tangan apabila diarahkan ke link, baik link berupa tulisan ataupun gambar.
-        Link berupa tulisan biasanya diberi warna yang terang dan berbeda dengan tulisan lainnya ataupun diberi garis bawah. Contoh : 4Shared

           

Tidak ada komentar:

Posting Komentar