Tugas Akhir IMK : Evaluasi Website Jasakom (Bag. 3)

Lanjutan dari

Tugas Akhir IMK : Evaluasi Website Jasakom (Bag. 1)

Tugas Akhir IMK : Evaluasi Website Jasakom (Bag. 2)

Membahas tentang text & writing, link, & graphic layout serta kesimpulan dan saran.

Text & Writing

Perbedaan kata

Pada navigasi kategori “Penerbitan buku”, terdapat subkategori “Buku Komputer JS” dan “Buku Umum JS”. Pengunjung yang baru di website ini akan bingung apa arti “JS”, mungkin pengunjung akan berpikir JS itu Javascript atau kepanjangan lainnya. Jika JS itu kependekan dari Jasakom, pengunjung mungkin bertanya mengapa berbeda dengan subkategori di bawahnya, yaitu “Profil Penulis Jasakom”, “Menjadi Penulis Jasakom”, dan “eBook Gratis Jasakom”, di mana di sini Jasakom ditulis “Jasakom” bukan “JS”
Solusi : istilah – istilah di dalam komunitas lebih baik dikurangi agar tidak membuat bingung pengunjung baru. Selain itu, penulisan juga harus konsisten. Pada kasus ini, penulisan “Jasakom” harus konsisten apakah ditulis “JS” atau “Jasakom”.

Gambar 13 Navigasi penerbitan buku

Saya juga menemukan perbedaan kata pada saat hasil pencarian tidak ada, dapat dilihat di gambar 10. Di bagian atas text field dituliskan Key word(s) tapi di bagian pesan ditulis “Sorry – no matches. Please try some differents term” bukan “Sorry – no matches. Please try some differents key word(s)”. Jika tedapat banyak masalah seperti ini maka solusinya adalah dengan membuat kamus istilah yang digunakan lalu menempatkan seseorang untuk memeriksa text di dalam website lalu mencocokannya dengan kamus istilah yang dibuat. Agar di dalam website tidak ada dua kata/istilah tapi memiliki satu arti.

Horizontal scroll bar

