Pembayang (watermark/input hint) pada input box
Posted by mkhairulKalau ada input box sahaja, tak banyak membantu. Kena ada pembayang, apa yang harus aku taip pada input box ni, label sahaja pun kadang-kadang tak membantu, kalau boleh, user ni nak kita pegang jari dia tolong tekan kan untuk dia. Tapi melampau la kan, kita pun ada kerja lain.. so kita beri pembayang, tentang apa yang perlu dimasukkan.
Contohnya, input box dibawah
Memang simple habis. Tapi kalau ditambah, “hint” dibawahnya, jadi gini pulak..
Ok la tu.. ada hint. Tapi disesetengah situasi, nak kena hint tu ada DALAM text box tu. Macam ni..
Ni dia panggil watermark. Aku pun tak pasti apsal dia panggil watermark, aku lagi suka “input hint” tapi ape-ape je lah.
Jadi, watermark tu digunakan seperti berikut..
Haaaaa.. tu dia. Nanti ko mesti pasti teriak, TAPI APSAL DIA MACAM BIASA JE, TAK KELABU PUN WATERMARK TU. Aku, kalau ada sebelah ko, aku pasti akan membuat look of disapproval.
Ye lah, ko tak apply CSS dia, macam mana dia nak jadi kelabu. So, taruk nih.
.watermark{ color: #999999 !important; font-style: italic; }
Yang ni aku implement dalam aplikasi aku.
Ha, gitu lah kisahnya watermark dan “input hint” untuk setakat ni. Pembayang ni takde hal nak letak mana pun, bawah ke, dalam ke, asalkan ada. Baru nampak “canggih” sket. Haha.
Takde la, kadang-kadang benda kecik ni orang tak perasan, tapi kalau ada, ianya membantu. Dan benda-benda kecik ni memang banyak (sikit kat situ, sikit kat sini) dan aku kategorikan sebagai “remeh”. Tapi tu la, remeh ni la yang buat aplikasi jadi best. Macam sikit-sikit jadi bukit gitu. IT ALL ADDS UP TO DA TOTAL USER EXPERIENCE (walaupun usernya aku sorang je). Ha.. jadi setakat ni saja semoga berjumpa lagi untuk bersembang di post yang akan datang.
This entry was posted on Sunday, January 23rd, 2011 at 4:02 am and is filed under javascript, Tip, ui. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.