Analisis Antarmuka Pencarian dan Hasil Pencarian (SERP)

Antarmuka pencarian pada situs www.indonesia.travel sekilas tampak sempurna, text box yang diikuti dengan button berlabelkan kata search di samping kanannya. Namun ternyata ada beberapa kekurangan yang masih dimiliki antarmuka tersebut. Text box yang digunakan telah diatur agar menampilkan kata search dalam kondisi default. Hal ini merupakan kesalahan yang sering dilakukan developer saat membuat sebuah situs web (Justin, 2011). Sebenarnya hal itu tidak perlu dilakukan karena hanya akan memperumit keadaan. Akan lebih sederhana jika text box dibiarkan dalam keadaan kosong untuk kondisi default.

antarmuka pencarian pada situs www.indonesia.travel

Kesalahan lain yang terlihat jelas adalah penggunaan button yang tidak clickable. Sebagian orang mungkin berpikir bahwa hal ini sepele, namun kesalahan sepele ini dapat membuat pengguna bertanya-tanya mengenai button ini. Dan ketika pengguna bertanya-tanya, perhatiannya akan teralihkan dari task yang seharusnya ia kerjakan. Bukan tidak mungkin hal ini membuat pengguna tidak dapat menyelesaikan tugasnya atau yang terburuk, meninggalkan situs web tersebut (Krug, 2006).

Hal lain yang perlu diperhatikan adalah posisi search box tersebut pada situs. Sebenarnya posisi yang diterapkan dalam web ini tidak bermasalah. Search box telah diletakkan di tempat yang mudah dijangkau mata pengguna. Sayangnya beberapa pengguna akan mengharapkan search box ini ada di pojok kanan atas sebuah situs (Travis, 2009). Karena itu tidak ada salahnya jika kita meletakkannya di tempat yang diharapkan pengguna.

Kapasitas karakter yang mampu ditampung text box tersebut adalah 26 karakter. Kapasitas text box yang dimaksud di sini adalah banyaknya karakter yang mampu ditampilkan text box, bukan maksimal karakter dari keywords. Cukup banyak untuk ukuran situs ini, namun tetap kalah dengan kapasitas text box google yang mampu menampung 61 karakter.

Selanjutnya mari kita beralih pada hasil pencarian yang ditampilkan. Pertama saya mencoba memasukkan keywords kosong (empty kerwords) dan menekan tombol enter pada keyboard. Kemudian didapatkan keluaran seperti yang ditunjukkan gambar di bawah ini.

hasil pencarian dengan empty keywords

Dari gambar tersebut terlihat bahwa sistem menampilkan pemberitahuan untuk memasukkan keywords. Hal ini merupakan satu nilai plus untuk situs ini karena mampu menangani empty keywords. Sebuah sistem pencarian harus mampu menangani empty keywords atau empty queries dengan baik jika ingin dikatakan sebagai sistem yang baik (Travis, 2009).

Kemudian saya mencoba melakukan pencarian untuk kata ‘borobuduur’. Ternyata sistem tidak berhasil menemukan file yang sesuai dengan keywords yang saya berikan. Satu hal yang perlu digaris bawahi adalah tidak adanya pemberitahuan dari sistem bahwa mungkin saja terjadi kesalahan penulisan pada keywords yang saya masukkan. Memang pemberitahuan ini tidak terlalu mendesak karena di atas hasil setiap pencarian, telah ditampilkan keywords yang digunakan untuk pencarian tersebut. Sistem juga tidak memberikan keywords anjuran terkait dengan keywords yang saya masukkan.

hasil pencarian dengan keywords 'borobuduur'

Selanjutnya saya melakukan pencarian dengan keywords ‘borobudur’. Tidak lama kemudian beberapa hasil pencarian muncul di situs ini. Hal yang langsung menjadi pertanyaan saya adalah, “Ada berapa banyak hasil pencarian sih ini? Kok tidak ada keterangannya? Harus dihitung satu per satu kah?”. Situs ini memang belum menampilkan keterangan mengenai banyaknya hasil pencarian yang didapatkan. Padahal hal ini menjadi sesuatu yang harus ada pada suatu sistem pencarian. Hasil pencarian harus mampu menegaskan berapa banyak hasil yang didapatkan dan berapa banyak hasil yang ditampilkan di setiap halaman (Travis, 2009).

