Menyimpan Link Pada Button CSS

Tombol atau button adalah sesuatu untuk ditekan untuk mengaktifkan fungsi lainnya yang terdapat di dalam tombol tersebut. Ketika sebuat tombol ditekan, maka akan ada fungsi lainnya yang akan berjalan.

Salah satu fungsi tombol ini yaitu untuk membuka sebuah link dalam sebuah blog. Menaruh sebuah link di blog adalah hal dasar dan mudah dalam membuat sebuah blog.

Namun jika tombol tersebut dibuat dengan menggunakan CSS, maka ada hal yang lain yang harus diperhatikan lebih teliti agar tombolnya lebih berfungsi dengan baik. 

Secara sederhana sebuah link akan berupa kode seperti ini.

<a href="URL Tujuan">Klik Di sini</a>

Jika ingin menggunakan gambar, maka tulisan "Klik Di sini" tinggal diganti dengan kode gambar seperti di bawah ini.

<a href="URL Tujuan"><img src="URL Gambar"/></a>

Begitu pun dengan tombol yang dibuat dengan kode CSS, tinggal ganti saja tulisan "Klik Di Sini" atau "<img src="URL Gambar"/>" tersebut dengan kode pemanggil tombolnya misalnya seperti di bawah ini.

<a href="URL Tujuan"><div class="ButtonOK">button</div></a>

Mudah bukan? Tapi banyak juga yang menyimpan link pada button CSS ini dibalik sehingga fungsi tombolnya kurang maksimal seperti di bawah ini.

<div class="ButtonOK"><a href="URL Tujuan">button</a></div>

Memang tidak salah namun fungsi tombolnya jadi tidak maksimal. Saya ilustrasikan pada tombol-tombol di bawah ini.

Tombol dengan kode seperti ini (Tombol 1): 

<a href="URL Tujuan"><div class="ButtonOK">button</div></a>

button

Tombol dengan kode seperti ini (Tombol 2) - Kurang berfungsi dengan baik: 

<div class="ButtonOK"><a href="URL Tujuan">button</a></div>

button

Coba Anda perhatikan, pada Tombol 1 semua daerah tombol bisa diklik dan berfungsi, namun pada Tombol 2 linknya bisa berfungsi jika Anda meng-klik-nya tepat pada tulisan "button" saja sedangkan di luar itu tombolnya tidak berfungsi dengan baik.

Demikian sharing kali ini, mudah-mudahan sharing tutorial ringan ini bisa dimengerti dan bermanfaat...

Oh iya... jika Anda ingin mencoba membuat tombol seperti di atas, silahkan baca juga postingannya pada link di bawah ini.