Belajar HTML Dasar 3:warna kehidupan

Belajar HTML-Dasar 3

Setelah Anda mempelajari HTML – Dasar 2 pada blok ini mengenai element-element text, kali ini saya akan mencoba memaparkan tentang mengenai elemen-elemen dasar Link <A> mudah-mudahan dengan mempelajari bagian ini anda dapat memahami penggunaan element-element untuk menghubungkan ke internal atau eksternal halaman web dan juga dilengkapi dengan elemen Daftar urutan yang nantinya berguna untuk membuat website atau blog Anda lebih kelihtan rapi.

Link/AnchorLink <A>

Objektif :
Setelah mempelajari materi Link ini diharapkan anda dapat memahami penggunaan element-element untuk menghubungkan ke internal atau eksternal halaman web.

Element :

Element </A>

Element </a> , befungsi untuk menghubungkan ke internal ataupun eksternal halaman web. Element ini mempunyai attribute href, name, dan target. Attribute href berfungsi sebagai hypertext reference yang mempunyai nilai URI (uniform resource identifier) yang akan menghubungkan ke eksternal halaman web. Attribute name berfungsi untuk menghubungkan ke tempat tujuan dalam halaman web (anchor). Attribute target berfungsi untuk menampilkan halaman web pada suatu jendela frame atau jendela baru.

Sintaks:

<a href="uri" name="name" target="_blank"|"parent"|"_top"|"_self">
...........................
</a> -------------

Element </a> sering disebut juga dengan perintah anchor <A> digunakan untuk membuat suatu link. Untuk membuat link ke dokumen HTML lain digunakan perintah <A HREF = “nama_dokumen”>Teks pada browser</A>.
Anda juga bisa membuat link dalam sebuah dokumen HTML. Untuk itu perlu dipersiapkan nama anchor lokasi tujuan dari link tersebut. Nama anchor dibuat dengan menambahkan atribut NAME pada tag <A>. Misalnya <A NAME = “Bugs”</A>. Cara melakukan link ke bagian tersebut adalah <A HREF = “#nama_anchor”>teks pada browser</A>.

Contoh:

<HTML>
<HEAD>
<TITLE>Link</TITLE>
</HEAD>
<BODY>
<A NAME="traffic">3 Cara meningkatkan traffic blog :</A>
<BLOCKQUOTE>
1.Pakai Teknis SEO,<A HREF="http://bisnisonlinetop1.blogspot.com/2011/05/cara-cerdas-meningkatkan-pagerange.html">Baca selengkapnya</A>
2.Niche Content
3.Gratiskan apa yang bisa digratiskan

<A HREF="http://bisnisonlinetop1.blogspot.com/2011/05/keyword-teknis-seo.html">Untuk penjelasan lebih lanjut silahkan klik disini</A>
</BLOCKQUOTE>
<A NAME="traffic">link no error</A>
<BLOCKQUOTE>
Pastikan tidak ada link yang error di blok Anda
 Tidak kebayangkan pengunjung yang kecewa dan pergi karena ada link yang rusak.
</BLOCKQUOTE>
<A HREF="http://bisnisonlinetop1.blogspot.com /2011/05/seo-anchor-text-dan-teknis-optimasi-seo.html">Untuk cara teknis SEO baca selengkapnya</A>
<BLOCKQUOTE>
Link navigasi blok harus tersusun secara rapi
 Dan tidak membingungkan pengunjung.
</BLOCKQUOTE>
<A HREF="#traffic">kembali ke atas</A>
</BODY>
</HTML>

linkhtml1

3 HTML Daftar Urutan

Objektif :
Setelah mempelajari materi ini diharapkan anda dapat memahami penggunaan element-element untuk pembuatan daftar urutan.

Element :

Element OL(ordered list), Element UL(unordered list), Element LI(list item).

1. Element OL (Orderd List).

Element OL berfungsi untuk membuat nomor daftar urut. Element ini mempunyai attribute yaitu start, dan type. Attribute start berfungsi untuk memberikan nilai awal dari daftar urutan, attribute type berfungsi untuk memilih bentuk daftar urutan yaitu A untuk abjad huruf besar, a untuk abjad huruf kecil, I untuk abjad romawi besar, i untuk abjad romawi kecil, 1 untuk angka decimal (default: start="1" type="1" ). Dalam element OL harus terdapat beberapa element LI.

Sintaks:

<ol start="number" type="A"|"a"|"I"|"i"|"1">
........................
</ol>