Hal lain yang menarik adalah cuplikan dari setiap artikel yang ditampilkan merupakan kalimat-kalimat pertama pada artikel versi lengkapnya. Kalimat-kalimat tersebut kadang tidak berhubungan dengan keywords yang dimasukkan. Akibatnya pengguna sulit untuk memutuskan mana artikel yang sesuai dengan keinginannya dan mana yang tidak sesuai. Akan lebih baik jika yang ditampilkan adalah cuplikan yang berhubungan dengan keywords-nya.

Situs ini juga tidak merubah warna link yang telah dikunjungi. Sehingga ketika dihadapkan pada hasil pencarian yang banyak, akan sulit mengingat mana link yang sudah kita kunjungi dan mana yang belum.

Hasil pencarian yang didapatkan ditampilkan dalam tab-tab sesuai kategori yang dibutuhkan. Rasanya ini cukup memudahkan pengguna untuk memilih artikel yang tepat sesuai kebutuannya.

hasil pencarian dengan keywords 'borobudur'

Berikut ini beberapa perbaikan yang bisa dilakukan untuk situs ini:

1.      Pindahkan search box ke pojok kanan atas situs dan tampilkan keywords yang dicari.

2.      Ganti button lama dengan button baru yang lebih clickable.

3.      Tampilkan banyaknya hasil pencarian yang ditemukan dan hasil pencarian yang ditampilkan di setiap halaman.

4.      Ubah warna link yang telah dikunjungi.

5.      Beri nomor pada setiap hasil pencarian.

6.      Ganti isi cuplikan dengan bagian artikel yang berhubungan dengan keywords dan cetak tebal keywords pada cuplikan.

7.      Geser nomor halaman ke bagian tengah agar lebih setimbang.

8.      Tambahkan keywords anjuran.

Hasil Perbaikan1

Hasil Perbaikan 2

Referensi:

Justin. 2011. 10 Usability Guiedlines for Designing the Search Interface [terhubung berkala]. http://usabilitygeek.com/10-usability-guidelines-for-the-search-interface/ [23 Oktober 2011].

Krug, Steve. 2006. Don’t Make Me Think! A Common Sense Approach to Web Usability, Second Edition. California: New Riders Publishing.

Travis, David. 2009. 20 Search Usability Guidelines [terhubung berkala]. http://www.userfocus.co.uk/resources/searchchecklist.html/ [23 Oktober 2011].

READ MORE - Analisis Antarmuka Pencarian dan Hasil Pencarian (SERP)

Top 10 Mistakes in the Web Design

Sepuluh kesalahan yang sering ditemukan pada situs web adalah sebagai berikut:

a.       Bad search : www.bni.co.id

Pada situs tersebut, hasil pencarian yang didapatkan tidak optimal. Sebagai contoh ketika dilakukan pencarian dengan keywords ‘kurs’, hasil yang ditampilkan tidak ada yang sesuai. Bukannya menampilkan informasi kurs mata uang, yang ditampilkan justru informasi produk BNI yang di dalamnya terkandung kata ‘kurs’. Setelah mengecek di google, ternyata informasi kurs di situs resmi BNI menggunakan judul ‘nilai tukar mata uang asing’. Kemudian saya kembali ke situs BNI dan melakukan pencarian dengan keywords ‘nilai tukar mata uang asing’. Ternyata hasil yang ditampilkan tetap tidak sesuai dengan yang diharapkan.

