Download - Pedoman Pengujian Interface
KELOMPOK 9
2011
PEDOMAN PENGUJIANINTERFACE APLIKASI BERBASIS WEB
Muhammad Ishak Nurdhiansyah 0810960056
Heikal Mahendra Rukmana 0810963046
Rully Ayu Dwi 0810963070
Amirul Mukminin 0810963030
Nandra Adhi Yusuf 0810963056
Jack Abdoula Arifeen 0810964002
U N I V E R S I T A S B R A W I J A Y A
DAFTAR ISI
Daftar Isi..............................................................................................................................2
Mukadimah..........................................................................................................................4
Latar Belakang.....................................................................................................................4
Tujuan..................................................................................................................................4
Part I: NAVIGASI...............................................................................................................4
1. MENENTUKAN KONSEP.....................................................................................5
2. LETAK NAVIGASI................................................................................................5
3. KONSISTEN............................................................................................................5
4. SITEMAP DAN LINK PADA SETIAP HALAMAN.............................................5
5. CUSTOMER SUPPORT.........................................................................................5
Part II: IINTERFACE..........................................................................................................6
1. MEMBUAT KEPUTUSAN DESAIN.....................................................................6
2. KEMUDAHAN PENGGUNAAN...........................................................................6
3. TAMPILAN YANG ATRAKTIF............................................................................7
4. ADAPTABILITAS..................................................................................................8
5. FORGIVENESS.......................................................................................................8
5.1 PESAN KESALAHAN......................................................................................8
Part III: LAYOUT................................................................................................................9
1. MENU.....................................................................................................................9
1.1 PERILAKU MENU.......................................................................................................9
1.2 PEMBERIAN JUDUL MENU....................................................................................10
1.3 PENGGUNAAN SIMBOL DALAM MENU.............................................................10
1.4 PENGELOMPOKAN ITEM DALAM MENU...........................................................10
1.5 HIERARCHICAL MENU (SUBMENU)....................................................................10
2. TEKS....................................................................................................................11
2.1 MENYISIPKAN SPASI ANTARA KALIMAT.........................................................11
2.2 KAPITALISASI LABEL ELEMEN INTERFACE DAN TEKS................................11
3. ICON.....................................................................................................................11
3.1 GENRE DAN KELUARGA ICON.............................................................................11
3.2 ICON TOOLBAR........................................................................................................12
3.3 POINTER.....................................................................................................................12
4. BUTTON..............................................................................................................12
2
4.1 PUSH BUTTON..........................................................................................................12
4.2 PELABELAN PUSH BUTTON..................................................................................12
4.3 BUTTON ICON...........................................................................................................12
4.4 PENGGUNAAN BUTTON ICON..............................................................................13
4.5 ISI BUTTON ICON DAN PELABELAN...................................................................13
5. WARNA...............................................................................................................13
Part IV : PERFORMANCE...............................................................................................13
1. KINERJA..............................................................................................................13
2. KEAMANAN.......................................................................................................14
2.1 OTENTIKASI..............................................................................................................14
2.2 KENDALI APLIKASI.................................................................................................14
2.3 KETERSEDIAAN DAN KERAHASIAAN DATA...................................................14
3. INTEROPERABILITAS......................................................................................14
4. CHANGE RESOLUTION....................................................................................14
5. PENGOLAHAN DATA.......................................................................................14
6. ADVERTISING....................................................................................................15
Part V: CONTENT............................................................................................................15
1. TATA LETAK......................................................................................................15
1.1 KOLOM PENCARIAN...............................................................................................15
1.2 KOLOM OTENTIKASI..............................................................................................15
2. LINK.....................................................................................................................15
2.1 PERUBAHAN WARNA PADA LINK.......................................................................15
2.2 LINK YANG TIDAK BERJALAN.............................................................................15
2.3 TERLALU BANYAK LINK.......................................................................................16
TABEL PENGUJIAN.................................................................................................16
3
Mukadimah
1. LATAR BELAKANG
Desain antarmuka (interface), khususnya pada aplikasi basis web, merupakan hal krusial
yang perlu menjadi salah satu perhatian utama bagi para pengembang aplikasi web dan
desainer web. Antarmuka merupakan hal penting yang menentukan eksistensi suatu aplikasi.
Seiring dengan perkembangan dunia teknologi yang semakin pesat, terlebih dalam industri
software yang semakin giat menawarkan pilihan software, tentu saja diperlukan pengetahuan
khusus untuk memilih software mana yang layak untuk digunakan, selain dari segi manfaat
perlu adanya pertimbangan dari segi yang lain, khususnya dalam segi penampilan alias
desain antar muka yang telah disebutkan di awal paragraf. Dengan mengetahui kenyataan
tersebut, maka pengguna jelas membutuhkan sebuah dasar yang terangkum dalam sebuah
pedoman pengujian interface aplikasi berbasis web.
2. TUJUAN
Sebagai sebuah pedoman untuk menguji kelayakan desain interface dalam aplikasi berbasis
web.
Part I – Navigasi
Navigasi adalah petunjuk posisi dan arah perjalanan. Di dalam dunia web, navigasi dianggap
penting agar user yang sedang berada di dalam halaman tertentu tidak tersesat dan mudah
menemukan halaman-halaman lain dalam website.
Biasanya, pada sebuah website, navigasi tertampil pada menu dan link yang terstruktur.
Seringkali, saat kita membuka sebuah website, kita merasa kesal karena tidak mendapatkan
halaman website yang dicari dikarenakan navigasi yang tidak jelas.
Beberapa hal yang perlu diperhatikan dalam pembuatan suatu navigasi yang baik :
4
1. MENENTUKAN KONSEP
Sebuah web yang akan di bangun harus memiliki konsep, yaitu garis besar navigasi dari
sebuah website yang akan dibuat. Konsep tersebut memuat navigasi dasar yang sering kami
sebut bentuk "tree view" (bercabang dan beranting). Artinya konten bersifat general/umum
atau konten bersifat hingga mendetail.
2. LETAK NAVIGASI
Pada halaman utama, kita sebut index memuat menu-menu pokok yang bersifat umum. Ada
baiknya buat shortcut-shortcut atau quicklinks sehingga pengunjung bisa langsung masuk ke
halaman yang dimaksud. Menu-menu yang sering dijadikan shortcut misalnya, welcome note,
products, news/article, gallery, livechat, links, contact. Shortcut-shortcut yang dibuat pun
tergantung pada jenis website apakah company profile atau product cataloque, dll. Biasanya
shortcut dibuat untuk menonjolkan suatu produk atau konten tertentu. Mengikuti "tree view"
yang sudah di jelaskan di atas, maka percabangan dari menu-menu utama diletakkan pada
halaman-halaman cabang dari index.
3. KONSISTEN
Letak menu pada setiap halaman sebuah website sebisa mungkin tidak berubah sehingga
pengunjung tidak kebingungan mencari-cari menu pada halaman yang berbeda. Misalnya
pada halaman index, menu utama berada diatas, pada halaman cabang, dapat di tampilkan
menu utama diatas pula setelah itu pada halaman-halaman cabang yang terdapat sub-menu
bisa di tampilkan di sebelah kiri atau kanan halaman. Atau bisa menampilkan drop down/pull
down menu, hal ini dilakukan pada setiap halaman dari index sampai pada halaman cabang
dan ranting.
4. SITEMAP DAN LINK PADA SETIAP HALAMAN
Pastikan pada setiap halaman website Anda memiliki link antar halaman, antar menu terutama
link ke halaman index. Ini akan memudahkan dan mempersingkat pencarian halaman-
halaman oleh pengunjung jika website Anda dibangun dalam struktur menu dan submenu
yang kompleks.
5. CUSTOMER SUPPORT
Tentunya Anda membangun sebuah website agar informasi atau produk Anda lebih dikenal
orang, bahkan Anda berharap dapat menjaring si pengunjung untuk terus berkunjung ke
5
website Anda dan membeli produk Anda. Maka ada baiknya di website tersebut, tinggalkan
alamat, email dan no. kontak Anda agar mereka bisa menghubungi Anda secara langsung atau
melalui surat elektronik, Anda juga bisa melakukan feedback terhadap mereka, karena
informasi tentang mereka telah Anda dapatkan saat mereka melakukan submit di halaman
Contact Us.
Part II – Interface
1. MEMBUAT KEPUTUSAN DESAIN
Ketika membuat keputusan desain mengenai fitur dalam aplikasi Anda, penting untuk
mempertimbangkan biaya, tidak semua yang keuangan, dengan manfaat potensial.
Setiap kali Anda menambahkan fitur untuk aplikasi anda, hal-hal berikut dapat terjadi:
Aplikasi Anda akan lebih besar.
Aplikasi Anda akan lebih lambat.
Aplikasi Anda antarmuka manusia itu menjadi lebih kompleks.
Anda menghabiskan waktu untuk mengembangkan fitur baru daripada
menyempurnakan fitur yang ada.
Dokumentasi aplikasi Anda dan membantu menjadi lebih luas.
Anda menjalankan risiko memperkenalkan perubahan yang buruk dapat
mempengaruhi fitur yang ada.
Anda meningkatkan waktu yang diperlukan untuk memvalidasi perilaku aplikasi
Anda.
Bagian berikut ini beberapa faktor tambahan mempertimbangkan sebelum menambahkan
fitur untuk produk Anda.
Hindari Fitur Cascade
Terapkan Solusi 80 Persen
2. KEMUDAHAN PENGGUNAAN
Berikut ini beberapa panduan yang perlu diingat saat merancang untuk kemudahan
pengguna:
6
Dalam desain antarmuka, gunakan kiasan-kiasan yang jelas dan mudah diterapkan atau
dimengerti oleh pengguna.
Fokus pada solusi, bukan hanya fitur. Hindari menambahkna fitur yang kurang
bermanfaat bagi pengguna.
Tetapkan pengaturan default untuk program Anda, hindari proses konfigurasi yang
panjang. Akan tetapi tambahkan pilihan pengaturan / preferensi sesuai keinginan
pengguna.
Bundle aplikasi Anda, menyederhanakan proses instalasi dan memudahkan dalam
distribusi.
Plug and Play, memudahkan device / perangkat keras yang digunakan dalam aplikasi
Anda tanpa harus melakukan penginstallan device driver.
Berikan pesan kesalahan yang berguna bagi pengguna ketika terjadi sesuatu yang tidak
wajar/bermasalah. Pesan kesalahan tersebut harus berisi informasi teantang apa yang
terjadi, mengapa hal itu terjadi, dan menawarkan solusi jika tersedia dan melakukan
pencegahan hilangnya data pengguna.
Ijinkan pengguna menjelajahi fitur Anda tanpa harus takut melakukan kerusakan
permanen pada data, gunakan fasilitas undo-redo untuk mengembalikan data.
Berikan pengaturan tentang bahasa yang digunakan, menambahkan kenyamanan
pengguna apabila program tersebut menggunakan bahasa asli pengguna.
3. TAMPILAN YANG ATRAKTIF
Desain yang stylish dan penampilan yang menarik merupakan salah satu nilai lebih dari
sebuah sistem perangkat lunak. Biasanya, aplikasi ini memiliki resolusi tinggi yang
mencakup warna 32-bit serta dapat melakukan transparansi, tujuan terpentingnya adalah
untuk menyampaikan informasi yan relevan kepada pengguna.
Berikut ini adalah beebrapa panduan yang diingat ketika merancang tampilan perangkat
lunak:
Kemas desain antarmuka Anda dengan tampilan yang profesional, gunakan grafis yang
tinggi serta icon-icon yang menarik.
Gunakan elemen-elemen antarmuka seperti control, menu dan dialog.
Gunakan warna dengan resolusi 32-bit untuk memberikan kinerja yang terbaik.
7
Buat teks dan gambar menggunakan API modern seperti Quartz, Kakao, ATSUI dan
OpenGL. Hindari penggunaan penggambaran legacy API seperti QuickDraw.
4. ADAPTABILITAS
Kesesuaian interface dengan kultur budaya atau kebiasaan pengguna. Berpengaruh dalam
kemudahan pengguna dalam menyesuaikan diri dengan aplikasi sesuai dengan kultur yang
berlaku di daerah pengguna..
5. FORGIVENESS
Orang perlu merasa bahwa mereka dapat mencoba hal-hal tanpa merusak sistem atau
membahayakan data mereka. Gunakan perintah aman, seperti Undo dan Revert untuk
perintah penyimpanan, sehingga orang akan merasa nyaman dalam belajar dan
menggunakan produk Anda.
Peringatkan pengguna ketika mereka akan memulai tugas yang akan menyebabkan
hilangnya data permanen (tidak dapat dikembalikan lagi). Jika peringatan sering muncul, hal
itu dimungkinkan karena produk tersebut memiliki beberapa kelemahan dalam desain.
Ketika pilihan disajikan secara jelas dan umpan balik tepat waktu, menggunakan aplikasi
harus relatif bebas kesalahan.
Antisipasi terjadinya masalah umum dan peringatkan pengguna terhadap potensi efek
samping. Memberikan umpan balik yang luas dan komunikasi di setiap tahap sehingga
pengguna merasa bahwa mereka memiliki informasi yang cukup untuk membuat pilihan
yang tepat.
1.1. PESAN KESALAHAN
Pesan kesalahan untuk pengguna sangat membantu jika ada data yang salah dimasukkan
atau tidak lengkap. Ini memudahkan pengguna jika ingin mencoba semua fitur yang ada
di aplikasi tanpa takut terjadi kesalahan pada data atau aplikasi ketika kita salah
mengklik atau memasukkan data sehingga mereka bisa merasa aman untuk mencoba
fitur yang ada tanpa membahayakan data atau aplikasi dan akan segera menyadari jika
terjadi kesalahan.
8
Part III – Layout
1. MENU
Menu menampilkan daftar dari item-perintah, atribut, atau status dimana pengguna dapat
memilihnya sendiri. Menu berdasarkan prinsip dari interface dan terdapat poin-poin.
Pengguna tidak perlu mengingat perintah atau opsi yang disediakan karena mereka dapat
melihat setiap saat. Kata yang terdapat pada menu harus mampu memberikan petunjuk yang
jelas dan singkat. Nama menu mewakili isi konten. Gunakan istilah-istilah yang umum,
singkat, dan mudah dipahami. Misal: Home, About Us, Services, Products, News, Articles,
Contact Us. Selain itu Menu harus dibuat menonjol atau eye-catching agar mudah dikenali.
Hal ini harus digabungkan dengan unsur estetika sehingga menu-menu tadi dapat sejalan
dengan konsep web yang dibuat.
1.1. PERILAKU MENU
Ketika orang menggunakan menu, mereka biasanya membuat pilihan dalam data
mereka dan kemudian memilih item menu. Perilaku ini mengikuti paradigma melihat-
dan-titik, mengidentifikasi apa yang harus dilakukan dan kemudian menetapkan
tindakan dengan memilih item menu. Untuk memilih salah satu item dalam menu, posisi
pointer pengguna pada judul menu dan menyeret ke item yang diinginkan. Setiap item
disorot karena dipilih. Tidak ada tindakan yang terjadi sampai user melepaskan tombol
mouse dengan pointer di atas sebuah item menu. Orang dapat memindahkan pointer dari
menu, sebelum melepaskan tombol mouse tanpa melakukan tindakan apapun. Mereka
bisa terbuka dan memindai menu untuk mengetahui fitur apa saja yang tersedia tanpa
harus benar-benar melakukan tindakan.
Sebagai aturan umum, hindari menciptakan menu yang panjang. menu yang panjang
sulit bagi user untuk memindai dan mengerti. Jika Anda menemukan bahwa ada terlalu
banyak item dalam menu tunggal, cobalah untuk mengelompokkannya, Anda mungkin
menemukan bahwa beberapa item lebih cocok dalam menu lain.
Penempatan menu yang disediakan untuk pengguna seharusnya berada diatas sebuah
aplikasi web. Hal ini dilakukan agar pengguna mengetahui dengan mudah menu-menu
9
yang disediakan oleh developer. Karena penempatan yang berada diatas akan langsung
terlihat oleh pengguna ketika mereka membuka aplikasi web.
1.2. PEMBERIAN JUDUL MENU
Judul menu dan submenu yang tepat harus mewakili item dalam menu. Hindari
menggunakan ikon untuk judul menu. Buat judul menu sesingkat mungkin tanpa
kehilangan maknanya.
1.3. PENGGUNAAN SIMBOL DALAM MENU
Ada beberapa simbol standart yang dapat kita gunakan untuk menunjukkan informasi
tambahan dalam menu yang mewakili perintah pada aplikasi web.
Toggled Menu Items
Sebuah perubahan item menu toggle antara dua state setiap kali pengguna memilih. Ada
tiga jenis item menu toggle:
1. Satu set dua menu state yang berlawanan
2. Satu menu item changes untuk mencerminkan kondisi saat ini
3. Sebuah item menu yang memiliki tanda cek di sebelahnya ketika berlaku
1.4. PENGELOMPOKAN ITEM DALAM MENU
Logika pengelompokan item menu adalah aspek yang paling penting untuk mengatur
menu anda. Pengelompokan item dalam menu, membuatnya lebih mudah dan cepat
untuk menemukan perintah dari tugas-tugas yang terkait.
Secara umum, tempat item yang paling sering digunakan berada di bagian atas menu,
tapi membuat grup item yang terkait lebih baik daripada mengatur mereka dengan
frekuensi penggunaan. Sebagai contoh, Find Next atau Find Again perintah ini dapat
jarang digunakan, dan harus tampil dibawah perintah Find. Dalam sebuah menu yang
berisi tindakan dan atribut, jangan sekali-kali memasukkan action dan atribute di grup
yang sama.
1.5. HIERARCHICAL MENU (SUBMENU)
Kamu dapat menggunakan hierarchical menu untuk menawarkan pilihan menu item
tambahan tanpa menyita lebih banyak ruang di menu bar. Ketika poin pengguna ke item
dengan indikator submenu, muncul submenu. Submenu memiliki semua ffitur menu,
termasuk cara pintas keyboard, status markers(seperti checkmarks), dan seterusnya.
10
Karena submenu menambah kompleksitas antarmuka dan secara fisik lebih sulit untuk
digunakan, Anda harus menggunakan hanya ketika anda memiliki menu lebih besar dari
ukuran di menu bar atau untuk perintah yang berhubungan erat. Gunakan hanya satu
tingkat submenu. Jika submenu berisi lebih dari lima item, pertimbangkan untuk
memberikan menu sendiri.
2. TEKS
Teks lazim digunakan pada seluruh interface sebagai nama pada tombol, label menu pop-up,
pesan pada kotak dialog, dan bantuan yang muncul pada layar. Komponen yang paling
penting dari desain interface adalah menggunakan teks secara konsisten. Pada Tim
pengembang produk yang anda buat, anda harus memasukkan penulis ahli yang bertanggung
jawab untuk mengkaji teks yang terlihat oleh pengguna pada layar serta dokumentasi
instruksional.
1.1. MENYISIPKAN SPASI ANTARA KALIMAT
Jika terdapat bagian pada aplikasi user interface anda yang menampilkan dua atau
lebih kalimat dalam paragraf, pastikan untuk menyisipkan satu spasi antara tanda baca
akhir dengan kata pertama pada kalimat selanjutnya.
1.2. KAPITALISASI LABEL ELEMEN INTERFACE DAN TEKS
Semua label elemen interface harus dikapitalisasi baik gaya atau gaya kalimat judul.
Judul gaya berarti Anda membesarkan setiap kata, kecuali:
1. Artikel (a, an, the)
2. Koordinasi konjungsi (and, or)
3. Preposisi dari empat atau kurang huruf, kecuali jika preposisi merupakan bagian
dari frase kata kerja, seperti dalam " Starting Up the Computer. "
3. ICON
1.1. GENRE DAN KELUARGA ICON
Genre Icon membantu mengkomunikasikan apa yang pengguna dapat lakukan dengan
aplikasi sebelum mereka menjalankannya. Dengan mempunyai gambat icon yang sesuai
dengan perintah yang akan dilakukan.
11
1.2. ICON TOOLBAR
Ikon Toolbar merupakan perintah yang sering digunakan dalam aplikasi. Biasanya, ikon
toolbar tidak begitu kaya akan detail dan photo-realism seperti ikon jenis lain, karena
mereka dimaksudkan untuk menjadi kecil, efisien representasi objek spesifik aplikasi
dan tugas.
1.3. POINTER
Pointer standar dirancang untuk memberikan umpan balik kepada pengguna. Untuk
mempertahankan pengalaman pengguna yang konsisten, penting bahwa Anda
menggunakannya hanya untuk tujuan mereka. Setiap pointer memiliki hot spot bagian
dari pointer yang harus diposisikan di atas objek layar sebelum klik mouse memiliki
efek pada objek. Hot spot harus intuitif, seperti ujung sebuah penunjuk panah atau titik
tengah crosshair. Layar objek memiliki zona-panas yang pointer hot spot itu harus
berada dalam rangka untuk klik agar berpengaruh.
4. BUTTON
Tombol merupakan suatu perintah yang harus terlaksana. Jika tombol memulai proses yang
tak tentu, maka tombol harus nonaktif / redup sampai proses selesai, dan suatu umpan balik
status harus disediakan.
1.1. PUSH BUTTON
Sebuah tombol push melakukan tindakan sesaat, seperti menyimpan dokumen,
menyelesaikan operasi dapat didefinisikan oleh sebuah dialog, atau sebuah pesan
kesalahan.
1.2.PELABELAN PUSH BUTTON
Sebuah tombol push selalu berisi teks, tidak mengandung gambar. Jika Anda perlu
menampilkan ikon atau lainnya gambar pada tombol, gunakan tombol bevel. Label pada
tombol push harus menjadi frase verba atau kata kerja yang menggambarkan tindakan.
Label tombol push harus memiliki kapitalisasi judul-gaya
1.3.BUTTON ICON
Sebuah tombol ikon berperilaku seperti tombol bevel, tetapi tidak memiliki tepi kotak
yang terlihat di sekitarnya. Dengan kata lain, seluruh tombol diklik, bukan hanya ikon.
12
Contohnya icon copy, menunujukkan dengan jelas bahwa perintah copy adalah untuk
menyalin teks ataupun dokumen digambarkan dengan 2 dokumen yang sama.
1.4.PENGGUNAAN BUTTON ICON
Jika Anda ingin menggunakan tombol ikon pada toolbar , hindari mencampurnya
dengan gayasegi empat atau gaya kapsul toolbar kontrol. Ikon tombol tidak boleh
digunakan di panel bawah.
1.5.ISI BUTTON ICON DAN PELABELAN
Ikon tombol terdiri ikon-ikon, di samping itu, mereka dapat menampilkan label teks
yang pengguna dapat memilih untuk melihat. Ikon tombol juga dapat berisi panah ke
bawah menunjuk tunggal, yang menunjukkan adanya menu pop-up.
5. WARNA
Jika Aplikasi web anda bekerja dengan banyak warna , anda mungkin akan memerlukan
cara bagi pengguna untuk memasukkan informasi warna. Dengan menyediakan standar
warna pada aplikasi web anda.
Part IV – Performance
1. KINERJA
Hal yang perlu diperhatikan adalah :
Gunakan metrik untuk mengidentifikasi masalah kinerja.
Hindari menunggu sampai akhir siklus pengembangan, untuk melakukan tuning
kinerja.
Gunakan API modern, gunakan teknologi dan informasi design untuk performa terbaik.
Pilih teknologi yang sesuai untuk tugas yang dihadapi.
Gunakan Threads untuk meningkatkan respon kode Anda.
Menghilangkan I/O operasi yang tidak perlu.
Hindari loading sumber daya hingga benar-benar dibutuhkan oleh perangkat lunak anda.
13
2. KEAMANAN
1.1. OTENTIKASI
Untuk aplikasi yang membutuhkan atau mengandung informasi yang bersifat privasi
dan tidak sama antar pengguna harus disertakan kolom otentikasi yang membutuhkan
username dan password.
1.2. KENDALI APLIKASI
Pembatasan akses layanan aplikasi oleh vendor sehingga ada pengaturan hak akses
untuk aplikasi tersebut dan bisa dipantau aktivitas apa saja yang ada didalamnya.
1.3. KETERSEDIAAN DAN KERAHASIAAN DATA
Data yang mungkin akan dibutuhkan oleh user sebaiknya dilindungi untuk semua
informasi baik berupa data, program dan segala hal yang dianggap penting agar tidak
dihapus atau dirubah orang lain yang tidak berhak
3. INTEROPERABILITAS
Kemampuan aplikasi dalam berinteraksi atau berintegrasi dengan berbagai macam aplikasi.
Jika kemampuan integrasi makin tinggi, maka makin nyaman digunakan oleh berbagai
pengguna yang menggunakan bermacam-macam platform.
4. CHANGE RESOLUTION
Dengan banyaknya computer yang memiliki resolusi yang berbeda-beda maka web
yang baik adalah web yang memiliki suatu menu untuk merubah sebuah resolusi web seperti
halnya menu zoom. Atau web tersebut memiliki suatu bentuk web yang tetap atau konsisten
pada resolusi yang dimiliki, jadi website tidak terpengaruh oleh resolusi oleh setiap
computer yang dimiliki.
5. PENGOLAHAN DATA
Web site yang baik memiliki suatu data mengenai pengujung yang datang untuk
mengakses web tersebut. dengan pengelolahan data yang baik maka pengunjung akan
merasa lebih gampang untuk mengakses web tersebut, semisal penyediaan fasilitas member.
Maka web tersebut harus dapat menyimpan atau mengelola data member tersebut sebaik-
baiknya. Dengan demikian jika member web tersebut ingin mengakses web menggunakan
fasilitas member, mereka tidak kesulitan untuk mendaftar ulang untuk mengakses web
tersebut.
14
6. ADVERTISING
Pengelolahan advertising dapa suatu web sangatlah penting, dikarenakan jika suatu web
memiliki banyak advertising yang terdapat pada web tersebut dan di munculkan bersamaan,
akan mengakibatkan semakin lama pengunjung menunggu (loading) untuk dapat
menggunakan fasilitas yang disediakan web tersebut.
Part V – Content
1. TATA LETAK
Dalam menyusun logo, materi, icon, dan navigasi sebaiknya diperhatikan pengaturan tata
letaknya agar terjadi keselarasan sehingga memudahkan pengguna dalam menggunakan
aplikasi tersebut.
1.1. KOLOM PENCARIAN
Kolom ini dapat disediakan untuk memudahkan pengguna dalam menemukan konten
yang dibutuhkan. Dapat ditempatkan di bagian kanan atas layout.
1.2. KOLOM OTENTIKASI
Dapat ditempatkan di samping atau tepat dibawah kolom pencarian sehingga
memudahkan pengguna
2. LINK
1.1. PERUBAHAN WARNA PADA LINK
Umumnya, web browser kurang baik dalam mendukung navigasi pengguna, tetapi
mereka menyediakan satu fitur penting dalam navigasi. Mereka mengijinkan
pengembang untuk mengubah warna di tiap halaman saat pengguna telah
mengunjunginya. Saat ini 74% web menggunakan pendekatan desain yang seperti ini,
sehingga hal ini menjadi konvensi umum yang diharapkan pengguna.
1.2. LINK YANG TIDAK BERJALAN
15
Link pada sebuah web merupakan faktor kunci dalam proses navigasi. Pengguna bisa
berhenti menggunakan link yang terbukti tidak berhasil dikunjungi sebelumnya.
Sebaliknya, mereka mungkin kembali mengunjungi link yang telah membantu mereka
sebelumnya.
1.3. TERLALU BANYAK LINK
Jumlah link yang ditampilkan dalam sebuah halaman biasanya ditentukan oleh
kompleksitas dari web itu sendiri. Riset terhadap menu menunjukkan bahwa jumlah link
yang berada pada suatu halaman dapat ditentukan dari pengelompokkan elemennya.
Jika tidak ada pengelompokkan elemen batas link yang diijinkan adalah 4-8 link.
Sedangkan jika terdapat pengelompokkan elemen link diperbolehkan hingga 18-24
buah. Tetapi, sebagian ahli dalam web desain menyarankan hanya 8-12 link saja.
Jumlah link yang terlalu sedikit juga meningkatkan kemungkinan terlihat seperti
pengumuman. Ini tidak diperlukan untuk menyebutkan semua fitur dari sebuah web
dalam semua halaman. Untuk mengurangi jumlah link batasi agar hanya menampilkan
content web yang paling penting atau fitur-fitur yang berguna saja.
Tabel Pengujian
Testing Checklist
Parameter Ketersediaan SkorYa/Ada Tidak 1 2 3 4 5
Navigasi
Hierarchy arsitektur Informasi
Penempatan Navigasi yang baik
Konsisten dalam peletakan
Icon link
Interface
16
Kemudahan Penggunaan
Kemampuan menarik minat pengguna
Kesesuaian dengan budaya daerah pengguna
Kemampuan analisis kesalahan pengguna
Kemampuan koreksi kesalahan pengguna
Layout
Menu
Mudah dibaca oleh pengguna
Ketepatan pemberian judul
Penggunaan symbol
Pengelompokan item
Penggunaan submenu
Teks
Pemilihan font
Kesesuaian font dengan isi
Ketepatan penggunaan huruf kapital
Icon
Kesesuaian ikon dengan genre
Kesesuaian ikon dengan maksud kinerja
Button
Perilaku button
17
Kesesuaian button dengan kinerjanya
Pewarnaan
Harmonisasi warna yang digunakan
Performance
Kinerja
Penggunaan teknologi sesuai kebutuhan
Kecepatan respon
Kecepatan loading sumber daya
Keamanan
Otentikasi
Pemantauan hak akses aplikasi
Kerahasiaan data
Ketersediaan data
Kompatiblitas pada browser
o Firefox
o IE
o Opera
o Chrome
Change Resolusi
Penataan advertising
Content
18
Tata letak
Link
o Perubahan warna Link
o Semua Link berjalan
19