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