Ordered list digunakan untuk membuat daftar dimana tiap bagiannya memiliki nomor secara berurut. Ordered list dimulai dengan menggunakan tag <OL> dan diakhiri </OL>. Untuk menyatakan tiap bagiannya digunakan tag <LI> dimana tag ini tidak menggunakan penutup.

Contoh:
<HTML> <HEAD><TITLE>Ordered List</TITLE></HEAD> <BODY> 5 situs PTC yang sangat direkomendasikan <OL> <LI>NEOBUX <LI>ONBUX <LI>INCREASEBUX <LI>ClikSense <LI>SchnaapKliks </OL> </BODY> <HTML>

olhtml

Ketika menggunakan perintah ordered list maka default penomoran adalah 1, 2, 3, …, Anda bisa mengubah nomor tersebut menggunakan atribut TYPE pada tag <OL>.

TYPE = 1 ; daftar berurut dengan nomor 1, 2, 3 (default)
TYPE = I ; daftar berurut dengan menggunakan bilangan Romawi besar (I, II, III, IV, …)
TYPE = I ; daftar berurut dengan menggunakan bilangan Romawi huruf kecil (i, ii, iii, iv, …)
TYPE = A ; daftar berurut dengan menggunakan abjad besar (A, B, C, D, …)
TYPE = a ; daftar berurut dengan menggunakan abjad kecil (a, b, c, d, …)

Selain mengubah jenis penomoran, HTML juga menyediakan perintah untuk menentukan nilai awal penomoran. Atribut yang digunakan adalah START = n, dimana n adalah nilai awal penomoran.

Contoh:

<HTML> <HEAD> <TITLE>OL atribut type</TITLE> </HEAD> <BODY> <OL TYPE=A> <LI>Tiga Payment Processor Yang Legitimasi : <OL TYPE=I> <LI>PayPal <LI>AlertPay <LI>LibertyReserve </OL><LI>Tiga Lainnya : <OL TYPE=1 START=4> <LI>Netteler <LI>HooPays <LI>WebMoney </OL> </BODY> <HTML>

olhtml2

2. Element UL (Unordered List)

Element UL berfungsi untuk membuat daftar tanpa nomor urut (dalam format bullet). Element ini mempunyai attribute yaitu type. Attribute type berfungsi untuk memilih bentuk bullet yang digunakan. Nilai dari pada attribute type ini adalah "circle", "square" dan "disc" . Dalam element UL harus terdapat beberapa element LI.

Sintaks:

<ul type="circle"|"square"|"disc">
..........................
</ul>

Berbeda dengan ordered list, dalam unordered list tidak dijumpai urutan dalam suatu daftar. Setiap bagian dari unordered list ditandai dengan tanda bullet. Tanda bullet menjadi defaultdalam unordered list. Untuk membuat daftar dengan tanda ini digunakan tag awal <UL> dan tag akhir </UL>. Sama seperti ordered list, untuk tiap-tiap bagian digunakan <LI> tanpa tag penutup.

Contoh:

<HTML> <HEAD> <TITLE>Element Unordered List</TITLE> </HEAD> <BODY> Tiga Situs Bisnis Internet <UL> <LI>PTC ( Paid To Click ) <LI>PTSurv. ( Paid To Surveys ) <LI>PPC ( Paid Per Click ) </UL> </BODY> <HTML>

ULhtml1

Selain default tanda bullet, Anda bisa menggunakan tanda cakram/disk, lingkaran, atau kotak. Caranya dengan menggunakan atribut TYPE pada tag <UL>

Contoh:

<HTML> <HEAD> <TITLE>Element UL dengan atribut</TITLE> </HEAD> <BODY> Jenis bisnis Internet Marketing <UL TYPE=square> <LI>Ad Network <LI>Art Supply Store <LI>Amazon <LI>etc. </UL> </BODY> <HTML>

ulhtml2

3. Element LI (List Item)

Element LI merupakan isi dari pada daftar. Element ini harus berada di dalam element OL atau UL. Element ini mempunyai attribute type dan value. Nilai attribute type adalah A,a,I,i,1,circle,square,disc dan attribute value berisikan nilai nomor urutan dari attribute type.

Sintaks:

<li type="A"|"a"|"I"|"i"|"1"|"circle"|"square"|"disc">
..........................
</li>

Sampai disini saya harap Anda sudah dapat memahami seluiruh element dasar utama pada program HTML, untuk lebih memperdalamnya lagi silahkan Anda melanjutkannya ke tingkat lanjutan …!!!

Belajar HTML Dasar 3

Belajar HTML-Dasar 3

Link/AnchorLink <A>

{ 0 komentar... Views All / Send Comment! }

Posting Komentar

Entri Populer

Arsip Blog