4 principis per a un bon disseny web
Fa alguns dies vaig llegir a My Ink Blog un article anomenat 4 principles of good design for websites. Em va semblar molt interessant i l’he volgut traduir per incloure’l dins el nostre bloc.
Tot i que el disseny pot semblar una cosa molt subjectiva ja que hi intervé el bon gust d’un dissenyador, també hi juguen elements que no ho son tant, com per exemple la percepció i uns patrons de conducta, alguns dels quals tenen molt a veure amb la percepció, específics dels usuaris d’Internet. Per això sempre és bo de tenir en compte aquests principis de disseny i usabilitat que de tant en tant podem anar descobrint de mans d’altres professionals, llibres, tutorials o fins i tot fruit del nostre propi treball.
1. CONTRAST
El contrast pot deixar una molt bona impressió de l’usuari. Sense un punt focal l’espectador es pot perdre en un mar d’elements de la mateixa mida i tipografia. El dissenyador té la tasca de crear elements o referents visuals que orientin l’usuari.
Contrast d’imatges: sovint és molt eficaç mostrar, per exemple, una gran il·lustració al costat de petits elements.
Contrast de colors: la proporció correcta de color és una altra manera eficaç de crear contrast dins d’un lloc web. Per exemple, podem centrar l’interès o podem donar rellevància afegint colors vius al costat de colors neutres.
Contrast de tipografies: podem generar contrast fent servir fonts o mides de lletra diferents dins la mateixa pàgina. La semblança de les fonts tendeix a crear confusió i a desdibuixar el disseny. Tanmateix pot ser molt eficaç si es combinen fonts amb mides molt diferents, combinant versions lleugeres amb versions agosarades d’una mateixa font.
2. REPETICIÓ
Ja hem parlat de la repetició d’elements en un article anterior. És un recurs fins i tot més comú dins el disseny d’impressió que en el disseny web. La repetició d’elements pot ajudar a crear un aspecte de marca, i podem jugar-hi també per agrupar elements, ja que la nostra ment per defecte mira d’agrupar i racionalitzar el que percep. Vegeu els plàtans a l’exemple següent:
3. ALINEACIÓ
L’alineació dels elements també adquireix un paper important que pot marcar la diferència respecte dissenys més “amateurs”. Per aquest motiu és molt útil fer servir retícules que ens ajudin en aquesta tasca. Podeu aprofundir més sobre aquest tema consultant i fins i tot descarregant retícules de 960 Grid System.
El següent exemple és una clara mostra, també reforçada mitjançant l’ús de línies. Cal destacar el triple columnat. A l’igual que passa amb els escrits em premsa, quan més estreta és una columna millor és la llegibilitat del text que hi ha a dins.
4. PROXIMITAT
Amb anterioritat també hem parlat sobre aquest principi, que té a veure amb el que comentàvem abans sobre la nostra percepció i la tendència a agrupar elements tancats, similars, alineats o propers. De la mateixa manera podem fer servir la proximitat per diferenciar elements, tan sols hem de deixar les separacions o els espaiaments adequats. El següent exemple és una mostra d’això, ja que podem percebre tres columnes per la proximitat i distància dels seus elements:
3 respostes a “4 principis per a un bon disseny web”
Deixa un comentari
Anna on April 1st, 2009
Totalment d’acord, i molt segurament els més utilitzats són el contrast i l’alineació (personalment, penso que es tracten dels més importants). Tot i això, jo n’afegiria un altre, encara que es podria col·locar dins d’un parell d’aquests principis. Quan parlem de formats digitals cal que es tingui present el terme “digital” i les implicacions físiques que això impliquen.
Degut a què depenen en la gran majoria en la vista i que no és un mitjà “natural” com pot ser-ho el paper (d’aquí que el disseny gràfic i el disseny digital estiguin diferenciats tot i que un sembli l’evolució de l’altre), cal tenir present també l’AIRE del conjunt. És a dir, els espais “en blanc” són necessaris i altament impressindibles en una bona estructura gràfica ja que aquest aire, influenciat per l’alineació, donarà més o menys legibilitat i lleugeresa visual al conjunt de la pàgina virtual (elements més intuïtius, estructura més neta, imatges i text més visibles, etc.).
Lluís on April 1st, 2009
Cert, el format digital comporta que tinguem en compte certs punts, a nivell de disseny, i també a nivell de redacció de textos. Per això el disseny web és molt més pròxim, per exemple, a un diari, que a qualsevol altre format amb suport físic. Un diari no és altra cosa que una bona pila d’informació (text, imatges…) en un espai reduït, i això comporta reptes a nivell de disseny i arquitectura de la informació.