Kekurangan yang kedua dari situs ini adalah banyaknya hasil pencarian tidak ditampilkan. Akibatnya pengguna tidak bisa mengetahui berapa banyak hasil yang ditemukan dari pencarian yang mereka lakukan. Memang di samping setiap hasil terdapat nomor yang dapat dijadikan acuan untuk melihat banyaknya hasil yang ditemukan. Namun hal ini berlaku hanya jika hasil pencarian yang ditemukan sedikit.

           Kekurangan berikutnya adalah tidak ditampilkannya keywords pencarian dalam hasil sehingga pengguna tidak tahu pencarian apa yang tadi ia lakukan. Pengguna juga akan sulit mengetahui ketika terjadi kesalahan pengetikan keywords karena tidak ditampilkannya keywords tersebut. Ada baiknya judul halaman yang tadinya hanya ‘Hasil Pencarian’ diubah menjadi ‘Hasil Pencarian terhadap Keywords’. Cuplikan dari setiap hasil sebaiknya merupakan bagian yang mengandung keywords. Kemudian dalam cuplikan hasil pencarian, sebaiknya keywords dicetak tebal.

           Kekurangan lainnya adalah tidak ditampilkannya keywords yang disarankan ketika terjadi kesalahan pada pengetikan keywords. Akibatnya pengguna tidak tahu apakah keywords yang ia cari memang tidak ada atau terdapat kesalahan pengetikan pada keywords tersebut.

           Ketika keywords yang dicari tidak ditemukan, situs ini hanya akan menampilkan halaman kosong dengan judul ‘Hasil Pencarian’ di atasnya. Ada baiknya jika diberi pemberitahuan bahwa memang tidak ada hasil pencarian yang sesuai.

Berikut beberapa screenshot dari web tersebut:

hasil pencarian dengan keywords 'kurs'

Hasil Pencarian dengan Keywords 'kusr'

Hasil Pencarian dengan Keywords  'nilai tukar mata uang asing'

 

b.       PDF File for Online Reading : www.bps.go.id

Pada situs resmi BPS ini, artikel-artikel yang panjang akan ditampilkan berupa cuplikannya saja dengan link menuju artikel lengkap di bawah cuplikan tersebut. Artikel lengkap tersebut sayangnya ditampilkan dalam format pdf yang kurang disukai sebagian pengguna. Namun pada situs tersebut telah ditampilkan pemberitahuan bahwa link yang bersangkutan akan membuka halaman bertipe pdf sehingga pengguna bisa ‘mempersiapkan diri’.

Cuplikan Salah Satu Artikel di Situs BPS

c.       Not Changing the Color of Visited Links : www.indonesia.travel

ada situs ini tidak ada perubahan warna pada link yang telah dikunjungi. Akibatnya pengguna sulit mengetahui link mana saja yang telah dikunjungi karena tidak ada tanda yang menunjukkan bahwa sebuah link telah dikunjungi.

Salah Satu Link yang Telah Dikunjungi

Salah Satu Link yang Telah Dikunjungi

d.       Non-scannable Text : www.bps.go.id

Pada situs ini, artikel yang berukuran panjang memang akan ditampilkan cuplikannya saja. Namun cuplikan itu sendiri sudah cukup panjang. Sayangnya pada artikel-artikel ini format font yang digunakan seragam sehingga pengguna akan sulit melakukan scanning pada artikel-artikel tersebut. Ada baiknya jika kata-kata kunci dicetak tebal sehingga pembaca tahu bagian mana yang sebenarnya penting dari artikel tersebut. Jika suatu artikel menampilkan data yang teratur, ada baiknya data tersebut dimasukkan ke dalam sebuah tabel. Tidak ada salahnya juga jika kemudian data tersebut ditampilkan dalam bentuk grafik sehingga pengguna bisa segera menganalisis data tersebut.

Salah Satu Artikel di Situs BPS

 

Secara umum ternyata situs ini menggunakan format font yang seragam. Akibatnya pengguna sulit untuk membedakan mana informasi yang penting dan mana yang kurang penting.

Halaman Beranda Situs BPS

 

e.       Fixed Font Size : depkeu.go.id

Ukuran font yang kecil dan jarak spasi yang begitu rapat menyulitkan pengguna berusia lanjut untuk membaca situs ini. Tapi sayangnya ukuran tersebut tidak bisa diubah.