Penggunaan Horizontal scroll bar akan menyulitkan user dalam membaca. Pada kategori “Community” lalu subkategori “hacking” (http://www.jasakom.com/index.php?categoryid=9&p2_articleid=111) saya menemukan artikel yang memiliki panjang berlebihan sehingga membuat pengunjung untuk menggunakan horizontal scroll bar.

Gambar 14 Horizontal scroll

Solusi : Lebar website harus dibuat fixed agar tidak menjadi semakin lebar ketika text yang dimasukan sangat panjang. Selain itu, ketika sebuah artikel akan dipublikasikan, lebih baik diperiksa terlebih dahulu sehingga sesuai dengan lebar website. Mungkin ada beberapa halaman yang mengalami hal serupa, sehingga perlu dicek kembali.

Penulisan yang tidak rapi

Terdapat penulisan yang tidak rapi di website Jasakom, diantaranya :

• Di bagian registrasi (sudah dibahas sebelumnya dengan subjudul “Penempatan label yang jauh”)
• Di bagian lupa password (gambar 8), ruang untuk label “Masukan kode yang anda lihat diatas (case sensitive)” terlalu sempit sehingga label terdiri dari 4 baris. Hal ini bisa diatasi dengan mempersingkat kalimat label. Keterangan case sensitive dapat diletakan di kanan atau di bawah text field

Perbedaan jenis font

Pada website Jasakom di subkategori “Cracking”, saya melihat adanya ketidaksamaan font. Terdapat artikel yang memiliki jenis font Times New Roman, dan ada juga artikel yang memiliki typeface Arial.
Solusi : Jenis font yang digunakan, mencakup font style, type size, dan lain – lain diseragamkan agar website konsisten.

Gambar 15 Perbedaan jenis font

Kesalahan ketik judul halaman “Lupa password”

Pada halaman “Lupa Password” terdapat judul halaman “Registrasi”.
Solusi : Judul halaman diganti menjadi “Lupa password”, “Reset password”, atau lainnya yang lebih sesuai.

Gambar 16 Salah ketik judul halaman “Lupa password”

Kesalahan ketik email

Pada bagian registrasi (gambar 6), terdapat kesalahan ketik pada label “Masukkan Emal sekali lagi”.
Solusi : Kalimat tersebut diubah menjadi “Masukkan Email sekali lagi :” agar sesuai dengan label sebelumnya, yaitu “Email : “. Kesalahan ketik seperti ini dapat diperbaiki dengan melakukan review / cek ulang ketika website akan dibuat online.

Link

Link terdiri dari dua baris

Ketka sebuah link terdiri lebih dari satu kata, link tersebut mungkin akan menjadi dua baris atau lebih. Link seperti itu akan membuat ambigu dan kebingungan. Pada website Jasakom ada link yang terdiri dari dua baris, yaitu pada bagian “Penerbitan Buku” (gambar 8). Kategori “Penerbitan Buku” terdiri dari dua baris dan subkategori “Menjadi Penulis Jasakom” juga terdiri dari dua baris. Kesan yang terasa di sini adalah tidak rapi.
Saya juga menemukan link “Baca selengkapnya..” pada suatu artikel terdiri dari dua baris.

Gambar 17 Link baca selengkapnya terdiri dari 2 baris

Solusi : Buat link tersebut agar tidak menjadi dua baris. Bisa dengan cara melebarkan area link atau mempersingkat text pada link tersebut. Untuk link “Baca selengkapnya …” bisa dengan selalu membuat baris baru (sebagai tempat link itu) di bawah deskripsi artikel agar tidak terpotong.

Button yang terlihat sudah ditekan

Pada umumnya bentuk button itu menonjol/emboss sehingga terlihat bisa ditekan. Pada website Jasakom tombol / button, seperti Register, Login, Reset, Search dan lain – lain terlihat seperti sudah tertekan. Selain itu warna tombolnya juga terlihat seperti tidak bisa ditekan (inactive), karena memiliki warna yang pucat.
Solusi :

• Tombol / button diperbaikin bentuknya agar sama dengan button pada umumnya
• Warna tombol dibuat tidak pucat, agar terlihat dapat ditekan.

Click here link

Menurut Jeff Johnson, ketika ia melihat “click here” link di sebuah website profesional, dia menganggapnya sebagai kesalahan. Menurutnya, link seperti itu terlalu informal dan amatir pengembang web yang profesional. Alasan lainnya adalah link seperti itu tidak informatif, pengunjung harus membaca kalimat sebelumnya untuk tahu ke mana link itu menuju. Pada website Jasakom, saya menemukan link seperti itu, tepatnya di subkategori “Prosedur Beli Buku”. Di sana dituliskan “Untuk biaya pengiriman, silahkan klik di sini” (gambar 5).
Solusi : link¬ sejenis ini dapat diganti dengan kata yang lebih penting atau lebih deskriptif. Pada kasus di atas maka kalimat ” Untuk biaya pengiriman, silahkan klik di sini” dapat diganti menjadi “Biaya pengiriman”.

Visited link

Web browser menyimpan halaman mana saja yang sudah dikunjungi dan ditampilkan di link yang bersangkutan dengan warna yang berbeda dengan link yang belum dikunjungi. Ini dapat membuat user melihat apakah sebuah link sudah dia kunjungi atau belum. Ketika link tidak menunjukan apakah sebuah halaman sudah dikunjungi atau belum, maka website tersebut buruk dalam navigasi karena bisa saja user mengunjungi halaman yang ternyata sudah mereka kunjungi. Pada website Jasakom, hal ini diurus dengan sangat baik. Link yang belum dikunjungi berwarna orange sedangkan link yang sudah dikunjungi berwarna abu-abu.

Gambar 18 Visited links

Grapic & layout

Form login ada di bagian bawah

Pada website Jasakom letak form login ada di kiri bawah. User diharuskan scroll ke bawah dahulu sebelum dapat melakukan login. Hal ini mungkin karena fitur login ini jarang digunakan. Tapi jika di perkembangan selanjutnya fungsi login lebih banyak digunakan maka sebaiknya diletakan di bagian atas agar user tidak perlu melakukan scroll ke bawah.

Pesan error pada saat login

Pada bagian sebelumnya dijelaskan letak form login, ternyata ini berpengaruh pada saat login lalu terjadi error. Pesan error yang muncul ternyata ada di bagian atas label nama, sehingga user harus melakukan scroll ke bawah untuk melihat pesan error yang ada dan melakukan login kembali. Pesan error yang ditampilkan tidak terlalu mencolok. Sebaiknya pesan error ditampilkan mencolok agar user menyadari kesalahannya.

Gambar 19 Pesan error saat login

Pesan error pada saat lupa password

Pada halaman “Lupa password ?”, ditanyakan alamat e-mail untuk mengirimkan password yang telah di-reset. Jika e-mail salah (tidak ada di dalam database) maka akan muncul pesan error “Upsss… permintaan Anda tidak bisa dilakukan. [alamat e-mail yang dimasukan]

Gambar 20 Pesan error pada saat lupa password

Pesan error tersebut bisa membingungkan user. Kenapa permintaan mengganti password tidak bisa dilakukan. Mungkin ketika user membaca e-mailnya dengan teliti, dia akan tersadar bahwa alamat e-mailnya salah. Tapi jika dia hanya melakukan scan, berpikir bahwa yang ditulis itu sudah benar (padahal ada kesalahan, misal 1 huruf terganti), maka hal ini akan membuat user bingung.
Solusi : Gunakan pesan error yang lebih jelas, misalnya “E-mail yang anda masukan tidak ada di dalam database”, “E-mail anda belum terdaftar”, “email@email.com belum terdaftar”atau lainnya.

Pesan error pada saat registrasi

Jika pada saat login bentuk pesan error berbentuk text di halaman itu sendiri. Maka pada saat registrasi, bentuk error ditampilkan dengan javascript. Ketika saya mencoba untuk mengosongkan semua field maka didapat pesan error sebanyak tiga buah pesan error di mana setiap pesan error harus ditekan ok untuk keluar.

Gambar 21 Pesan error javascript ketika registrasi

Ketika semua field diisi mengacu pada semua pesan error (yang menggunakan javascript), maka data akan diproses. Jika ditemui kesalahan, seperti alamt e-mail yang tidak sah, kode konfirmasi yang salah, atau yang lainnya maka akan muncul pesan error (bukan javascrip) di bawah label “Please enter your name, password, and email for registration”. Pesan ini tidak mencolok sehingga bisa saja terlewat oleh user. Penggunaan metode menggunakan javascript ini ada baik dan buruknya. Sisi baiknya adalah user tidak perlu membuka halaman baru terlebih dahulu ketika data input yang dia masukan salah, sehingga menghemat bandwidth. Salah satu sisi buruknya adalah harus menekan “OK” beberapa kali ketika ada beberapa data yang dimasukan salah.
Solusi :

• Jika ada error yang lebih dari satu, lebih baik dimasukan dalam 1 pesan error, sehingga tidak perlu muncul satu per satu.
• Warna pesan error pada gambar 12 dibuat lebih mencolok, misalnya berwarna merah.

Gambar 22 Pesan error ketika registrasi

Resolusi layar

Menurut buku “Prioritizing Web Usability”, statistik saat ini menunjukan kebanyakan komputer memiliki resolusi 800 x 600 piksel atau 1024 x 768 piksel. Resolusi minimum saat ini adalah 800 x 600 pikse. Di masa yang akan datang resolusi 1024 x 768 piksel akan menjadi resolusi yang paling kecil. Jika lebar dari halaman web melebihi resolusi komputer pengguna, maka pengunjung harus menekan horizontal scroll bar untuk melihat seluruh website. Ini bisa membuat pengunjung tidak nyaman.
Di bawah ini adalah website Jasakom dengan resolusi 1024 x 768 .

Gambar 23 Website Jasakom dengan resolusi 1024 x 768 piksel

Pada website Jasakom, sebenarnya ukuran website sudah mengikuti resolusi layar, bahkan ukuran lebar header website Jasakom ikut menyesuaikan dengan resolusi layar. Dapat dilihat pada gambar di bawah ini :

Gambar 24 website Jasakom dengan resolusi 800 x 600 piksel

Terlihat di bagian berita, yang tadinya 3 baris di resolusi 1024 x 768 piksel menjadi 4 baris di resolusi 800 x 600. Hal ini dikarenakan ukuran website Jasakom sudah dinamis sesuai dengan resolusi layar. Sehingga kalimat yang ditampilkan disesuaikan dengan ukuran resolusi, terlihat lebar artikel tidak melebihi ukuran resolusi.Jadi, konten di website Jasakom sudah menyesuaikan diri dengan ukuran resolusi monitor. Yang membuat website ini harus menggunakan horizontal scroll ketika dalam resolusi 800 x 600 piksel adalah gambar di sisi kiri dan sisi kanan. Hal ini patut disayangkan.
Tapi ada beberapa kekurangan yang saya dapatkan ketika website berada dalam resolusi 800 x 600. Ketika kursor berada di kategori “Penerbitan Buku”, maka subkategori-subkategori menu ini menghalangi kategori”Penerbitan Buku” dan “Search”

Gambar 25 Menu menghalangi

Solusi : seandainya gambar tiang di sisi kiri & kanan dihilangkan tampaknya website Jasakom akan dapat dinikmati di resolusi 1024 x 768 piksel maupun di resolusi 800 x 600 piksel. Jadi, sebaiknya gambar di sisi kiri dan kanan dihilangkan.

Perbedaan browser

Ketika saya mencoba di web browser Internet Explorer, logo Jasakom di kiri atas memiliki warna yang berbeda. Saya tidak tahu penyebabnya, mungkin karena kesalahan css. Tapi sebaiknya antara web browser diusahakan tidak ada perubahan.

Gambar 26 Logo Jasakom di IE

Kesimpulan

Dalam mengembangkan website kita harus memperhitungkan faktor – faktor IMK (Interaksi Manusia dan Komputer). Pengembang website diwajibkan mengetahui prinsip – prinsip dalam IMK agar website yang dikembangkannya dapat menarik banyak pengunjung dan membuat pengunjung merasa nyaman di website tersebut. Dengan semakin banyak pengunjung yang merasa nyaman maka dapat meningkatkan usaha di dalam website tersebut. Contohnya iklan di website, semakin banyak iklan tentu semakin baik bagi pemilik website, tapi apa jadinya jika ternyata website yang dia miliki tidak membuat pengunjung nyaman sehingga mudah ditinggalkan. Dengan semakin banyaknya pengunjung maka pihak yang tertarik memasang iklan di website semakin besar.
Pada website Jasakom, sudah terdapat hal – hal yang sesuai tapi masih banyak terdapat kekurangan – kekurangan. Kekurangan yang paling terasa fatal ada navigasi, di mana tidak ada keterangan current page akan membuat pengunjung tersesat yang bisa berakibat fatal. Kesalahan – kesalahan kecil seperti salah ketik, font yang berbeda, tulisan yang tidak rapi, dan lain – lain harus lebih diperhatikan untuk menunjukan bahwa website ini website profesional.
Di masa yang akan mendatang mudah -mudahan terdapat fitur e-commerce untuk membeli buku terbitan Jasakom, tanpa harus membaca prosedur yang berbelit – belit. Dan peran member ditingkatkan bukan hanya dapat mengirim artikel dan memberi komentar.

Saran

Artikel ini mudah – mudahan bisa menjadi bahan evaluasi website Jasakom. Artikel ini masih memiliki kekurangan, diantaranya tidak mengevaluasi forum Jasakom, ada beberapa bagian di website Jasakom yang mungkin terlewat untuk dievaluasi dan tidak menganalisis bagaimana usaha website Jasakom di bidang SEO (Search Engine Optimization) untuk memudahkan pengunjung mencari website Jasakom di search engine.