Senin, 24 Oktober 2011

Analisis Search Usability Pada Situs BPS

Sekarang saya akan menuliskan hasil analisis mengenai search availability pada fungsi search dan SERP (Search Engine Result Pages) dari situs BPS. Situs ini dapat diakses melalui www.bps.go.id. Analisis yang saya lakukan kali ini merujuk pada search availability yang terdapat pada http://www.userfocus.co.uk/resources/searchchecklist.html.
SERP di situs BPS ini masih kurang baik, karena ada beberapa kekurangan. Antara lain :
  • SERP tidak menunjukkan keyword apa yang kita gunakan sebelumnya dan kotak search yang ada pun menjadi kosong. Hasil pencarian kurang jelas karena keyword yang cocok di hasil tidak diberi tanda (blok warna). Sistem tidak memberikan saran untuk memperbaiki keyword pencarian, apabila ada kesalahan ketik, maka akan langsung tidak ada hasil.
  • SERP tidak mencantumkan berapa hasil pasti pencariannya. Misalnya, SERP akan menunjukkan ada 10 halaman, tapi setelah kita klik halaman ke-10, SERP akan menunjukkan ada 23 halaman hasil. Dan jumlah hasil yang ditampilkan tiap halamannya tidak bisa diubah oleh user. Lalu ukuran huruf antara judul artikel dan isi artikel sama besar, sehingga mempersulit pencarian artikel yang diinginkan.
  • Apabila kita mengklik tombol cari tanpa ada keyword, maka search engine akan mencantumkan seluruh artikel yang ada di situs BPS tersebut. Dan bila tidak ada hasil yang ditemukan SERP tidak menjelaskan hal tersebut, melainkan hanya menunjukkan kategori-kategori tanpa pilihan artikel di dalamnya.
  • Situs BPS tidak menyediakan fasilitas bantuan untuk menggunakan search enginenya secara efektif, dan tidak menyediakan pilihan search interface yang lebih mendalam, serta tidak bisa menyimpan hasil pencarian yang lebih mendalam tersebut.
  • Kotak pencarian yang disediakan situs BPS tergolong kecil. Batasan pencarian sudah jelas di SERP namun user tidak bisa menentukan kategori atau batasannya sendiri.
Dengan adanya poin-poin kesalahan hasil dari analisis, maka saya dapat memberikan saran perbaikan desain SERP sebagai berikut :
Gambar 1
Keterangan gambar 1 : disediakan drop-down box untuk memilih kategori pencarian (kata kategori kurang terlihat karena ruang yang kurang), kotak keyword lebih panjang, keyword sebelumnya ditulis di kalimat hasil pencarian, keyword sebelumnya dipertahankan, keyword yang sesuai diberi blok warna, diberikan link menuju ke penelusuran yang memiliki pilihan atau filter yang lebih spesifik. Link yang sudah pernah dikunjungi berwarna ungu.

Gambar 2

Keterangan gambar 2 : ketika terjadi kesalahan penulisan keyword, sistem akan memberikan saran untuk keyword yang lebih baik, dan langsung melakukan pencarian dengan keyword yang lebih baik itu. Link yang sudah pernah dikunjungi berwarna ungu.

Gambar 3
Keterangan gambar 3 : menunjukkan hasil pasti berapa jumlah halaman yang ditemukan.

Gambar 4
Keterangan gambar 4 : memberikan link menuju halaman bantuan bagaimana melakukan pencarian yang baik di situs ini.

Gambar 5
Keterangan gambar 5 : Apabila tidak ditemukan hasil apapun dari pencarian yang dilakukan.

Gambar 6

Keterangan gambar 6 : Judul artikel sebaiknya lebih besar dari isi artikel yang ditampilkan. Sehingga memudahkan user untuk mencari artikel yang tepat.

Sekian saran perbaikan untuk SERP pada situs BPS. Semoga dengan saran yang saya kemukakan maka penggunaan fungsi search tersebut akan menjadi lebih maksimal dan efisien.

Minggu, 23 Oktober 2011

Review 10 Kesalahan Dalam Desain Web

