Page 295 - SK tingkatan 5

Reka Bentuk Antara Muka
Setelah halaman dalam laman web distrukturkan, fasa seterusnya adalah untuk menentukan
bagaimana pengguna laman web dapat mencapai maklumat tersebut. Reka bentuk antara muka
menentukan bagaimana struktur laman web secara logikalnya digambarkan termasuk teknik navigasi
yang memandu kepada pergerakan pengguna dalam laman web. Pereka bentuk antara muka biasanya
akan menggunakan diagram atau carta alir bagi menggambarkan reka bentuknya. Rajah biasanya
akan menunjukkan bagaimana setiap halaman web berfungsi. Salah satu rajah yang digunakan dalam
proses reka bentuk antara muka ialah wireframe atau rangka wayar (seperti yang ditunjukkan dalam
Rajah 3.3.19). Rangka wayar atau juga dikenali sebagai skema halaman atau pelan halaman ialah
panduan visual yang mewakili rangka kerja keseluruhan laman web. Tujuan rangka wayar dibuat ialah
untuk menyusun elemen-elemen yang akan dimasukkan dalam laman web bagi menepati konsep
laman web tersebut.

Contoh Rangka Wayar
goo.gl/z4EUaA

Rajah 3.3.19 Contoh wireframe
Reka bentuk Navigasi
Sekiranya anda mengunjungi kompleks beli-belah, biasanya anda akan menggunakan sistem papan
tanda untuk mencari lokasi kedai yang ingin dikunjungi. Begitulah juga konsep yang perlu diterapkan
dalam laman web. Bagi membantu pelawat mengetahui kedudukan mereka atau untuk mencapai
maklumat yang diingini, penggunaan logo, label, pautan atau pintasan lain yang membentuk sistem
navigasi digunakan.
Navigasi web merujuk proses objek-objek dalam laman web yang terdiri daripada teks, rajah,
audio dan video dihubungkan antara satu sama lain dengan menggunakan pautan hiperteks atau
hipermedia. Konsep navigasi web ini memberikan pengalaman kepada pelawat laman web untuk
mengemudi laman web tersebut mengikut kecekapan masing-masing. Navigasi web yang bagus
seharusnya memberikan petunjuk kepada pelawat laman web tentang kedudukan atau lokasi semasa
pengguna.

BAB 3 Pengaturcaraan Berasaskan Web 287