Analisis Website secara Search Usability

SERP (Search Engine Result Pages) merupakan fungsi yang sangat sering digunakan

oleh  user.  Ketika  user  bingung  ingin  mencari  informasi  yang  relevan,  biasanya  user
akan mencari-cari tulisan “search” kemudian mengetikan kata kunci yang ingin dicari.
Selanjutnya,  user  akan  memilih  mencari  informasi  yang  dicari  dengan  melihat  hasil
pencarian  yang  ada.  Sebagian  besar  website  sudah  dilengkapi  dengan  SERP.  Teknik
yang  mirip  dengan  yang  dikelola  oleh  Google.  Kali  ini  saya  akan  menganalisis  situs
yang menggunakan teknik SERP, yaitu Telkomsel.

 

Halaman utama situs Telkomsel letak search berada di pojok kiri atas ditandai dengan
textbox dan gambar kaca pembesar. Proses pencarian dapat dipicu dengan meng-klik
tombol kaca pembesar atau cukup menekan tombol ENTER

Terdapat juga navigasi untuk mencari informasi yang sudah dikategorikan ke dalam tiga menu.

Pada lingkaran 1 akan ditampilkan jumlah perkiraan hasil pencarian yang didapatkan.
Hal  ini  membuat  user  yang  kali  pertama  melihat  informasi  ini  akan  merasa  bosan
akibat banyaknya kata kunci yang didapatkan dari hasil pencarian tersebut. Lingkaran
2 merupakan hasil pencarian yang dilengkapi dengan judul yang berupa link dan dua
baris  kalimat  singkat  yang  mengandung  frase  yang  dicari.  Tiap  judul  sudah  diberi
tanda  pembeda  dengan  isi,  sehingga  user  dapat  mengenali  judul  halaman  yang
memuat  kata  kunci.  Sedangkan  kata  hasil  pencarian  lebih  ditonjolkan  dengan
memberi  cetak  tebal  dibandingkan  dengan  teks  lainnya.  Pencarian  kata  sudah
mendukung  case-sensitive  dan  beberapa  kata  sekaligus.  Penggunaan  aljabar  Boolean
OR  dan  AND  sebagai  default  awal.  Namun  pencarian  masih  terdapat  beberapa
kekurangan:

1. Hasil  pencarian  yang  disajikan  tidak  dipecah-pecah  ke  dalam  beberapa  halaman, sehingga  membuat  user  merasa  bosen  untuk  melakukan  scroll  ke  bawah  sampai menemukan informasi yang tepat. 
 
Sebaiknya: 
 
Dengan  halaman  pencarian  yang  sedang  aktif  akan  tercetak  tebal.  Tanda  merah menunjukkan bahwa karakter tersebut dapat diklik.
2. Tidak  memberikan  alternatif  pencarian  jika  user  salah  memasukkan  kata  kunci,
   misal HALO menjadi HAOL.
   
HALO vs HOAL
 
 
 
Sebaiknya:

Kata  “HA LO ”  merupakan  pencarian  alternatif  sebagai  kemungkinan  kesalahan user dalam memasukkan kata kunci.
 
3. Sinonim tidak berlaku dalam pencarian.
Ponsel Vs Telepon Genggam

Ponsel dan telepon genggam memiliki makna yang identik. Sehingga ketika user mencari kata ponsel tidak terdapat pada database, maka kata "telepon genggam" akan menggantikan hasil pencarian.  
 
4. Tata letak tombol search yang berbeda, tidak berada di kanan atas. 
 
Sebaiknya:

5. Terdapat dua tombol search sehingga membuat user menjadi bingung
 
Sebaiknya:
 
Hanya cukup satu tombol search.
Referensi [Anonim].  2009.  20  Search  Usability  Guidelines.  USERFOCUS.                    http://www.userfocus.co.uk/  resources/searchchecklist.html,  (23                    Oktober 2011).  
Bustos,  Linda.  2010.  11  Tips  for  Advanced  Search  Usability.  GetElastic  #1                    Subscribed  Ecommerce  Blog.  http://www.getelastic.com/advanced-search-usability/, (22 Oktober 2011).
Demikian postingan ini, semoga dapat bermanfaat.. ^_^

Jakob Nielson's AlertBox : Top 10 Mistakes in Web Design

Kali ini saya akan membahas secara singkat beberapa contoh dari Top 10 Mistakes in Web Design:

