February 4, 2015

Mengubah Warna Link dalam Postingan Blog

Romel Tea February 4, 2015

APA warna link (hyperlink) di blog Anda? Jika bukan biru (blue), maka segera ganti dengan warna biru! Pasalnya, biru adalah Persib! (Gak nyambung?)

Biru adalah warna link "default" Google, Facebook, Twitter, Yahoo, dan situs-situs besar lainnya. Maka, jika link di posting blog Anda warna lain, blog Anda akan dianggap "asing" oleh pengguna. Pengunjung tidak familir dengan warna link selain biru.

Warna Link Google


Dalam dunia website/blog atau internet, warna link biru sudah menjadi "tradisi". Dengan demikian, ini menyangkut User Experience (UX) yang tidak boleh dicederai. Blog kita harus user friendly, maka link pun harus biru agar pengunjung langung paham bahwa tulisan berwarna biru adalah tautan.

Pakar usability website, Jakob Nielsen, sudah membahas soal ini. Intinya, link di website/blog sebaiknya warna biru. Bahkan, selain berwarna biru, ia menyarankan juga dikasih garis bawah (underline).

"Textual links should be colored and underlined to achieve the best perceived affordance of clickability," gitu katanya. Selengkapnya baca: Guidelines for Visualizing Links.

KODE HTML WARNA BIRU
Klinik Blogging ini juga menggunakan warna biru di link-nya. Birunya meniru NN Group milik Jakob Nielsen.

Bahkan, visited link (tautan yang sudah dikunjungi) juga dikasih warana seperti website NN Group. Ini kode warnanya:

#03c (Link Color)
#639 (Visited Link Color)

Penerapannya di template Klinik Blogging seperti ini:

a,a:link {color:#03c;text-decoration:none}
a:visited{color:#639;text-decoration:none}

Kita bisa juga menggunakan warna biru mirip Facebook, Twitter, dll. Ini daftar kodenya:
  1. Biru Facebook: #3b5998
  2. Biru Twitter: #55acee / 3498db
  3. Biru Harian Terbit: #0E62AA
  4. Biru Persib: #03C
  5. Biru Detikcom: #284296
  6. Biru oxford: #09223e
  7. Top Background FB: #3a5795
CARA MENGUBAH WARNA LINK
1. Template > Edit HTML
2. Cari kode "link" yang biasanya deketan sama kode "visited" dan "hover"
3. Di sana ada kode warna yang diawali tanda pagar (#), misalnya #294969.
4. Di sanalah pula kita ganti dengan kode warna biru, jika belum biru.

Itu "hover" apaan? Hover itu adalah warna saat mouse mengarah ke sana. Warna hover jangan sama biru, tapi pake misalnya warna merah (#c00) atau lainnya. (Lihat Kode Warna HTML).*

2 comments:

  1. mantap gan,, ane coba dulu,, soalnya kurang bingung dari kemarin mau ngerubah warna link tapi ga tau gimana caranya

    ReplyDelete

No Spam, Please!