LAYOUT NAVIGASI WEB Layout adalah proses penataan dan

LAYOUT & NAVIGASI WEB

• Layout adalah proses penataan dan pengaturan teks atau grafik pada halaman web. • Layout meliputi penyusunan, pembagian tempat dalam satu halaman, pengaturan jarak spasi, pengelompokan teks dan grafik, Penekanan pada bagian tertentu

Layout yang Baik : • Mencapai Tujuan • Pemetaan Visual • Menarik Perhatian

Mencapai Tujuan • Apakah Tujuan yang akan di sampaikan sebuah halaman web? • Informasi apakah yang akan disampaikan? • Siapa yang akan membaca , menggunakan dan mengunjungi web tersebut? • Dimanakah letak halaman web tersebut terhadap halaman lain

Pemetaan Visual • Pertimbangkan kemudahan bagi pengguna dan membantunya untuk menjelajah ke seluruh bagian halaman web tanpa harus mengalami kelelahan untuk membaca dan mengikuti layout • Penataan dan penekaan pada beberapa titik informasi akan memperjelas informasi. • Item apakah yang akan dibaca atau dilihat oleh pengunjung? • Semakin baik pendefinisian urutan dalam sebuah layout, maka semakin cepat seorang pengunjung sampai pada titik akhir urutan informasi

Menarik Perhatian • Web tidak akan dapat berkomunikasi dengan sukses bila layoutnya tidak di perhatikan • Sebuah layou yang menarik bisa jadi adalah layout yang cantik, mengejutkan , menghibur, tidak biasa, tetapi bisa juga sederhana dan lugas.

Layout Menurut Bentuk • • • Model Layout Top index Model Layout Bottom index Model Layout Left index Model Layout Right index Model Layout Split index Model Layout Alternating index

Model Layout Top index

Model Layout Bottom index

Model Layout Left index

Model Layout Right index

Model Layout Split index

Model Layout Alternating index

Layout Menurut Ukuran • Liquid Design • Ice Design • Jelly Design

Liquid Design

Jelly Design

Ice Design

WEB NAVIGATION

Web navigation is defined three ways: • The theory and practice of how people move from page to page on the Web. • The process of goal-directed seeking and locating hyperlinked information; browsing the Web. • All of the links, labels, and other elements that provide access to pages and help people orient themselves while interacting with a given web site

need for navigation, the some of the different functions web navigation : • • • Provides access to information Shows location in a site Shows “aboutness” of a site Reflects brand Affects site credibility Impacts the bottom line

models of how information on your site can be accessed • The content-linking-only model

• The “liquid information” model

• The filter model

• The search model

• The structural-browse model

users generally need to know: • Where am I? • What’s here? • Where can I go from here?

• Navigation Shows “ Aboutness ” of a Site • Navigatio n Reflects Brand • Navigation Affects Site Credibilit y

Web Navigation Design • • • Why are you building the site? Who will use the site? What does the navigation provide access to? How is the site content organized? How will users navigate to the content they need?

D esign Philosophies • • • User-centered design Designer-centered design Enterprise-centered design Content-centered design Technology-centered design

Information Seeking Professor Ellis identifies six primary behaviors in information seeking: • Starting: identifying relevant sources of interest • Chaining: following and connecting new leads found in an initial source • Browsing: scanning contents of identified sources for subject affinity • Differentiating: filtering and assessing sources for usefulness • Monitoring: keeping abreast of developments in a given subject area • Extracting: systematically working through a given source for material of interest

Modes of Information Seeking • • Directed browsing Semi-directed browsing Undirected browsing Known-item search Exploratory seeking “Don’t know what you need to know” Re-finding