1. Pencarian yang Buruk
 
 
Website: http://www.telkomsel.com
Beberapa website masih memberikan hasil pencarian yang masih kurang maksimal dalam fasilitas searching. Seperti pada situs kartu perdana terbesar di Indonesia, Telkomsel, hanya dapat mencari kata-kata  yang sama persis dengan kata-kata yang terdapat pada halaman yang dicari. Tidak memberikan alternatif pencarian ketika user salah mengetik dalam memberikan input pada fasilitas search. Contoh: HALO berbeda dengan HAOL, sehingga tidak ada hasil pencarian yang ditemukan.


2. File PDF Digunakan untuk Bacaan Online 

Website: http://kemahasiswaan.ipb.ac.id
Pada menu kesejahteraan mahasiswa user mengklik link yang diberi lingkaran biru, user akan dihadapkan kepada tab baru yaitu berupa dokumen berformat pdf yang difasilitasi oleh GoogleDoc. Hal ini membuat user merasa bosan karena melihat format dokumen dalam web. Di samping itu diperlukan waktu yang lama untuk melakukan buffering.


3. Link yang sudah Dikunjungi tidak ada Perubahan Warna

Website: http://ketawa.com
Ketika kita mengunjungi suatu link di website, terkadang user lupa bahwa link yang diklik sudah kita kunjungi sebelumnya. Kita pun baru tersadar setelah halaman dari link yang kita klik tersebut muncul. Sebagai contoh pada situs humor Indonesia, Ketawa.com, link yang telah kita kunjungi tidak berbeda dengan link yang belum kita kunjungi. Hal ini terkadang menjebak kita untuk berkunjung ke link sebelumnya. Belum lagi berapa banyak waktu yang akan terbuang percuma untuk kembali ke halaman sebelumnya. Mengubah warna teks link yang pernah dikunjungi merupakan salah satu solusi yang tepat. Dengan mengubah warna teks, kita akan mengetahui bahwa link tersebut sudah pernah kita kunjungi sebelumnya. Oleh karena itu, user akan terbantu dengan adanya mengubah warna teks pada link yang sudah dikunjungi.


4. Teks tidak Mudah Dibaca (Scanning)
 
 
http://www.yvettesbridalformal.com/ Situs yang bergerak di bidang penyewaan pakaian pengantin ini cenderung menggunakan warna teks yang "menyakitkan" mata. Hal ini membuat user tidak tertarik untuk membacanya. Susunan tata letak, warna jenis, dan background font membuat user bingung dalam menangkap informasi yang disampaikan. Jika teks yang terlihat acak-acakan tersebut disusun menurut format dokumen yang  baku (contoh: penggunaan bulleted list dan lain-lain), maka user akan merasa nyaman.
 
5. Ukuran Teks yang sudah Ditentukan

 
Website: http://www.gordonwaynewatts.com/ 
Situs di atas menyediakan berbagai macam berita dan artikel. Pada halaman home, user dapat melihat artikel yang sebagian besar berupa teks tanpa disertai gambar. Tidak hanya itu, ukuran teks defaultnya juga terlalu kecil. Hal ini akan berakibat pada  user  yang  memiliki  keterbatasan  dalam  penglihatan,  terutama  bagi  mereka yang  berumur  di  atas  40  tahun.  Tidak  disediakan  menu  untuk  memperbesar ukuran  font.  Bukan  memperbesar  ukuran  pixel  pada  layar,  sehingga  semua  yang tampak  pada  layar  terlihat  seperti  dalam  kaca  pembesar.  Hampir  semua  website tidak  menambahkan  fungsi  ini.  Padahal  fungsi  tersebut  akan  sangat  membantu bagi mereka yang memiliki keterbatasan penglihatan.
 
6. Judul Halaman tidak Visibilitas dalam Mesin Pencari

 
Website: http://www.anjingdankucing.com/ 
Website  yang  memiliki  judul  yang  sama  untuk  semua  halaman  terkadang  akan menimbulkan masalah. Contoh pada situs anjingdankucing.com  yang bergerak di bidang binatang peliharaan khususnya kucing dan anjing. Situs ini memiliki nama judul  yang  sama  untuk  setiap  halamannya,  seperti  anjingdankucing.com  |  Pusat Informasi Hewan Peliharaan Anda.... Judul yang panjang terkadang sulit untuk di-searching.  Demikian  juga  pemberian  nama  yang  sama  untuk  setiap  judul  akan menyulitkan user dalam meninjau kembali tab-tab mana yang ingin dilihat.
 
7. Semuanya Terlihat seperti Iklan
 

