Navigasi ini jarang dipergunakan untuk menu utama, biasanya

advertisement
MODUL PERKULIAHAN
Interactive
Broadcasting
Layout dan Metode Navigasi Web
Fakultas
Program Studi
Ilmu Komunikasi
Broadcasting
TatapMuka
13
Kode MK
DisusunOleh
41040
Bagus Rizki Novagyatna
Abstract
Kompetensi
Pembahasan
Layout dan Metode Navigasi Web
Navigasi Web adalah bagian dari situs Web yang berguna untuk memandu pengunjung
menjelajahi isi situs dan menghantarkan pengunjung pada isi yang mereka cari. Pada artikel
sebelumnya, telah dibahas mengenai tip dasar bagaimana menampilkan sebuah navigasi situs
Web. Pada artikel ini, kita akan mengenal navigasi Web berdasarkan tata-letak dan metode
penampilan navigasi tersebut.
Posisi Navigasi
Posisi sebuah navigasi ternyata turut menentukan sukses atau tidaknya sebuah navigasi. Pada
posisi yang tepat, sebuah navigasi dapat membuat pengunjung lebih mudah menelusuri situs
Web.
1. Top Navigation (Navigasi di atas)
Navigasi ini cocok diterapkan pada situs-situs portal dengan banyaknya menu atau
fasilitas yang ditawarkan. Navigasi ini cukup menghemat tempat dibandingkan
dengan navigasi pada bagian lain. Umumnya (pada situs portal), navigasi ini hanya
menggunakan teks tanpa icon atau image. Dikarenakan menghemat tempat, kolom kiri
atau kanan situs dapat digunakan untuk banner.
2. Left Navigation (Navigasi di kiri)
Bila menu situs Anda tidak begitu banyak, navigasi di sebelah kiri lebih cocok
dipergunakan. Navigasi pada posisi ini menawarkan banyak kreasi-kreasi yang
berlainan, Anda dapat menggunakan Icon atau animasi agar lebih “eye-catching”.
Pengunjung akan mudah terbiasa dengan tampilan menu di bagian kiri, karena mereka
sudah terbiasa dengan tampilan menu disebelah kiri pada OS mereka.
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
3. Right Navigation (Navigasi di kanan)
Navigasi ini jarang dipergunakan untuk menu utama, biasanya bagian kanan lebih
sering dipergunakan untuk menampilkan fitur-fitur dari menu utama.
4. Free Navigation (Navigasi bebas)
Navigasi ini dapat terletak pada bagian-bagian lain dari sebuah situs, navigasi ini
sering dipergunakan pada situs-situs dengan menggunakan animasi Flash. Saran saya
dalam menampilkan navigasi ini, beri penekanan pada pengunjung bahwa bagian
tersebut adalah navigasi misalnya dengan menggunakan movie yang berada disekitar
navigasi, Anda dapat menggunakan cara lain, yang terpenting tonjolkan navigasi
tersebut.
Metode Tampilan Navigasi
Navigasi dapat ditampilkan dalam berbaga media yaitu teks, image, atau animasi. Masingmasing memiliki kekurangan dan kelebihan.
1. Teks
Menampilkan menu dalam teks bisa jadi kurang menarik perhatian pengunjung bila
Anda tidak meramu-nya dengan baik. Beri “tanda” lebih bahwa teks itu adalah
navigasi misalnya dengan sedikit memperbesar huruf dari pada teks yang
dipergunakan, menambahkan garis, atau warna pada latarnya. Kelebihan dari metode
ini adalah waktu downloading yang cepat, jadi sangat cocok diterapkan pada situs
yang memiliki banyak menu.
2. Image
Menampilkan menu dalam image menawarkan banyak sekali variasi, misalnya dengan
icon dan penggunaan huruf dan bentuk yang lebih bebas. Sebaiknya, navigasi
menggunakan images ini menggunakan warna yang tidak kompleks, makin sedikit
warna ukuran file akan semakin sedikit.
3. Animasi
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
Navigasi ini memang terlihat sangat menarik dengan berbagai interaktifitas visual
yang ditawarkan. Bila Anda menggunakan Flash, tes terlebih dahulu waktu download
dari menu tersebut. Jangan sampai pengunjung menunggu lama untuk dapat melihat
menu. Pada browser yang tidak terdapat plugin Flash, navigasi ini tentu saja tidak
akan tampil. Beri alternatif bagi pengunjung yang menggunakan browser yang tidak
terinstall flash player
Merancang Navigasi Website
Navigasi pada sebuah website yang tertampil pada menu dan links adalah petunjuk bagi
pengunjung terhadap halaman - halaman yang terdapat dalam website. Pengunjung akan
semakin mudah menemukan halaman - halaman dalam website Anda jika menu - menu dan
link yang ada tampil secara terstruktur. Sudah pasti pengunjung akan kesal apabila tidak
mendapatkan halaman website yang ia cari gara - gara navigasi yang ruwet.
1. Rencanakan dengan Baik
Hal yang mutlak dilakukan sebelum mulai membuat sebuah web tentunya adalah
pembuatan konsep dari website itu sendiri. Konsep tersebut akan memuat navigasi
dasar dalam bentuk “tree view” (bercabang dan beranting) dari mulai konten yang
bersifat umum hingga konten yang bersifat mendetail. Inilah garis besar navigasi dari
situs yang akan dibuat.
2. Dimana Navigasi diletakkan
Seperti telah dikemukakan di atas, bahwa navigasi akan membawa pengunjung dari
hal - hal yang bersifat umum hingga hal - hal yang bersifat mendetail. Halaman utama
(index) tentu saja akan memuat menu - menu pokok yang bersifat umum.
Percabangan dari menu - menu inti tersebut dapat di letakkan pada halaman - halaman
cabang dari index. Alternatif lain, Anda dapat menggunakan javascript untuk
menampilkan menu dan sub-menu sekaligus.
3. Konsisten
Sebisa mungkin jangan merubah letak menu pada setiap halaman web sehingga
pengunjung lebih mudah menemukan menu - menu tersebut. Misalnya menu utama
berada di atas, setelah itu pada halaman - halaman yang terdapat dalam menu utama
dapat ditampilkan sub-menu di sebelah kiri atau kanan halaman.
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
4. Spotty!
Buatlah menu dengan menonjol sehingga pengunjung mudah mengenalinya. Hal ini
tentu saja harus di gabungkan dengan unsur estetika sehingga menu - menu tersebut
dapat sejalan dengan konsep desain web yang dibuat.
5. Singkat & Deskriptif
Kata - kata yang terdapat dalam menu harus mampu memberikan petunjuk yang jelas
dan singkat tentang halaman website di bawah menu tersebut. Gunakan istilah - istilah
yang lazim, singkat, dan mudah dipahami.
6. Berikan Petunjuk pada Pengunjung
Akan lebih baik jika pada halaman website memuat strukur singkat halaman web yang
sedang di tampilkan. Misal : Tentang Kami >> Visi & Misi >>
7. Berikan Link ke Halaman Utama
Jangan lupa untuk memberikan link ke halaman utama atau link ke halaman dalam
“parent topic”. Ini akan memudahkan pengunjung jika situs Anda di bangun dalam
struktur menu dan submenu yang cukup kompleks.
8. Sitemap
Buatlah sitemap yang linknya berada di setiap halaman web. Ini akan semakin
memudahkan dan mempersingkat proses pencarian halaman - halaman website oleh
pengunjung. Jika pengujung merasa nyaman dalam mengunjungi website Anda, maka
akan semakin baik pula content website dapat diterima oleh pengunjung.
Navigasi Website
Sebuah situs pasti memiliki suatu navigasi yang diibaratkan sebagai
sebuah petunjuk jalan atau peta, memberikan pilihan kepada pengunjung
bagian mana yang akan ia kunjungi. Pembangunan sebuah navigasi tidak
dapat dianggap remeh karena pengunjung akan merasa kesal dan bingung
bila sebuah situs memiliki navigasi yang kurang baik dan “menyesatkan”.
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
Navigasi Web adalah bagian dari situs Web yang berguna untuk memandu
pengunjung menjelajahi isi situs dan menghantarkan pengunjung pada isi
yang mereka cari.
Langkah – langkah dalam membuat dan menampilkan suatu
navigasi situs website adalah :
Ø Perencanaan
Hal pertama yang harus dilakukan sebelum membuat navigasi
sebuah situs website adalah membuat konsepnya. Dalam membuat konsep
tersebut, dilakukan dengan membuat alur navigasi dalam bentuk tampilan
pohon (tree-view), digambarkan mulai dari yang umum kemudian
bercabang menjadi yang lebih khusus dan mendetil. Dan dapat pula
dilakukan dengan menentukan bagian paling atas atau root dari alur menu.
Ø Topik utama pada navigasi
Dari gambaran tersebut kita tentunya sudah mendapatkan menu
atau topik mana sajakah yang akan ditampilkan dalam navigasi. Tentunya,
bagian paling ataslah dari tampilan pohon (dalam sketsa) yang
dicantumkan dalam navigasi. Menu teratas itulah yang berguna sebagai
gambaran umum dari menu atau bagian lain situs yang bersifat khusus.
Ø Konsisten
Dalam meletakan sebuah navigasi navigasi, simpanlah navigasi
pada tempat yang sama untuk setiap halaman. Dalam desainnya pun
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
sebaiknya tidak berubah. Hal ini bertujuan agar pengunjung tidak bingung
mencari navigasi.
Ø Berbeda
Buatlah tampilan sebuah Navigasi terlihat berbeda dari tampilan
lainnya. Hal ini bertujuan agar pengunjung lebih mudah mengenali bahwa
bagian tersebut adalah navigasi. Agar lebih “eye cathing” pergunakan
icon-icon sederhana yang menggambarkan setiap menu.
Ø Singkat Tepat dan Jelas
Gunakan kata-kata yang tepat dengan singkat dan jelas, gunakan
istilah-istilah
yang
lazim
dipergunakan
atau
mudah
dimengerti
pengunjung.
Ø Tunjukan dimana pengunjung
Setelah pengunjung mengklik salah satu menu, beri tanda bahwa
ia sedang berada pada bagian itu. Dapat dengan memberi tanda pada menu
navgasi, atau dengan meletakan titel atau judul dari halaman tersebut.
Ø Jangan lupa “Home”
Jangan lupa untuk meletakan “Home” atau “Back” pada
halaman selain halaman utama atau homepage.
Buatlah pengunjung nyaman dengan navigasi yang dibuat,
karena navigasi yang baik, akan mempermudah pengunjung mencari apa
yang ia inginkan.
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
Posisi Navigasi
Posisi sebuah navigasi ternyata turut menentukan sukses atau
tidaknya sebuah navigasi. Pada posisi yang tepat, sebuah navigasi dapat
membuat pengunjung lebih mudah menelusuri situs Web.
ü Top Navigation (Navigasi di atas)
Navigasi ini cocok diterapkan pada situs-situs portal dengan
banyaknya menu atau fasilitas yang ditawarkan. Navigasi ini cukup
menghemat tempat dibandingkan dengan navigasi pada bagian lain.
Umumnya (pada situs portal), navigasi ini hanya menggunakan teks tanpa
icon atau image. Dikarenakan menghemat tempat, kolom kiri atau kanan
situs dapat digunakan untuk banner.
ü Left Navigation (Navigasi di kiri)
Bila menu situs yang telah dibuat tidak begitu banyak, navigasi
di sebelah kiri lebih cocok dipergunakan. Navigasi pada posisi ini
menawarkan banyak kreasi-kreasi yang berlainan, kita dapat menggunakan
Icon atau animasi agar lebih “eye-catching”. Pengunjung akan mudah
terbiasa dengan tampilan menu di bagian kiri, karena mereka sudah
terbiasa dengan tampilan menu disebelah kiri pada OS mereka.
ü Right Navigation (Navigasi di kanan)
Navigasi ini jarang dipergunakan untuk menu utama, biasanya
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
bagian kanan lebih sering dipergunakan untuk menampilkan fitur-fitur dari
menu utama.
ü Free Navigation (Navigasi bebas)
Navigasi ini dapat terletak pada bagian-bagian lain dari sebuah
situs, navigasi ini sering dipergunakan pada situs-situs dengan
menggunakan animasi Flash. Dalam menampilkan navigasi ini, beri
penekanan pada pengunjung bahwa bagian tersebut adalah navigasi
misalnya dengan menggunakan movie yang berada disekitar navigasi, kita
dapat menggunakan cara lain, yang terpenting tonjolkan navigasi tersebut.
Metode Tampilan Navigasi
Navigasi dapat ditampilkan dalam berbaga media yaitu teks,
image, atau animasi. Masing-masing memiliki kekurangan dan kelebihan.
o Teks
Menampilkan menu dalam teks bisa jadi kurang menarik
perhatian pengunjung bila kita tidak meramu-nya dengan baik. Beri
“tanda” lebih bahwa teks itu adalah navigasi misalnya dengan sedikit
memperbesar huruf dari pada teks yang dipergunakan, menambahkan
garis, atau warna pada latarnya. Kelebihan dari metode ini adalah waktu
downloading yang cepat, jadi sangat cocok diterapkan pada situs yang
memiliki banyak menu.
o Image
Menampilkan menu dalam image menawarkan banyak sekali
variasi, misalnya dengan icon dan penggunaan huruf dan bentuk yang
lebih bebas. Sebaiknya, navigasi menggunakan images ini menggunakan
warna yang tidak kompleks, makin sedikit warna ukuran file akan semakin
sedikit.
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
o Animasi
Navigasi ini memang terlihat sangat menarik dengan berbagai
interaktifitas visual yang ditawarkan. Bila kita menggunakan Flash, tes
terlebih dahulu waktu download dari menu tersebut. Jangan sampai
pengunjung menunggu lama untuk dapat melihat menu. Pada browser
yang tidak terdapat plugin Flash, navigasi ini tentu saja tidak akan tampil.
Beri alternatif bagi pengunjung yang menggunakan browser yang tidak
terinstall flash player.
2016
Interactive Broadcasting
Bagus Rizki Novagyatna, S.Ikom
PusatBahan Ajar dan eLearning
http://www.mercubuana.ac.id
Download