Unitat didàctica 3. Designing web navigation.
Important
No existeix una sola guia per a dissenyar la navegació d'una pàgina web. Nosaltres mateixos hem de ser capaços de veure què és allò que necesitem i què no. Una bona manera de fer aquest exercici és veure la pàgina com si fòssim els visitants i no els dissenyadors.
Categories de navegació
Estructural: connecta una pàgina amb una altra de nivell inferior (com una subcarpeta).
Navegació principal
Normalment es situa a la part superior de la pàgina
S'espera que enllacin amb pàgines dins el lloc web, no que enllaci amb pàgines externes
Els canvis que es produeixen en cada pàgina són mínims
Dóna una vista prèvia de la pàgina i respon preguntes que pot tenir l'usuari principiant, per exemple, saber si trobarà el que està buscant
És una orientació constant molt útil
Serveix per moure's fàcilment entre les pàgines sense haver de recomençar des de la pàgina principal
De què depén la mida i la persistència de la navegació principal?
Mida del lloc web
Comportament i necessitats de l'usuari
Objectius dels interessats (empreses, dissenyadors...)
Procès de navegació (si es pot interrompre o no, etc.)
Navegació local
Per accedir a nivells inferiors de l'estrucutura del web, a continuació de les pàgines de navegació principal
Extensió de la navegació principal
A diferència que la principal, la nav. local pot, a vegades, enllaçar fora de la pàgina web
Relaciona temes i els agrupa
Pot ajudar a aclarir de què tracta la pàgina
Disposicions comunes entre les dues navegacions
Com una L invertida: nav. principal horitzontal a sobre de la pàgina i nav. local vertical a l'esquerra
Les dues horitzontals, una sota de l'altra, potser de diferent mida, tipus de lletra, etc.
Verticals i adjuntes: en forma d'arbre, la local queda adjuntada, marcada amb tabulador, dins de la principal
Accessibilitat
Associativa: connecta pàgines de temes semblants, dins el mateix nivell (com passar d'una subcarpeta a una altra guardades dins la mateixa carpeta principal).
Navegació contextual
Incrustada: les paraules mateixes queden subratllades i servirien per donar més informació sobre la paraula enllaçada
Relacionada: en un quadre a part, serveixen per a facilitar més temes semblants al consultat o enllaçar amb els articles més visitats sobre aquell tema
Dóna la oportunitat d'ampliar la inforamció i una bona exploració
Navegació d'adaptació
Els links d'aquesta navegació estan creats per un procés basat en un rànquing algorítmic que analitza el comportament dels usuaris
Normalment utilitzada per a fer recomanacions en webs de comerç online
El més normal és fer llistes de top 10, perquè sovint, els enllaços més populars poden arribar a ser interminables
Subtopic
Enllaços ràpids
Enllaç a una pàgina important del web que no surt a la navegació principal
Navegació de peu de pàgina
Tradicionalment, conté informació addicional que no pertany al tema principal, com els crèdits, llicències de copyright, etc.
Utilitat: connecta amb pàgines i eines que ajudin a l'usuari a utilitzar la pàgina. Acostumen a estar fora de la jerarquia d'enllaços principal de la pàgina i només es relacionen entre les de mateixa funció.
Proporciona eines per ajudar a l'ususari a navegar per la web
No formen part de la jerarquia de la pàgina, enllacen amb altres pàgines dins d'aquesta però sense cap tipus de relació amb el tema, com per exemple, el perfil d'ususari, un "carro de compra"...
Normalment apareix al top del web
Sovint, la navegació principal i la d'utilitat apareixen juntes en una àrea global de navegació
Tipus de navegació d'utilitat
Enllaços que duen a altres pàgines de la mateixa empresa o negoci, per exemple, o com les diferents utilitats de google, etc.
Caixes d'eines, per fer el que sigui al lloc web
Logo enllaçat, que pot mostrar-lo com a imatge o pot ser un enllaç ràpid a la "home page"
Selector d'idioma
Recordem que si tenim una web en més d'una llengua, ha de quedar marcat al codi HTML
Selector de país o regió
Una mateixa pàgina pot tenir diferents producte segons la regió o el país
Navegació interna
Enllaços que serveixen per saltar d'una pàgina a una altra dins la mateixa web sense haver de tornar enrrere
També proporciona una vista prèvia general de la pàgina
Aspectes que distingeixen els diferents tipus de cerca
El tipus de mecanisme d'accès als continguts
Comportament dels enllaços de navegació i la transició a la següent pàgina
Les maneres de buscar els mecanismes de suport
El tractament visual de les opcions de navegació
La posició de la navegació a la pàgina
Tipus de pàgines
Pàgines de navegació: mostren al visitant el seu objectiu, si és una pàgina de contingut o funcional
"Home page": pàgina principal, ens redirigeix cap allà on vulguem anar
Pàgines de destinació: diferents categories de la pàgina principal
Pàgines-galeria: com les de destinació però amb contingut gràfic enllaçat a d'altres pàgines
Pàgines de resultat de cerca: es crea basant-se en les "keywords" utilitzades per l'usuari
Pàgines de contingut: són les pàgines que busca la gent: històries, articles, blocs, notícies...
Pàgines de producte
Imatges
Descripcions
Detalls
Productes relacionats
Afegir al "carro de comprar" o al "moneder"
Guardar en una llista de preferits
Veure les imatges en gran
Canviar la mida i el color
Enviar per correu a un amic
Pàgines funcionals: per completar la recerca online. No acostuma a haver-hi text, sinó navegació incrustada i links relacionats
Pàgines de cerca avançada, que normalment estan en pàgines serparades
Pàgines de presentació, de registre, per crear comptes... No tenen una navegació perquè no s'interrompi el procès (s'hauria de tornar a començar)
Subtopic
De què depén la llargada de la pàgina (Quan una pàgina s'hauria de convertir en dues?)
Mides de pantalla (no n'hi ha una de única)
Contingut (no té el mateix efecte si estpa dividit en parts diferents)
A la gent no li agrada llegir de la pantalla de l'ordinaor, és més cansat llegir online que en suport paper