Website: http://www.lingscars.com/ 
Sepintas, situs yang menyediakan layanan penyewaan (rental) kendaraan roda empat ini tampak seperti iklan (advertisement). Padahal content-content mirip “iklan” ini merupakan layanan yang ditawarkan kepada user. Efek blink pada banner kiri dan beberapa teks yang berkedip membuat beberapa menu tampak seperti iklan. Hal ini mengakibatkan user mengalihkan pandangannya ke lokasi lain yang diduga bukan iklan. Membaca iklan bukanlah merupakan tujuan user untuk mencari informasi. 
 
8. Melanggar Aturan Desain
 

Website: http://www.arngren.net/  
Situs  di  atas  merupakan  salah  situs  penjualan  berbagai  macam  produk  dari kendaraan hingga barang elektronik. Tidak ada spesialisasi terhadap produk yang dijual.  Desain  web  pun  tidak  sesuai  dengan  desain  web  pada  umunya.  Sebagai contoh:  pada  halaman  utama  (home)  user  langsung  disuguhi  dengan  berbagai macam  produk  yang  ditawarkan  tanpa  adanya  deskripsi  singkat  mengenai  situs tersebut.  Seolah-olah  user  sudah  dapat  menebak  informasi  yang  diberikan  oleh website  tersebut.  Selain  itu,  tata  letak  menu  dan  content-nya  pun  masih  belum tertata dengan rapi. Barisan menu tidak dikelompokkan dalam satu banner. Produk pada  halaman  awal  juga  tidak  dikelompok  berdasarkan  klasifikasinya.  Walaupun produknya sudah disertai gambar, judul, dan harga, tetap saja user merasa kurang nyaman untuk melihat produk tersebut. 
 
9. Membuka Windows Browser yang Baru
 

Website: http://www.stafaband.info/ 
Membuka jendela/tab baru pada browser terkadang dilakukan oleh suatu  website tertentu  agar  user  tetap  berada  pada  web  tersebut.  Hal  ini  dapat  ditemukan  pada website yang menyediakan informasi di dunia musik, www.stafaband.info. Ketika user  meng-klik  link  yang  diberi  tanda  merah,  browser  akan  terjadi  penambahan tabulasi.  Penambahan  tabulasi  baru  ini  membuat  user  merasa  jenuh  karena  akan memenuhi  area  tabulasi  dan  mempersempit  space  tabulasi.  Sehingga  teks  pada judul halaman akan dipersingkat.
 
10. Tidak Menjawab Pertanyaan User
    
    
    Website: id.asus.com 
    Driver  merupakan  hal  sangat  diperlukan  ketika  user  menginstal  OS  baru  pada notebook.  Ketika  CD/DVD  driver  tersebut  hilang  website  merk  produk  tersebut akan menjadi sumber untuk mendapatkan informasi.  Pada produk notebook Asus tertentu  tidak  disediakan  driver  VGA  yang  sehingga  user  harus  mencari  sumber lain.
     
    Demikian postingan dari saya. Semoga bermanfaat. ^_^

Sekilas tentang QR Code

Gambar di samping adalah salah satu contoh dari QR Code (Quick-Response Code) atau kode respon-cepat yang saya buat melalui situs qrcode.kaywa.com. Gambar tersebut jika direpresntasikan ke dalam teks akan mengacu ke alamat blog ini, sapariansyah.blogspot.com.

Ulasan kali ini, saya akan membahas sedikit tentang QR Code, yang notabene-nya memiliki fungsi yang mirip dengan pendahulunya, Barcode sebagai  penampung informasi. Menurut Wikipedia, QR adalah suatu jenis kode matriks atau kode batang dua dimensi yang dikembangkan oleh Denso Wave, sebuah divisi Denso Corporation yang merupakan sebuah perusahaan Jepang dan dipublikasikan pada tahun 1994. QR code lebih banyak menampung informasi dibandingkan Barcode. Hal ini diakibatkan teknik penyimpanan di antara keduanyaberbeda. Barcode hanya satu dimensi, sedangkan QR code sudah dapat menampung informasi secara dua dimensi.

Banyak informasi yang dapat ditampung oleh QR code, baik itu teks, alamat URL, nomor telepon, ataupun informasi penting lainnya. Bahkan, QR Code digunakan untuk menampung huruf kanji dan kana. Menurut Ching-yin Law dan Simon So dalam Journal of Educational Technology Development and Exchange yang berjudul QR codes in education, menyebutkan bahwa QR Code dapat menampung 7.089 karakter numerik, 4.296 alphanumerik, 2.953 binary bytes, 1.817 Kanji.           Adapun beberapa karakteristik dari QR Code:

