Web Page Design for Designers

 


 

 

 

Navigációs elemek stílusának

kialakításakor egyensúlyra

kell törekednünk az esztétika

és a funkcionalitás között.

A HTML által biztosított

standard eszközkészlet lehet az alap,

jó használhatósága miatt.

 

 

 




Ha a felhasználó kikapcsolta a képek

automatikus letöltését (sokan teszik),

működik-e a navigációs elképzelésünk

szöveges módban, vagy a felhasználó

reménytelenül eltéved?

A World Wide Web természeténél fogva arra ösztönzi a felhasználót, hogy egyik site-ról, oldalról, gondolatról a másikra ugorjon. Az egész olyan egyszerű!

A könyvolvasás alapvetően lineáris folyamat. Elkezdjük az elején, és végigolvassuk. Az újságok, a magazinok és néhány könyv a tetszés szerinti beleolvasgatás céljára készült. Ha nem is az egészet, csak kiválasztott részeit olvassuk el, azt hasonló módon tesszük, mint egy könyv esetében - lineárisan.

Az interaktív hipertext megjelenésével szövegolvasás közben egy kattintással a világ másik pontján lévő oldalon találhatjuk magunkat. Míg ez a rugalmasság csodálatra méltó, azzal a káros mellékhatással is jár, hogy megszakítja a gondolat és a stílus folytonosságát. Jó esetben ez kis mértékben hat csak zavarólag, néha viszont teljesen összezavarja az olvasót.

A web oldal tervezőjének nem csak azt kell figyelembe vennie, ami az oldalon van, hanem azt is, ami azon kívül található. Ha a felhasználó egy "erősebb" oldalra ugrik, ami vizuális értelemben, tartalom vagy szerkezet tekintetében erőteljesebb hatást kelt, talán soha nem tér vissza!

Igen kevés információ jeleníthető meg teljesen véletlen-, ötletszerű stílusban - szükségszerű a struktúra és bizonyos fontossági sorrend felállítása. Nagy híve vagyok a szerkezeti vázlatkészítésnek a multimédia vagy WWW tartalom, reklámanyag vagy kézikönyv elkészítése előtt, ami a gondolatok rendezésére késztet, és szilárd alapot teremt ahhoz, hogy a részletek folyamatos kidolgozása közben ne veszítsük el rálátásunkat az egészre tervre. Ezenkívül megkönnyíti és zökkenőmentessé teszi az átmenetet a papírra vetett elképzelés és a kész interaktív CD-ROM vagy web oldal között.

Saját, jól megkülönböztethető vizuális stílus megalkotása és következetes alkalmazása a legjobb mód arra, hogy egy sorozat, összekapcsolódó vagy különálló web oldalt egybefogjunk. Ugyanúgy, mint egy felépített image, vagy lapkiadói stílus, megteremti saját identitását és határait. Navigációs szempontból, mindig észrevehetjük, mikor ugrottunk ki az egy stílusba tartozó hipertext oldalak csoportjából . Ezenkívül minősíti a céget vagy személyeket, akik felelősek a stílus kialakításáért.

 


HOME

Ez a hipertext homepage link
egyszerű és félreérthetetlen

 

 

plain home plain home 2

A bal oldali 'csupasz' homepage link
lehet akár egyszerű fejléc is,
míg a jobb oldalon lévő
egyértelműen hipertext gomb, ami visszajelzést is ad,
ha rákattintunk

 

home button1 home button 2

A bal oldali homepage link
nyilvánvalóan gomb,
de kattintásra nem ad semmiféle visszajelzést

 

Újabb navigációs elem,
ami sejteti ugyan funkcióját,
de kattintásra ez sem ad látható visszajelzést

Egy ikon, amit felirat
nélkül is könnyen felismerhetünk

 

Lehet, hogy ez egy gomb,
de lehet, hogy csak egy 'céltalan' felsorolásjelző ábra

 

Ez lehet image-map is,
hipertext kapcsolatokkal,
de így semmi sem jelzi,
hogy nem csak egy szép képről van szó

 

 

 

A HTML több szinten kínál navigációs lehetőségeket - az oldalakon megadható "anchor"-ok segítségével - oldalak vagy site-ok között. A megvalósításához alkalmazott eszköz lehet hipertext link, gomb vagy un. "image map".

A fő különbség a web oldalak és a multimédia egyéb formái között, ezen eszközök és a felhasználó közötti párbeszéd módjában található. A hipertext link meglehetősen könnyen érthető, és mindenkor működő, többet nem is érdemes szólni róla. A másik két eszköz viszont potenciális hátrányoktól szenved.

Miközben a multimédia gomb hagyományos módon működik, azaz ki-be jár, a web oldalon lévő gyakran nélkülöz bármiféle vizuális visszajelzést, sőt, az is előfordulhat, hogy fel sem ismerhető. Ideális esetben egy felhasználói felületen elhelyezkedő gomb a "MouseUp" (egérgomb felengedése) eseményre lép működésbe. Ez azt jelenti, hogy rákattintás után a felhasználó eldöntheti, az egérkurzor elmozdításával a gomb fölül megszakítja-e a műveletet. A web oldalon lévő gombok már a "MouseDown" (egérgomb lenyomása) eseményre aktiválódnak. A rendszer általános lassúsága és a vizuális visszajelzés esetleges hiánya miatt a felhasználó nem mindig tudja mi történt, ha egyáltalán történt valami. A gomb kaphat színes keretet, ami benyomásra színt vált, akárcsak a hipertext, de ezt a lehetőséget ritkán használják ki esztétikai megfontolásból.

A image map egyéb problémákat is felvet. Ugyanúgy hiányzik a vizuális visszajelzés, és a kép un. "hot" felületei is gyakran zavarosak. Szerver-alapú CGI scriptek esetén késlekedés tapasztalható, ahogy az image map-re kattintva, az elküldi a kurzor aktuális pozícióját a szervernek, visszaadja az új URL-t a böngészőnek, amelyik ismét a szerverhez fordul, hogy megtalálja az új célt. A "kliens oldali" image map-et, ami minden számítást a helyi számítógépen végez, csak néhány böngésző támogatja, így veszélyes a navigáció egyedüli eszközéül felhasználni.

A web oldal tervezőjének a felelőssége ezen korlátok leküzdése. A nagy igyekezetben, hogy kreatívak és stílusosak legyünk, túl könnyű figyelmen kívül hagyni az alapvető funkcionalitást. Annak biztosítása, hogy egy gomb észrevehető módon mutassa funkcióját, kényes kérdés lehet. Egy kép akkor viselkedik gombként, ha vékony, kék kerettel rendelkezik, ami vörösre vált, ha a rákattintottak. Egy kép, ami gombnak néz ki, valószínűleg gomb. A képernyő egy "síkból kiemelkedő" területe lehet gomb is, de lehet, hogy valaki egyszerűen csak így akarta a szöveg egy sorát kihangsúlyozni. Egy felsorolásjelző szimbólum a sor elején lehet akár gomb is, ki tudja? Kattintsunk rá, és meglátjuk? Hoppá, földmérő felszerelések katalógusát látjuk a képernyőn, és a böngésző "vissza" gombja szürke - most mi legyen?

Ennyiből talán már látható, hogy míg egy magazin esetében az oldalakat kizárólag csak lapozni lehet, addig egy web oldal tervezőjének sok egyéb navigációs lehetőséget is figyelembe kell vennie

Ha többet is meg szeretne tudni grafikus szimbolizmus elméletéről, kattintson ide.

 

menunext