Sunday, November 10, 2013

Saps què li diu un redactor a un dissenyador? 10 pistes per dissenyar webs que es llegeixin.

[Versión en español]

Jo als dissenyadors els dic un munt de coses... normalment, els dóno les gràcies més sinceres per fer que els textos que he treballat es llegeixin bé. I és que sense un bon encaix entre disseny i continguts, els textos perden lectors. 



Aquí teniu deu pistes per dissenyar textos que es llegeixin:

1. Tenir clar que el text en un web serveix per comunicar i transmetre informació essencial, no per decorar o omplir un espai.


2. Decidir l'amplada dels textos segons criteris de llegibilitat, i no només estètics.
Una columna de text molt estreta o molt ampla costa de llegir. Trobar l'amplada justa d'un text no és fàcil, i menys quan el disseny s'ha d'anar adaptant a múltiples dispositius, però està bé contemplar dues regles generals:
 i) Si hem de moure el cap per llegir el final d'una línia, moltes vegades no la llegim.
ii) Si hem de canviar de línia massa ràpid, se'ns cansen els ulls i abandonem la lectura més ràpidament.


3. Jerarquitzar els missatges gràficament segons la importància que tenen conceptualment. 
No tots els textos d'una pàgina tenen el mateix pes. Gràficament hem d'ajudar els usuaris a saber quins són els missatges clau i quins els secundaris. Quin text és independent i quin està relacionat amb què. Si juguem amb quadrícules massa uniformes, perdem la jerarquia conceptual.


4. Marcar clarament les paraules clicables. L'usuari ha de tenir clar quin text és clicable i quin no. Si no és evident que un text és un enllaç, estem perjudicant la navegació. Si una paraula sembla clicable però no n'és, generem frustració. 


5. Evitar que les llistes flotin. Gràficament, les llistes són atractives i per això a Internet els usuaris sovint anem directament a llegir una llista. Per situar i entendre bé una llista, però, necessitem haver llegit el text que la introdueix. El disseny ha de definir els espaiats adequats per facilitar que l'usuari llegeixi la frase prèvia a la llista.


6. Posar el text clau on tothom mira. Hi ha zones de pantalla que tothom veu... i n'hi ha que no. Tots mirem la part superior esquerra d'un web, i deixem la part dreta per més tard, si és que la mirem. Tots mirem la part superior de la pantalla i deixem la part inferior per més tard, si és que la mirem. 


7. Tenir en compte que els missatges clau amb estètica publicitària o decorativa s'obvien o s'interpreten com a missatges irrellevants. Sembla que estem molt acostumats a discriminar d'un cop d'ull la publicitat i els elements decoratius. Si volem destacar un text per assegurar-nos que els usuaris el llegeixin hem de buscar altres recursos.


8. Els formularis tenen molts requeriments de disseny: han de tenir títol i espai per a instruccions breus. Els camps obligatoris han d'estar clarament senyalitzats. El nom, el text explicatiu del camp i el mateix camp han d'estar clarament relacionats.


9. Recordar que els vídeos i les gràfiques necessiten títol i un petit text explicatiu. I que les fotos no decoratives necessiten peus de foto. Si es dissenya un web abans de tenir els continguts a punt, és important tenir-ho en compte.


10. Llegir fosc sobre clar és molt més fàcil que llegir clar sobre fosc. 
Convé reservar el text blanc sobre fons de color per a elements que es volen destacar, no per a textos que els usuaris llegiran. Aquí hi teniu una bona explicació. http://uxmovement.com/content/when-to-use-white-text-on-a-dark-background.

Algunes d'aquestes pautes només es poden aplicar un cop el dissenyador té el text final, o quasi final. Per això és tan important que els dissenyadors tinguin el text abans de començar a treballar. I que ens anem oblidant del lorem ipsum.



3 comments:

  1. Moltes gràcies, Clara. Són principis molt clars i coherents, i els expliques molt bé.. Només afegiria una cosa: si un web s'ha de traduir, tots els principis esmentats també s'han de complir en la segona versió.

    ReplyDelete
    Replies
    1. Gràcies! Sí, i tant, els textos han de poder ser llegibles en tots els idiomes. De fet, si un web és multilingüe, disseny ha de tenir en compte les possibles variacions (per exemple, la llargada dels noms de menús) perquè tot encaixi.

      Delete
  2. Per cert, sóc l'Àfrica. No sé per què el sistema ha utilitzat el nom "peixet de plata", que és una identitat anterior meva que encara continua flotant pel ciberespai...

    ReplyDelete