Dalam pelajaran ini, Anda akan belajar bagaimana membuat link antar halaman.

Apa yang saya perlukan untuk membuat link?

Untuk membuat link, Anda menggunakan apa yang Anda selalu menggunakan ketika coding HTML: elemen Unsur sederhana dengan satu atribut dan Anda akan dapat link ke apa saja.. Berikut adalah contoh dari apa yang link ke HTML.net bisa terlihat seperti:

Contoh 1:

 <a href="http://sersandi.blogspot.com/">Berikut ini Contoh blog Sersan</a>

Akan terlihat seperti ini di browser:

Berikut ini Contoh blog Sersan

Elemen a singkatan dari "jangkar". Dan atribut href adalah singkatan dari "hypertext referensi", yang menentukan mana mengarah ke link - biasanya alamat di internet atau nama file.
Dalam contoh di atas atribut href memiliki nilai "http://www.html.net", yang merupakan alamat lengkap HTML.net dan disebut URL (Uniform Resource Locator). Perhatikan bahwa "http://" selalu harus disertakan dalam URL. Kalimat "Berikut ini adalah link untuk HTML.net" adalah teks yang ditampilkan dalam browser sebagai link. Ingatlah untuk menutup elemen dengan </a> .

Bagaimana dengan link antara halaman saya sendiri?

Jika Anda ingin membuat link antar halaman di situs yang sama, Anda tidak perlu menguraikan seluruh alamat (URL) untuk dokumen. Sebagai contoh, jika Anda telah membuat dua halaman (mari kita sebut mereka page1.htm dan page2.htm) dan disimpan dalam folder yang sama Anda dapat membuat link dari satu halaman ke halaman lain dengan hanya mengetik nama file dalam link. Dalam keadaan seperti sebuah link dari page1.htm untuk page2.htm bisa terlihat seperti ini:

Contoh 2:

 <a href="page2.htm">Click here to go to page 2</a>
 <a href="page2.htm">Click here to go to page 2</a>

Jika halaman 2 ditempatkan dalam subfolder (bernama "subfolder"), link bisa terlihat seperti ini:

Contoh 3:

 <a href="subfolder/page2.htm">Click here to go to page 2</a>
 <a href="subfolder/page2.htm">Click here to go to page 2</a>

Sebaliknya, sebuah link dari halaman 2 (dalam subfolder) ke halaman 1 akan terlihat seperti ini:

Contoh 4:

 <a href="../page1.htm">A link to page 1</a>
 <a href="../page1.htm">A link to page 1</a>

".. /" Poin ke level satu folder naik dari posisi file dari link yang dibuat. Setelah sistem yang sama, Anda juga dapat menunjuk dua (atau lebih) folder sampai dengan menulis ".. / .. /".
Apakah Anda memahami sistem? Atau, Anda selalu dapat mengetik alamat lengkap untuk file (URL).

Bagaimana dengan internal link dalam suatu halaman?

Anda juga dapat membuat link internal dalam suatu halaman - misalnya daftar isi di atas dengan link ke setiap bab di bawah ini. Yang perlu Anda gunakan adalah atribut yang sangat berguna yang disebut id (identifikasi) dan simbol "#".
Gunakan id atribut untuk menandai elemen yang ingin Anda link. Sebagai contoh:

 <h1 id="heading1">heading 1</h1>
 <h1 id="heading1">heading 1</h1>

Sekarang Anda dapat membuat link ke elemen bahwa dengan menggunakan "#" di atribut link. The "#" harus diikuti dengan id dari tag yang ingin Anda link ke. Sebagai contoh:

 <a href="#heading1">Link to heading 1</a>
 <a href="#heading1">Link to heading 1</a>

Semua akan menjadi jelas dengan contoh:

Contoh 5:

 <html> <head> </head> <body> <p><a href="#heading1">Link to heading 1</a></p> <p><a href="#heading2">Link to heading 2</a></p> <h1 id="heading1">heading 1</h1> <p>Text text text text</p> <h1 id="heading2">heading 2</h1> <p>Text text text text</p> </body> </html>
 <html> <head> </head> <body> <p><a href="#heading1">Link to heading 1</a></p> <p><a href="#heading2">Link to heading 2</a></p> <h1 id="heading1">heading 1</h1> <p>Text text text text</p> <h1 id="heading2">heading 2</h1> <p>Text text text text</p> </body> </html>

akan terlihat seperti ini di browser (klik pada dua link):

Link ke pos 1
Link ke judul 2

Heading 1

Lebar teks teks teks

Heading 2

Lebar teks teks teks

(Catatan: Sebuah atribut id harus dimulai dengan huruf a)

Apakah saya dapat link ke hal lain?

Anda juga dapat membuat link ke alamat e-mail. Hal ini dilakukan di hampir cara yang sama seperti ketika Anda link ke dokumen:

Contoh 6:

 <a href="mailto:xxxxxxxx@yahoo.com">Kirim e-mail kepada siapa pun di Sersandi.blogspot.com</a>

akan terlihat seperti ini di browser:

Kirim e-mail kepada siapa pun di Sersandi.blogspot.com

Satu-satunya perbedaan antara link ke e-mail dan link ke file adalah bahwa alih-alih mengetikkan alamat dari sebuah dokumen, Anda mengetik mailto: diikuti dengan alamat e-mail. Ketika link diklik, default program e-mail terbuka dengan pesan kosong baru ditujukan ke alamat e-mail yang ditetapkan. Perlu diketahui bahwa fungsi ini hanya akan bekerja jika ada program e-mail diinstal pada komputer Anda. Cobalah!

Apakah ada atribut lain yang saya harus tahu?

Untuk membuat link, Anda selalu harus menggunakan href atribut. Selain itu, Anda juga dapat menempatkan sebuah title link anda:

Contoh 7:

 <a href="http://sersandi.blogspot.com/" title="sersan blog">HTML.net</a>
 <a href="http://sersandi.blogspot.com/" title="sersan blog">HTML.net</a>

Akan terlihat seperti ini di browser:

sersandi.blogspot.com

Atribut judul digunakan untuk mengetik deskripsi singkat link. Jika Anda - tanpa mengklik - tempat kursor di atas link tersebut, Anda akan melihat teks "Kunjungi HTML.net dan belajar HTML" muncul.

These icons link to social bookmarking sites where readers can share and discover new web pages.