1. Dapat dibaca secara 360 derajat sehingga dapat dilihat dari sudut manapun.
2. Ketahanan terhadap simbol yang tidak beraturan.
3. Mampu merestore data. QR Code menggunakan 4 level pengkoreksian yang berbeda. 
4. Encoding huruf Kanji dan Kana lebih effisien.
5. Mampu menghubungkan simbol-simbol. 

Banyak imlementasi dari QR Code ini, mulai dari tiket, label produk, label tes golongan darah, tiket penumpang kapal, identitas pasien dan lain sebagainnya. Untuk membaca QR Code dapat menggunakan aplikasi mobile seperti iMatrix, sehingga tidak diperlukan alat yang lebih kompleks. Dengan menggunakan aplikasi ini handphone berkamera dapat memindai QR Code menjadi informasi yang dapat dibaca oleh manusia.

Adapun ide implementasi QR Code menurut saya adalah penggunaan QR Code pada jasa pengiriman barang, Pos Indonesia. Sebelum barang dikirimkan, petugas akan mengubah semua informasi yang terdapat pada paket kiriman akan di-generate ke dalam QR Code. Informasi ini berupa nama pengirim, alamat pengirim, kontak pengirim, nama penerima, alamat penerima, dan kontak penerima ataupun informasi lain yang dirasa penting. Penggunaan QR Code ini di samping dapat menghemat kertas, juga kerahasiaan dari informasi yang terdapat dari paket kiriman lebih terjaga. Sehingga barang yang dikirimkan hanya diketahui oleh pihak ketiga.

Demikian ulasan mengenai QR Code dan implementasinya. Semoga bermanfaat.. ^_^ (spy)

Dari Mata Turun ke Hati

"Dari mata, turun ke hati", begitulah peribahasa mengatakan.Ternyata, seseorang lebih tertarik terhadap sesuatu yang memiliki penampilan yang menarik.

Mungkin tampilan website sekarang sudah banyak menganut peribahasa tersebut. Kebutuhan akan informasi yang semakin deras, tak henti-hentinya para web designer membuat website mereka menjadi lebih menarik, di samping itu tidak membingungkan para pengaksesnya. Bahkan, orang-orang langsung tertarik pada suatu produk tanpa harus melihat barang secara langsung dan hanya cukup mengaksesnya saja. Hal ini akan mengurangi biaya pemasaran dengan cara "menerjunkan" langsung para salesman.

Tata letak, pewarnaan, content, update, merupakan beberapa hal yang mutlak diperlukan dalam membuat tampilan menjadi lebih user-friendly. Dalam postingan ini saya akan mencoba sedikit me-review website yang bergerak di produk komputer, www.asus.com.

Kali pertama mengakses situs ini, pengguna akan disuguhkan tampilan peta dunia. Peta ini akan berubah seiring kita memilih region. Pemilihan ini akan menentukan bahasa maupun content dari website sesuai dengan negara yang kita pilih. Tampilan yang dinominasi oleh warna putih dan biru yang menarik.

Setelah memilih region, kita akan masuk ke dalam halaman utama yang akan disambut oleh berbagai produk ASUS yang terbaru. Backgorund berwarna putih membuat halaman ini lebih bebas untuk dilapisi dengan berbagai warna.

Pada halaman tersebut terdapat menu yang disusun secara horizontal, slideshow tentang produk terbaru yang menyerupai poster ataupun berita yang nampak apik dan dinamis. Jika salah satu gambar diklik, maka kita akan melihat lebih jauh tentang produk tersebut.

Di saat kita memilih menu Produk, akan terdapat menu dropdown yang berisi kategori-kategori produk dari ASUS.

Pemilihan salah satu kategori tersebut akan mengantarkan kita ke halaman yang berisi semua produk yang bersesuaian. Sebagian produk-produk tersebut akan dikelompokkan lagi berdasarkan spesifikasi tertentu. Hal ini membuat kita menjadi lebih mudah dalam memilih produk ASUS.

Produk yang kita pilih selanjutnya akan ditampilkan secara detail. Hal ini nampaknya yang membuat para pelanggan tidak perlu repot-repot mengecek produk secara langsung. Di samping itu, ASUS juga menyediakan beberapa update terhadap produknya.

Secara keseluruhan tampilan website tersebut menarik, baik dalam tata letak, pewarnaan yang cenderung hidup, content-content yang mudah dipahami dan lengkap serta lebih user-friendly.
Sekian dan semoga review ini dapat bermanfaat. ^_^ (spy)