Kali ini dalam memenuhi bagian ujian dari mata kuliah Interaksi Manusia & Komputer, saya akan meninjau beberapa situs yang saya anggap memiliki kesalahan dalam desain webnya. Dasar yang saya gunakan pada peninjauan desain web adalah artikel Top 10 Mistakes in Web Design (http://www.useit.com/alertbox/9605.html).

Bad search
Salah satu situs yang memiliki pencarian yang buruk adalah situs DPR Indonesia, yang dapat diakses melalui www.dpr.go.id. Search engine yang ada di situs ini menurut saya kurang baik, karena tidak memberikan saran keyword yang tepat pada saat kita melakukan pencarian. Misal, disini saya melakukan pencarian dengan keyword “komisi 8”.
Halaman pertama dari hasil pencarian tidak ada yang tepat dengan apa yang diinginkan. Kita tidak diberi saran bahwa mungkin keyword yang kita inginkan adalah “komisi VIII”. Sehingga akan sulit bagi user untuk menentukan apa keyword yang dibutuhkan untuk mencari informasi yang dibutuhkannya, dalam hal ini komisi VIII.

Pdf files for online reading
Contoh situs yang menggunakan file pdf langsung untuk dibaca user antara lain adalah www.pdf-world.net. Situs ini memiliki fitur quick view pdf untuk membaca file pdf yang sudah dipilih. Tetapi file pdf yang pada dasarnya tidak cocok dengan ukuran dari browser, sehingga ukurannya jadi lebih kecil. Gambar di bawah adalah contoh penggunaan quick view di pdf-world.
Seperti yang dapat kita lihat pada gambar di atas, file pdf yang akan dilihat diberikan tempat tersendiri yang membuatnya semakin kecil. Meskipun telah disediakan tombol zoom in dan zoom out, navigasi untuk membaca file tersebut tetap sulit dilakukan.

Not changing the color of visited links
Hal lain yang dapat membantu kita dalam browsing di internet adalah perubahan warna pada link yang telah kita kunjungi sebelumnya. Meski begitu, ada beberapa situs yang tidak menyediakan fungsi tersebut. Misalnya adalah situs www.bps.go.id.
Gambar di atas adalah contoh hasil pencarian dari situs BPS. Apabila salah satu link hasil pencarian di-klik, maka akan terbuka di tab baru browser. Namun bila kita lihat kembali ke tab hasil cari BPS, link yang kita klik tadi tidak berubah warna. Link tersebut memang ada persegi dari sisa klik yang kita lakukan sebelumnya, namun bila kita klik di tempat lain di halaman itu, persegi tersebut akan hilang dan tidak ada yang membedakan antara link yang sudah kita kunjungi dengan yang lainnya.

Non-scannable text
Salah satu situs yang saya kunjungi dan memenuhi kriteria non-scannable text adalah http://evav4ever.wordpress.com/2008/05/29/website-maluku-tenggara-terburuk-seindonesia/. Kenapa? Coba kita lihat gambarnya terlebih dahulu.
Meskipun ini hanyalah sebuah postingan di blog, namun postingan tersebut tetap perlu di-edit dan dibuat sedemikian rupa sehingga bukan hanya teks tanpa ada penekanan dengan bold, italic, maupun underline. Seperti yang Jakob Nielsen bilang “Write for online, not print”.

Fixed font size
Berkat adanya CSS style, maka kebanyakan situs sudah menggunakan ukuran huruf/teks yang tetap. Hal tersebut dapat merugikan pengguna yang sudah berusia lebih dari 40 tahun. Karena hanya sedikit situs yang memberikan fungsi memilih ukuran teks, maka solusinya bisa dengan menggunakan fitur zoom dan memilih ukuran teks dari aplikasi browser. Salah satunya adalah dengan Internet Explorer yang dapat memilih ukuran teks dari menu view-nya. Disini saya contohkan dengan halaman dari : http://sport.id.msn.com/football/okezone/article.aspx?cp-documentid=5433931.
Contoh halaman dengan pilihan text size “Largest” :
Contoh halaman dengan pilihan text size “Smallest” :
Dapat dilihat bahwa keduanya menghasilkan ukuran teks yang berbeda, namun dengan tingkat zoom yang sama yaitu 100%. Kebanyakan browser lainnya hanya memiliki fitur zoom, yang memang memiliki kesamaan dengan memilih ukuran teks. Yaitu, bila kita zoom in, maka teks akan bisa terlihat lebih besar. Walaupun di Internet Explorer ada fitur text size, tetap ada fitur zoom yang gunanya memperbesar halaman yang dilihat, bukan hanya teks.

Page titles with low search engine visibility
Pernah membuka banyak tab lalu ditinggal ke kamar kecil, dan saat kita kembali kita lupa apa saja yang telah kita buka. Sedangkan seluruh head di tab browser memiliki nama yang sama. Misal seperti di bawah ini?
Ya, itulah yang kadang terjadi pada beberapa situs yang title tiap pagenya sama. Biasanya hal ini terjadi pada situs-situs yang menyediakan hosting untuk file dokumen, video, musik, dll. Contohnya saya coba di www.megavideo.com. Mereka membuat title tiap page sama dengan mengharapkan rendahnya search visibility, atau dengan kata lain, sulit ditemukan menggunakan search engine. Sehingga file yang diunggah oleh member mereka lebih terlindungi.

Anything that looks like an advertisement
Berikut ini adalah contoh dari banner berita di www.bps.go.id yang lebih terlihat seperti iklan.
Setiap banner di gambar di atas memiliki animasi yang seperti fungsi transisi. Namun hal itu justru membuat mereka terlihat seperti iklan dan user akan kurang memperhatikan banner-banner tersebut. Karena kebanyakan user sudah mengembangkan mental model bahwa hal-hal yang berkedip, bertransisi, dan juga pada posisi-posisi tertentu adalah iklan dan mereka akan menghindari atau tidak memerhatikannya.

Violating design conventions
Melanggar mungkin bukan kata yang tepat untuk situs yang satu ini, melainkan tidak mempedulikan seluruh konvensi desain website yang ada. Situs ini dapat diakses melalui http://www.ingenfeld.de/. Berikut tampilan dari situs tersebut.
Pertama ini adalah tampilan apabila browser kita zoom out hingga maksimal. Hal ini berarti bahwa tampilan website yang nampaknya sudah berantakan itu hanya sebagian kecil dari yang ia buat.
Sedangkan, gambar diatas adalah seluruh tampilan utama yang ada di situs ini. Kita bisa lihat betapa berantakannya isi situs ini. Semua dikeluarkan di halaman awal, bertumpuk-tumpuk, betapa banyaknya scroll kebawah dan kesamping yang ada, serta pewarnaan yang begitu banyak dan kontras. Semua alasan itu menyebabkan user sulit untuk menentukan mana yang bisa dan harus diakses terlebih dahulu.
Apabila pertanyaan utama dari suatu situs yang melanggar konvensi akan membuat user tidak tertarik untuk melanjutkan tujuannya karena sulit untuk digunakan, maka situs ini bahkan akan menghilangkan niat user dalam menggunkannya, karena tidak jelasnya tujuan dari situs ini. Saat kita menggerakkan pointer ke seluruh bagian situs, terlihat pointer berbentuk penunjuk link untuk sebagian besar area. Dan setelah saya coba menerjemahkan title dari situs ini, saya dapatkan artinya adalah motor yang dijual. Namun di situs ini tidak terlihat unsur-unsur jual-beli atau melihat katalog motor atau mobil. Situs ini diperparah dengan adanya animasi yang menggangu dan tidak jelas tujuannya.

Opening new browser windows
Hal yang kadang menggangu kita saat berinternet adalah terbukanya window baru browser tanpa kita sadari. Mungkin saat kita mengklik suatu link lalu kita langsung mengklik tempat lain lagi di halaman tersebut, lalu kita menunggu dan bertanya-tanya apa sebenarnya yang terjadi saat kita mengklik pertama kali. Ternyata ada window baru yang terbuka namun langsung tertutupi lagi, karena kita mengklik yang kedua kali. Apalagi karena fitur pada windows7 yang melakukan grouping, sehingga kita makin sulit untuk menyadari ada window baru. Contohnya seperti gambar di bawah.
Inilah bagian tampilan dari halaman memasukkan balasan di www.kaskus.us. Saat kita ingin melihat seluruh pilihan smiley yang disediakan, maka kita harus klik [more], namun kadang kita langsung melanjutkan mengetik pesan. Yang terjadi adalah window smiley yang terbuka akhirnya tertutupi window penulisan pesan yang lebih besar, sehingga kurang efektif dalam penggunaanya.

Not answering users’ questions
Hal ini biasanya lebih ke e-commerce, lebih spesifik lagi adalah saat kita tidak mendapat apa yang kita ingin tahu pada saat kita membuka halaman tersebut. Melainkan kita harus menghubungi sang penjual terlebih dahulu, sedangkan kita kadang merasa tidak nyaman bila menghubungi tapi lalu batal. Ini salah satu contohnya.
Dapat kita lihat bahwa ia menjual smartphonenya. Namun ia tidak mencantumkan harganya. Kita harus bertanya dahulu ke penjual. Misal, kita mengirimi pesan melalui forum tersebut atau kita langsung menghubungi penjual dari kontak yang diberikannya.
Mungkin muncul pertanyaan, “Apa masalahnya dengan harus bertanya dahulu? Rasanya tidak masalah”. Tapi apakah semua orang akan berpikiran seperti itu? Tidak. Dengan harus bertanya berarti kita harus menunggu. Sedangkan user tidak mau menunggu, mungkin user akan mencari thread atau tempat lain yang menjual barang yang sama. Maka hal ini dapat merugikan kedua belah pihak. Maka diperlukan suatu peraturan standar jual-beli, yang kira-kira berisi: penjual harus mencantumkan harga, spesifikasi barang, foto barang, dll.

Demikianlah hasil peninjauan dari beberapa situs yang saya temukan. Semoga apa yang saya tulis akan cukup untuk memenuhi kebutuhan penilaian ujian dan berguna bagi para pembaca yang lain.