Halaman Beranda Situs Depkeu

f.       Page Title with Low Search Engine Visibility : megaclick.net

Situs ini menampilkan judul halaman yang sama pada label di setiap tab untuk semua halaman apapun seperti yang tampak pada gambar 10. Hal ini merepotkan ketika beberapa tab dibuka secara bersamaan. Pengguna tidak akan mampu mengenali halaman yang satu dengan halaman yang lain hanya dengan melihat label pada tab. Mereka harus membuka satu per satu tab untuk mencari halaman yang dimaksud.

judul pada tab browser

Selain itu, kekurangan lain dari situs ini adalah tidak adanya judul halaman untuk setiap halaman. Hal ini menyulitkan pengguna untuk mengetahui posisi mereka berada sekarang. Yang mungkin bisa membantu adalah adanya efek ‘tertekan’ pada menu halaman tempat kita berada sekarang.

halaman Site Directory

Halaman Beranda Situs Indonesia Travel 1

 

g.       Anything that Look Like an Advertisement : www.indonesia.travel

Situs ini mempromosikan acara-acara yang tengah diselenggarakan dengan menampilkannya di bagian kanan situs. Awalnya saya kira ini memang space untuk iklan dari sponsor, tapi setelah dilihat lebih teliti dan dibuka salah satu link-nya ternyata bukan. Hal ini sebaiknya diperbaiki karena pengguna seperti saya bisa saja menganggap bahwa bagian itu memang iklan dan melewati informasinya begitu saja.

Halaman Beranda Situs Indonesia Travel 1

Halaman Beranda Situs Indonesia Travel 2

h.       Violating Design Conventions : mamacheesies.com

Situs ini menggunakan background, format font, dan warna yang berbeda untuk setiap halaman yang berbeda. Penggunaan desain yang tidak konsisten ini dapat mengurangi kepercayaan pengguna pada web ini. Ketika berpindah dari satu halaman ke halaman yang lain mereka bisa saja bertanya-tanya. Sebenarnya saya masih ada di situs yang sama atau tidak? Kenapa halaman yang muncul seperti ini? Dan masih banyak lagi. Semakin banyak pertanyaan di pikiran pengguna, semakin banyak pula keraguan yang muncul terhadap sebuah situs web. Jika pengguna ragu pada suatu web, semakin besar kemungkinan web resebut akan ditinggalkan.

Halaman Beranda Situs Mama Cheesies

Halaman Bags Situs Mama Cheesies

Halaman Crocher Situs Mama Cheesies

i.       Opening New Browser Windows : www.shopstyle.com

Situs ini merupakan situs e-commerce di bidang fashion. Ketika saya memilih salah satu produk, sebut saja produk A, maka browser window baru akan dibuka. Browser window yang baru ini akan mengakses situs web asal dari produk A. Misalnya produk A berasal dari butik B, maka browser window baru akan tersambung ke situs web butik B. Hal ini bisa saja menyebabkan saya tidak kembali ke shopstyle karena ada kemungkinan saya tidak sadar bahwa sekarang saya sudah tidak ada di shopstyle melainkan di situs butik B.

Salah Satu Halaman di Situs Shopstyle

Window Baru yang Ditampilkan

 

j.       Not Answering User’s Questions : chachashop.com

Situs ini tidak menyediakan informasi yang jelas bagi para penggunanya. Seperti yang ditampilkan pada gambar 15, produk nomor 1-7 dihargai Rp 100.000 kecuali produk nomor 5. Lalu yang jadi pertanyaan, produk nomor 5 berapa harganya? Sayangnya tidak ada informasi yang menjawab pertanyaan tersebut. Selain itu, situs ini juga tidak menampilkan detail produknya. Untuk produk baju misalnya, situs ini tidak menampilkan informasi bahan baju tersebut, ukuran yang tersedia, dan cara pencucian baju. Padahal informasi tersebut sangat diperlukan pengguna yang memang ingin membeli barang dari situs ini.

Bagian yang Tidak Jelas

READ MORE - Top 10 Mistakes in the Web Design