Membuat Anchor Link
Anchor link adalah sebuah kata atau pharase kata yang mengandung link URL, apabila diklik akan menuju ke suatu alamat URL tertentu.
Anchor link adalah sebuah kata atau pharase kata yang mengandung link URL, apabila diklik akan menuju ke suatu alamat URL tertentu.
Contoh :
Kata TONGKONAN ingin diarahkan ke alamat URL "http://tongkonanku.blogspot.com" maka kode HTML-nya adalah :
<a href="http://tongkonanku.blogspot.com">TONGKONAN</a>
Maka jadinya akan seperti ini TONGKONAN.
Dari kode HTML di atas bisa kita tambahkan kode HTML lain (perintah lain), misalnya supaya apabila anchor linknya diklik maka alamat URL yang di tuju akan terbuka di window baru (new window) atau tab baru (new tab). Kode yang ditambahkan adalah target="new" atau target="_blank" terserah mau menggunakan yang mana, fungsinya sama saja. Contoh penerapannya sbb :
<a href="http://tongkonanku.blogspot.com" target="_blank">TONGKONAN</a>maka hasilnya akan akan seperti ini TONGKONAN, silahkan klik untuk melihat efeknya.
kita juga bisa menambahkan perintah title="isi keterangan" supaya saat kursor menyentuh anchor link, akan muncul tulisan sesuai dengan yang anda inginkan.
<a title="Personal Blog" href="http://tongkonanku.blogspot.com">TONGKONAN</a>hasilnya seperti ini TONGKONAN, arahkan kursor anda ke kata tongkonan untuk melihat efeknya.
Memunculkan dan mengarahkan Image/Gambar ke alamat URL tertentu
Kadang kala ada sesuatu yang tidak bisa kta jelaskan dengan bahasa tulisan maupun lisan, dan itu hanya bisa dijelaskan dengan bahasa visual melalui gambar/image, flash (animasi) atau video (film). Maka dari itu Kode atau perintah HTML untuk menampilkan dan mengarahkan gambar/image sangat perlu kita kuasai.
Memunculkan Image/Gambar
Kode HTML yang digunakan untuk memunculkan gambar adalah <img src="alamat URL image/gambar"> . Kita juga bisa menambahkan perintah/kode untuk mengatur atau menentukan ukuran gambar/image height="131" dan width="129" ganti angka dalam tanda petik sesuai ukuran gambar yang anda inginkan. Jika perintah height dan width tidak ditambahkan maka gambar akan muncul sesuai ukuran aslinya.
Contoh :
Saya ingin menampil sebuah image yang beralamat di http://img144.imageshack.us/img144/2949/spyenginecopyyj4.jpg dengan lebar=180 dan tinggi=120 (satuan ukuran mengunakan pixel) maka kode HTML-nya adalah :
<img src="http://img144.imageshack.us/img144/2949/spyenginecopyyj4.jpg" height="155" width="217">
Maka Hasilnya seperti ini :
Kode lain yang bisa kita tambahkan (hight recomended) yaitu ALT="keteragan gambar/keyword"
<img alt="Spyder Man" src="http://feriyunus.page.google.com/ganteng.jpg" height="155" width="217">
Dengan menambahkan kode ini maka apabila ada orang yang mencari image/gambar di mesin pencari (search engine) dengan kata kunci yang berhubungan dengan keteranagan gambar/image pada blog kita, maka gambar/image di blog kita akan muncul di halaman hasil pencarian search engine. Keuntungannya adalah apabila gambar tersebut diklik maka orang tersebut akan langsung diarahkan ke blog/website kita (ini merupakan salah satu teknik SEO).
Mengarahkan Image ke alamat URL tertentu
Image/gambar juga bisa kita arahkan ke suatu alamat URL tertentu. Jadi ketika gambar tersebut diklik, maka kita akan dibawa ke alamat URL yang telah kita tentukan. Caranya sangat mudah, tinggal menggabungkan kode2 HTML yang telah kita bahas di atas.
Contoh :
Gambar/Image dengan yang beralamat di http://img150.imageshack.us/img150/8258/parisve2.jpg ingin saya arahkan ke htt://tongkonanku.blogpot.com maka kode HTML-nya adalah :
<a href="http://img150.imageshack.us/img150/8258/parisve2.jpg"><img src="htt://feriyunus.page.google.com/ganteng.jpg"></a>
Perintah2 lain yang telah kita bahas sebelumnya di atas, juga bisa kita tambahkan sehingga jadinya seperti ini :
<a title="TONGKONAN" href="htt://tongkonanku.blogspot.com" target="new"><img alt="Pantai ParangTritis Yogyakarta" src="htt://feriyunus.page.google.com/ganteng.jpg" height="155" widht="217"></a>
Maka hasilnya seperti ini :
Sebenarnya masih ada beberapa Kode HTML lagi yang Wajib kita ketahui/kuasai bila kita terjun ke dunia web atau blog. seperti membuat teks tebal, miring, bergaris bawah, kemudian menempatkan gambar di sebelah kiri, tengah dan kanan. Tapi karena berhubung saya udah capek dan ngantuk, maka cukup sekian dulu kali ye..., udah ngantuk banget nich.
Untuk kode HTML lainnya, kita bahas di lain waktu aja ya...
Tidak ada komentar:
Posting Komentar