Thursday, May 24, 2012

Penggunaan Numbering, Bullet dan Daftar Istilah pada Blog / Website

Membuat Menu Lists pada Posting Blog diperlukan untuk memberikan penekanan atau penjelasan terhadap item tertentu dalam sebuah makalah atau artikel. Menu lists ini bisa berupa tampilan numbering, bullet atau daftar istilah.


Ada tiga jenis list (daftar) dalam tag HTML yang bisa kita gunakan:

Ordered Lists
Adalah daftar item yang memiliki nomor urut atau peringkat tertentu, ordered lists ini juga disebut daftar bernomor atau numbering seperti pada microsoft word.

Unordered Lists
Adalah daftar yang tidak memiliki perintah pengurutan nomor. Unordered lists ini juga sering disebut daftar bullet, karena mereka memiliki ikon kecil/ bullet di depan daftar item.

Definition Lists
Adalah daftar item yang memiliki dua bagian, yaitu bagian pertama sebagai item yang didefinisikan dan bagian kedua berlaku sebagai definisi yang menjelaskan bagian pertama.

Berikut ini penjelasan tentang penggunaan ketiga jenis lists di atas :

Ordered Lists
Gunakan tag <ol> untuk mengawali dan tag </ol>
untuk mengakhiri perintah Ordered Lists, untuk membuat numbering. Sebagai contoh:


<ol>
      <li> daftar item 1 </li>
      <li> daftar item 2 </li>
      <li> daftar item 3 </li>
</ol> 


Maka tampilan dari tag HTML di atas adalah sebagai berikut :

  1. daftar item 1
  2. daftar item 2
  3. daftar item 3

Anda dapat menggunakan Ordered lists ini untuk menunjukkan urutan tertentu ataupun peringkat berurutan dalam suatu daftar item.
Lebih lanjut baca tentang Ordered Lists Type

Unordered Lists
Gunakan tag <ul> untuk mengawali dan tag </ul>
untuk mengakhiri perintah unordered lists. Tag ini adalah untuk membuat daftar dengan icon di depan item (bullet) bukan angka berurutan (numbering). Penggunaannya mirip dengan ordered lists, yaitu dikombinasikan dengan tag <li>. Sebagai contoh:


<ul>
       <li> daftar item 1 </li>
       <li> daftar item 2 </li>
       <li> daftar item 3 </li>
</ul>


Maka tampilan dari tag HTML di atas adalah sebagai berikut :

  • daftar item 1
  • daftar item 2
  • daftar item 3

Anda dapat menggunakan unordered lists ini untuk membuat daftar yang tidak harus memiliki urutan tertentu. Lists jenis ini paling umum dan sering dijumpai pada halaman blog / website.
Lebih lanjut baca tentang UL Type

Definition Lists
Perintah ini digunakan untuk membuat daftar dengan dua bagian pada setiap entri yaitu istilah untuk didefinisikan dan definisinya. Nah, kalau kita bandingkan tampilannya mirip sebuah kamus.Tag yang dipakai dalam Definition Lists adalah:

<dl> Untuk membuat definition lists
<dt> Untuk membuat daftar istilah
<dd> Untuk menjelaskan definisi dari istilah

Contoh penggunaan definition lists:

<dl>
       <dt> Istilah 1 </dt>
            <dd> Definisi istilah 1</dd>
       <dt> Istilah 2 </dt>
           <dd> Definisi istilah 2</dd>
       <dt> Istilah 3 </dt>
           <dd> Definisi istilah 3</dd>
</dl>


Maka tampilan dari tag HTML di atas adalah sebagai berikut :

Istilah 1
Definisi istilah 1
Istilah 2
Definisi istilah 2
Istilah 3
Definisi istilah 3

Anda dapat menggunakan definition list untuk membuat semacam kamus atau catatan untuk daftar istilah di dalam posting blog / website anda.
Lebih lanjut baca di Variasi penggunaan DL

Penggunaan unsur-unsur penutup </li> , </dt> dan </dd> sebenarnya tidak diperlukan dalam HTML, tetapi diperlukan dalam XHTML. Namun, alangkah lebih baik jika tetap anda cantumkan supaya server tidak bingung dalam mengidentifikasi perintah tersebut.

Tag lain yang berkaitan :
Basic Lists , Ordered Lists , Unordered Lists , Definition Lists

Semoga bermanfaat
Admin - Blog Tutorial

Baca Juga » Info Kontes - Kompetisi Tingkat Nasional-International


1 komentar:

ALDYRELOAD said...

Makasih infonya..

Follow Us

Daftar Artikel

Created by. Amru Sholihin. Powered by Blogger.

TIPS SEO HARI INI

Anda punya Blog? Atau website ingin meningkatkan Page Rank di Search Engine? Klik logo-logo di bawah ini untuk melihat caranya :
ping fast  my blog, website, or RSS feed for Free Ping your blog, website, or RSS feed for Free My Ping in TotalPing.com

PageRank Display

PageRank