SlideShare a Scribd company logo
1 of 61
Llegibilitat a la web
Mariona Grané. Laboratori de Mitjans Interactius.   @LMIUB   @CAVUB
principis de disseny interactiu
principis de disseny interactiu




     Llegibilitat
           Claredat
           Llegibilitat
           Visibilitat
«Lo primero al escribir para Internet es saber escribir…»
Gabriel García Marquez
llegibilitat



   La llegibilitat, no és només relativa al format visual dels textos, ...
   implica també al contingut.

   i es refereix a:
      la llegibilitat en si,
      la claredat
      i la visualització dels textos en pantalla,



   i pot transcendir a la lectura de qualsevol contingut en altres formats no textuals.
Claredat
llegibilitat



   Claredat: Qualitat d'allò que és fàcil d'entendre, de discernir, perquè no és confús.




    La claredat se centra en el contingut, el
    llenguatge i el significat dels textos que
    són escrits i dissenyats per ser llegits en
    un entorn web.
llegibilitat



   «A la xarxa el lector no és com en el món imprès. L'internauta és impacient, voraç,
   inconstant. Realitza molt menys esforç sobre cada text, doncs té a la seva disposició,
   ràpida i fàcilment, milions d'alternatives.
   Si un text li és complexe, l'avorreix o el desborda, hi ha una alta probabilitat que
   abandoni o busqui alguna cosa més digerible. L'internauta no llegeix, escaneja
   ràpidament la pantalla en busca d'alguna cosa que el pugui interessar». (García,
   2005)
llegibilitat



   Centelles (2004) ... llegir és un mecanisme de creació de significat.
   No sempre es llegeix amb els mateixos objectius, no sempre es llegeix igual.



   Diferents estils lectors a la web:

           · la lectura intensiva per entendre el significat global d'un document web o bé el
           sentit específic d'alguna de les seves parts. Amb una lectura lineal o seguint
           l'estructura proposada per l'autor i re-lectures necessàries si calen.

           · la lectura superficial      per identificar ràpidament les idees principals d'un
           document. Lectura molt ràpida de títol, subtítols, encapçalaments, altres elements
           organitzadors del text, visualitzar i interpretar les il·lustracions i les imatges, lectura
           del primer i el darrer paràgraf d'un document, i de la primera frase de cada
           paràgraf.

           · la lectura exploratòria,  per cercar alguna dada o alguna idea o paraula clau.
           La majoria de vegades se sap que busca o bé està explorant una informació, i
           posteriorment potser que s'efectuï una lectura superficial.
llegibilitat



   I no podem oblidar que la lectura avui i cada cop més ja no és una activitat
   relacionada amb els llibres ... els dispositius digitals per a la lectura són cada cop més.
llegibilitat



   Com un disseny ajuda a la claredat en el contingut textual ?



   · Utilitzar un llenguatge objectiu, planer i senzill, un text s'ha de poder entendre a la
   primera lectura. Evitant paraules excessivament elaborades, cultes, o engreixades de
   manera artificial (com "compartimentació" en lloc de "divisió", per exemple).
llegibilitat



   · Fer servir textos breus, la claredat pot venir determinada per la mida de les frases, la
   seva llargària, la complexitat de les paraules, i fins i tot el nombre de síl·labes per
   paraula. Pensar en frases simples amb subjecte, verb, predicat, no complicant
   innecessàriament i centrar-se en: un paràgraf = una idea.
llegibilitat



   · Escriure amb llenguatge directe, simple i informal, utilitzant conceptes directes que
   atenguin a l'usuari.
   Ser precisos en els textos, tractar les idees de forma específica i contextualitzada.
   Parlar de tu, no de jo; evitar la veu pasiva; i utilitzant verbs forts enlloc de perífrasis
   verbals ("decidir" enlloc de "prendre una decisió", o "usar" enlloc de "fer ús", o
   "provar" enlloc de "realitzar una prova").
llegibilitat



   · Mantenir un estil objectiu, evitar llenguatges molt publicitaris que creen desconfiança
   en el lector, i presentar fets i evidències més que opinions o valoracions, i utilitzar verbs
   i substantius.
llegibilitat



   · Utilitzar una narrativa amb una estructura deductiva, seguint l'estratègia de piràmide
   invertida de presentar la informació mostrant en primer lloc les conclusions i idees més
   rellevants i desenvolupar el text per aprofundir en la idea presentada.
llegibilitat



   Claredat en el contingut dels enllaços també.


         evitar la frase “fes click aquí”, que descontextualitzada no significa res.




         escriure frases directes que convidin a fer click




         llenguatge directe i que la paraula d’enllaç sigui significativa




         W3C: quan cal, posar un text aclaridor que expliqui breument l'enllaç
Llegibilitat
llegibilitat



   Llegibilitat: Qualitat de llegible, diferenciació d'un signe d'un altre i facilitació de la
   lectura.


   La llegibilitat fa clara referència
   a un aspecte formal del disseny
   de pantalles .




   Com les característiques físiques
   dels textos influencien en les
   operacions lectores dels usuaris.
http://www.thetitlethemovie.com/
llegibilitat



   La percepció dels usuaris davant els problemes de llegibilitat en pantalla acostuma a
   ser problemàtica i destacada en totes les avaluacions d’usabilitat.




   És considerat un principi transversal, clau per accedir a qualsevol informació, i per
   tant ha de ser prioritari en el disseny.
llegibilitat



   Els estudis més rellevants al voltant de
   la llegibilitat de textos s'han realitzat
   lligats al text imprès. (Tinker)




           · Tinker, M.A. (1965). Bases for
           Effective Reading. Minneapolis:
           University of Minnesota Press.

           · Tinker,M.A. (1963). Legibility of
           print. Ames: Iowa State University
           Press.
llegibilitat



   · La mida del text, un fet decisiu però relatiu que cada cop més depèn de l’usuari.

   Bernard i Mills (2000) plantegen una mida adient de 12 punts per als textos en
   pantalla.

   Però cal tenir en compte ressolucions i tamanys de pantalla, necessitats personals,
   possibilitats que l’usuari decideixi el tamany del text al navegador, quantitat de text
   lligat al tamany, dispositius que es faran servir per “llegir” la web, ...
llegibilitat
llegibilitat
llegibilitat



   · El tipus de lletra o font emprada, .... atenció: no té una influència molt clara en
   relació amb el disseny de textos per a entorns web.


   L'estudi de Tinker (1929) amb
   tipografies d'ús comú
   no va mostrar diferències
   en la facilitat i rapidesa lectora.




   Al 1988 un equip de la universitat de Carnegie Mellon va analitzar les preferències i
   les habilitats lectores segons la comparació entre les fonts: Times New Roman i
   Georgia, i encara que no es va trobar cap diferència en habilitat lectora, els usuaris
   van preferir la Georgia (la van definir com més nítida, amable i fàcil de llegir).

   En un segon test es va comparar la Georgia amb la Verdana, i encara que els millors
   resultats lectors els van obtenir amb la Georgia, els usuaris van dir que preferien la
   Verdana.
llegibilitat



   Els estudis sobre la llegibilitat a la web actual s'han centrat en trobar diferències
   substancials en l'ús de fonts Serif i Sans Serif.




   PERÒ: excloent els casos d'una baixa resolució o una baixa qualitat o problemes de
   contrast en què cal pensar en una lletra Sans Serif, l'elecció tendeix més a servir com
   a element estètic que com a element facilitador de la lectura.
llegibilitat
llegibilitat



   · La indentació del text, que afegeix píxels de suavització que milloren la transició
   entre el text i el fons.




   Especialment en suports
   de baixa ressolució o poc
   tamany del dispositiu i si
   la mida del text és
   inferior a 12 punts.
llegibilitat



   · El contrast òptim entre els textos i el fons d'una pantalla web és un principi bàsic per
   a permetre la lectura en pantalla.




    Els resultats de contrast òptim
    entre textos i fons han de
    superar el 70% de
    lluminositat, evitant que el text
    desaparegui en el fons per
    manca de contrast i dificulti la
    lectura en pantalla, o
    provoqui fatiga.
llegibilitat


  Hi ha una millor eficiència lectora i menys fatiga en webs on



   · el contrast entre el text i el fons és molt
   alt,

   · el text és de color fosc i el fons és de
   color clar,

   · s'eviten els grisos en les seves diferents
   tonalitats com a fons de pantalla

   · s'evitin fons amb gràfics, fotografies,
   degradats o textures
llegibilitat
llegibilitat
llegibilitat
llegibilitat
llegibilitat



   · La llargària dels blocs de text en
   pantalla (ample de línia), té en compte
   que les frases llargues asseguren una
   millor eficàcia i una major rapidesa
   lectora.



   Els tamanys de pantalla fins al moment
   han limitat l'ample de línia en webs.
llegibilitat



   Manchon (2003), si es fa necessari utilitzar amples de línia curts és sempre més adient
   incloure a cada línia una unitat de significat a ser possible.
distribució visual



  · La justificació del text, aporta una imatge més endreçada i contundent.
llegibilitat



   · El kerning, és l'ajustament de l'espai entre lletres.

   Que cal que sigui variable segons la font i el seu disseny tipogràfic i visual.
llegibilitat



   · En cada tipografia cada lletra ocupa un espai diferent en si mateixa.

   Existeixen fonts proporcionals on cada lletra ocupa un espai diferent (per exemple una
   i ocupa un ample diferent que una n) i fonts no proporcionals (monospaced), en les
   quals totes les lletres ocupen un espai idèntic.
llegibilitat



   La llegibilitat implica un conjunt de relacions entre característiques, no ve donada per
   una sola ... i a més implica la qualitat estètica.
llegibilitat



   La llegibilitat implica un conjunt de relacions entre característiques, no ve donada per
   una sola ... i a més implica la qualitat estètica.
Visibilitat
llegibilitat



   Visibilitat: Grau en què és possible de veure i/o evidenciar elements en un medi.


   Llegibilitat i visibilitat estan íntimament relacionades, ... la qualitat de llegibilitat d'un
   text o una imatge en un entorn interactiu és condició essencial per donar pas a la
   visibilitat de l'element en si.
llegibilitat




  Bringhurst, 2002, més enllà de la
  llegibilitat hi ha l’opció d’impregnar
  cada text de vida, d’energia, que
  motivi al lector a llegir.
llegibilitat



   Donar visibilitat als textos a la web:



   · Col·locar els textos més rellevants en les zones més importants de la interfície.

   · Emfatitzar mitjançant fonts, estils, mides, colors...; utilitzant l’estil negreta, majúscules
   per a paraules concretes, no per a paràgrafs llargs.

   · Utilitzar el color i el contrast per distribuir i discriminar objectes i elements.

   · Agrupar visualment objectes informatius relacionats entre si.

   · Utilitzar llistes sempre que sigui possible, enumerant idees, amb apartats i sub-
   apartats.

   · Evidenciar visualment els encapçalaments, títols, subtítols, dels diferents apartats.

   · Justificar totalment els textos és una norma que es pot lligar a la llegibilitat, però que
   en realitat té una repercussió més evident en la visualitat del text en relació amb el
   total de la pantalla.
llegibilitat
llegibilitat



   El text esdevé, fnalment, un element del disseny tant potent com les imatges ... un del s
   objectius de la visibilitat és donar forma al text per fer-lo visual
llegibilitat



   Claredat: Qualitat d'allò que és fàcil d'entendre, de discernir, perquè no és confús.

   Llegibilitat: Qualitat de llegible, diferenciació d'un signe d'un altre i facilitació de la
   lectura.

   Visibilitat: Grau en què és possible de veure i/o evidenciar elements en un medi.
principis de disseny interactiu




       LEER NO MATA



       Tinker, M.A. (1965). Bases for Effective Reading. Minneapolis: University of
       Minnesota Press.

       Centelles; M. (2004). Escriure (correctament) per al web. Textos universitaris de
       biblioteconomia i documentació, nº 13. Recuperat el 19 d’agost de 2006 de
       http://www2.ub.es/bid/consulta_articulos.php?fichero=13centel.htm

       Shaikh, D. (2004). Paper or Pixels: What are People Reading Online?. Usability
       News, 6.2, 2004. Recuperat el 18 d'agost de 2006, de http://
       psychology.wichita.edu/surl/usabilitynews/62/online_reading_survey.htm

       Wilson, R.F. (2001). HTML E-Mail: Text Font Readability Study. Web Marketing
       Today. March 1, 2001. Recuperat al setembre de 2006, de http://
       www.wilsonweb.com/wmt6/html-email-fonts.htm
Mariona Grané.
Laboratori de Mitjans Interactius
               www.lmi.ub.edu

More Related Content

Viewers also liked

Distribució visual
Distribució visualDistribució visual
Distribució visualiMona06
 
Org i visual
Org i visualOrg i visual
Org i visualiMona06
 
Simplicitat visual
Simplicitat visualSimplicitat visual
Simplicitat visualiMona06
 
Ev disseny
Ev dissenyEv disseny
Ev dissenyiMona06
 
Los diseños del diseño interactivo
Los diseños del diseño interactivoLos diseños del diseño interactivo
Los diseños del diseño interactivoiMona06
 
Disseny formatiu
Disseny formatiuDisseny formatiu
Disseny formatiuiMona06
 
pla-pres
pla-prespla-pres
pla-presiMona06
 
Briefing interactivo
Briefing interactivoBriefing interactivo
Briefing interactivoiMona06
 

Viewers also liked (9)

Distribució visual
Distribució visualDistribució visual
Distribució visual
 
Org i visual
Org i visualOrg i visual
Org i visual
 
Simplicitat visual
Simplicitat visualSimplicitat visual
Simplicitat visual
 
Atencio
AtencioAtencio
Atencio
 
Ev disseny
Ev dissenyEv disseny
Ev disseny
 
Los diseños del diseño interactivo
Los diseños del diseño interactivoLos diseños del diseño interactivo
Los diseños del diseño interactivo
 
Disseny formatiu
Disseny formatiuDisseny formatiu
Disseny formatiu
 
pla-pres
pla-prespla-pres
pla-pres
 
Briefing interactivo
Briefing interactivoBriefing interactivo
Briefing interactivo
 

Similar to Llegibilitat

Suports Digitals per millorar la comprensio lectora
Suports Digitals  per millorar la  comprensio lectoraSuports Digitals  per millorar la  comprensio lectora
Suports Digitals per millorar la comprensio lectoraJoaquin Fonoll
 
12 exemple prova_lectura_cicle_inicial
12 exemple prova_lectura_cicle_inicial12 exemple prova_lectura_cicle_inicial
12 exemple prova_lectura_cicle_inicialpelvirolai
 
Projecte curricular franja analítiques comunitat grans
Projecte curricular franja analítiques comunitat gransProjecte curricular franja analítiques comunitat grans
Projecte curricular franja analítiques comunitat gransescolamiracle
 
3.Com Ha De Ser Un Web
3.Com Ha De Ser Un Web3.Com Ha De Ser Un Web
3.Com Ha De Ser Un Webmnicolau
 
El paper de la gramàtica en el marc del treball per tasques
El paper de la gramàtica en el marc del treball per tasquesEl paper de la gramàtica en el marc del treball per tasques
El paper de la gramàtica en el marc del treball per tasquesCarme Durán
 
Comprensió lectora
Comprensió lectoraComprensió lectora
Comprensió lectoraDictats
 
06- redacció de textos-2.pdf
06- redacció de textos-2.pdf06- redacció de textos-2.pdf
06- redacció de textos-2.pdfEduard Comeig
 
Disseny Web
Disseny WebDisseny Web
Disseny Webudl
 
Les tics al decret 111
Les tics al decret 111Les tics al decret 111
Les tics al decret 111jmje1973
 
Projecte curricular franja analítiques comunitat mitjans
Projecte curricular franja analítiques comunitat mitjansProjecte curricular franja analítiques comunitat mitjans
Projecte curricular franja analítiques comunitat mitjansescolamiracle
 
Que, qui com 3r (3)
Que, qui com 3r (3)Que, qui com 3r (3)
Que, qui com 3r (3)Pepeta2
 
Disseny d'Interfícies Multimèdia - Resum - Multimedia (UOC) - Paquita Ribas
Disseny d'Interfícies Multimèdia - Resum - Multimedia (UOC) - Paquita RibasDisseny d'Interfícies Multimèdia - Resum - Multimedia (UOC) - Paquita Ribas
Disseny d'Interfícies Multimèdia - Resum - Multimedia (UOC) - Paquita RibasPaquita Ribas
 
Lectura (en) digital. Competències comunicatives 2.0
Lectura (en) digital. Competències comunicatives 2.0Lectura (en) digital. Competències comunicatives 2.0
Lectura (en) digital. Competències comunicatives 2.0Josep Bargalló Valls
 
El lector expert
El lector expertEl lector expert
El lector expertElisia fs
 
001a com fer els textos planificats
001a com fer els textos planificats001a com fer els textos planificats
001a com fer els textos planificatsjmpinya
 
Resumir no ficcio sabons_detergents
Resumir no ficcio sabons_detergentsResumir no ficcio sabons_detergents
Resumir no ficcio sabons_detergentsDaniel Bartomeu
 

Similar to Llegibilitat (20)

Suports Digitals per millorar la comprensio lectora
Suports Digitals  per millorar la  comprensio lectoraSuports Digitals  per millorar la  comprensio lectora
Suports Digitals per millorar la comprensio lectora
 
12 exemple prova_lectura_cicle_inicial
12 exemple prova_lectura_cicle_inicial12 exemple prova_lectura_cicle_inicial
12 exemple prova_lectura_cicle_inicial
 
Projecte curricular franja analítiques comunitat grans
Projecte curricular franja analítiques comunitat gransProjecte curricular franja analítiques comunitat grans
Projecte curricular franja analítiques comunitat grans
 
3.Com Ha De Ser Un Web
3.Com Ha De Ser Un Web3.Com Ha De Ser Un Web
3.Com Ha De Ser Un Web
 
El paper de la gramàtica en el marc del treball per tasques
El paper de la gramàtica en el marc del treball per tasquesEl paper de la gramàtica en el marc del treball per tasques
El paper de la gramàtica en el marc del treball per tasques
 
Presentacions Multimèdia Eficients
Presentacions Multimèdia EficientsPresentacions Multimèdia Eficients
Presentacions Multimèdia Eficients
 
Mostres
MostresMostres
Mostres
 
Comprensió lectora
Comprensió lectoraComprensió lectora
Comprensió lectora
 
06- redacció de textos-2.pdf
06- redacció de textos-2.pdf06- redacció de textos-2.pdf
06- redacció de textos-2.pdf
 
Disseny Web
Disseny WebDisseny Web
Disseny Web
 
Les tics al decret 111
Les tics al decret 111Les tics al decret 111
Les tics al decret 111
 
Projecte curricular franja analítiques comunitat mitjans
Projecte curricular franja analítiques comunitat mitjansProjecte curricular franja analítiques comunitat mitjans
Projecte curricular franja analítiques comunitat mitjans
 
Que, qui com 3r (3)
Que, qui com 3r (3)Que, qui com 3r (3)
Que, qui com 3r (3)
 
Disseny d'Interfícies Multimèdia - Resum - Multimedia (UOC) - Paquita Ribas
Disseny d'Interfícies Multimèdia - Resum - Multimedia (UOC) - Paquita RibasDisseny d'Interfícies Multimèdia - Resum - Multimedia (UOC) - Paquita Ribas
Disseny d'Interfícies Multimèdia - Resum - Multimedia (UOC) - Paquita Ribas
 
Lectura (en) digital. Competències comunicatives 2.0
Lectura (en) digital. Competències comunicatives 2.0Lectura (en) digital. Competències comunicatives 2.0
Lectura (en) digital. Competències comunicatives 2.0
 
El lector expert
El lector expertEl lector expert
El lector expert
 
CronicaEntrevista_CALI_UD.pdf
CronicaEntrevista_CALI_UD.pdfCronicaEntrevista_CALI_UD.pdf
CronicaEntrevista_CALI_UD.pdf
 
40idees
40idees40idees
40idees
 
001a com fer els textos planificats
001a com fer els textos planificats001a com fer els textos planificats
001a com fer els textos planificats
 
Resumir no ficcio sabons_detergents
Resumir no ficcio sabons_detergentsResumir no ficcio sabons_detergents
Resumir no ficcio sabons_detergents
 

Llegibilitat

  • 1. Llegibilitat a la web Mariona Grané. Laboratori de Mitjans Interactius. @LMIUB @CAVUB
  • 2. principis de disseny interactiu
  • 3. principis de disseny interactiu Llegibilitat Claredat Llegibilitat Visibilitat
  • 4. «Lo primero al escribir para Internet es saber escribir…» Gabriel García Marquez
  • 5. llegibilitat La llegibilitat, no és només relativa al format visual dels textos, ... implica també al contingut. i es refereix a: la llegibilitat en si, la claredat i la visualització dels textos en pantalla, i pot transcendir a la lectura de qualsevol contingut en altres formats no textuals.
  • 7. llegibilitat Claredat: Qualitat d'allò que és fàcil d'entendre, de discernir, perquè no és confús. La claredat se centra en el contingut, el llenguatge i el significat dels textos que són escrits i dissenyats per ser llegits en un entorn web.
  • 8. llegibilitat «A la xarxa el lector no és com en el món imprès. L'internauta és impacient, voraç, inconstant. Realitza molt menys esforç sobre cada text, doncs té a la seva disposició, ràpida i fàcilment, milions d'alternatives. Si un text li és complexe, l'avorreix o el desborda, hi ha una alta probabilitat que abandoni o busqui alguna cosa més digerible. L'internauta no llegeix, escaneja ràpidament la pantalla en busca d'alguna cosa que el pugui interessar». (García, 2005)
  • 9. llegibilitat Centelles (2004) ... llegir és un mecanisme de creació de significat. No sempre es llegeix amb els mateixos objectius, no sempre es llegeix igual. Diferents estils lectors a la web: · la lectura intensiva per entendre el significat global d'un document web o bé el sentit específic d'alguna de les seves parts. Amb una lectura lineal o seguint l'estructura proposada per l'autor i re-lectures necessàries si calen. · la lectura superficial per identificar ràpidament les idees principals d'un document. Lectura molt ràpida de títol, subtítols, encapçalaments, altres elements organitzadors del text, visualitzar i interpretar les il·lustracions i les imatges, lectura del primer i el darrer paràgraf d'un document, i de la primera frase de cada paràgraf. · la lectura exploratòria, per cercar alguna dada o alguna idea o paraula clau. La majoria de vegades se sap que busca o bé està explorant una informació, i posteriorment potser que s'efectuï una lectura superficial.
  • 10. llegibilitat I no podem oblidar que la lectura avui i cada cop més ja no és una activitat relacionada amb els llibres ... els dispositius digitals per a la lectura són cada cop més.
  • 11. llegibilitat Com un disseny ajuda a la claredat en el contingut textual ? · Utilitzar un llenguatge objectiu, planer i senzill, un text s'ha de poder entendre a la primera lectura. Evitant paraules excessivament elaborades, cultes, o engreixades de manera artificial (com "compartimentació" en lloc de "divisió", per exemple).
  • 12. llegibilitat · Fer servir textos breus, la claredat pot venir determinada per la mida de les frases, la seva llargària, la complexitat de les paraules, i fins i tot el nombre de síl·labes per paraula. Pensar en frases simples amb subjecte, verb, predicat, no complicant innecessàriament i centrar-se en: un paràgraf = una idea.
  • 13. llegibilitat · Escriure amb llenguatge directe, simple i informal, utilitzant conceptes directes que atenguin a l'usuari. Ser precisos en els textos, tractar les idees de forma específica i contextualitzada. Parlar de tu, no de jo; evitar la veu pasiva; i utilitzant verbs forts enlloc de perífrasis verbals ("decidir" enlloc de "prendre una decisió", o "usar" enlloc de "fer ús", o "provar" enlloc de "realitzar una prova").
  • 14. llegibilitat · Mantenir un estil objectiu, evitar llenguatges molt publicitaris que creen desconfiança en el lector, i presentar fets i evidències més que opinions o valoracions, i utilitzar verbs i substantius.
  • 15. llegibilitat · Utilitzar una narrativa amb una estructura deductiva, seguint l'estratègia de piràmide invertida de presentar la informació mostrant en primer lloc les conclusions i idees més rellevants i desenvolupar el text per aprofundir en la idea presentada.
  • 16. llegibilitat Claredat en el contingut dels enllaços també. evitar la frase “fes click aquí”, que descontextualitzada no significa res. escriure frases directes que convidin a fer click llenguatge directe i que la paraula d’enllaç sigui significativa W3C: quan cal, posar un text aclaridor que expliqui breument l'enllaç
  • 18. llegibilitat Llegibilitat: Qualitat de llegible, diferenciació d'un signe d'un altre i facilitació de la lectura. La llegibilitat fa clara referència a un aspecte formal del disseny de pantalles . Com les característiques físiques dels textos influencien en les operacions lectores dels usuaris.
  • 20. llegibilitat La percepció dels usuaris davant els problemes de llegibilitat en pantalla acostuma a ser problemàtica i destacada en totes les avaluacions d’usabilitat. És considerat un principi transversal, clau per accedir a qualsevol informació, i per tant ha de ser prioritari en el disseny.
  • 21. llegibilitat Els estudis més rellevants al voltant de la llegibilitat de textos s'han realitzat lligats al text imprès. (Tinker) · Tinker, M.A. (1965). Bases for Effective Reading. Minneapolis: University of Minnesota Press. · Tinker,M.A. (1963). Legibility of print. Ames: Iowa State University Press.
  • 22. llegibilitat · La mida del text, un fet decisiu però relatiu que cada cop més depèn de l’usuari. Bernard i Mills (2000) plantegen una mida adient de 12 punts per als textos en pantalla. Però cal tenir en compte ressolucions i tamanys de pantalla, necessitats personals, possibilitats que l’usuari decideixi el tamany del text al navegador, quantitat de text lligat al tamany, dispositius que es faran servir per “llegir” la web, ...
  • 25. llegibilitat · El tipus de lletra o font emprada, .... atenció: no té una influència molt clara en relació amb el disseny de textos per a entorns web. L'estudi de Tinker (1929) amb tipografies d'ús comú no va mostrar diferències en la facilitat i rapidesa lectora. Al 1988 un equip de la universitat de Carnegie Mellon va analitzar les preferències i les habilitats lectores segons la comparació entre les fonts: Times New Roman i Georgia, i encara que no es va trobar cap diferència en habilitat lectora, els usuaris van preferir la Georgia (la van definir com més nítida, amable i fàcil de llegir). En un segon test es va comparar la Georgia amb la Verdana, i encara que els millors resultats lectors els van obtenir amb la Georgia, els usuaris van dir que preferien la Verdana.
  • 26. llegibilitat Els estudis sobre la llegibilitat a la web actual s'han centrat en trobar diferències substancials en l'ús de fonts Serif i Sans Serif. PERÒ: excloent els casos d'una baixa resolució o una baixa qualitat o problemes de contrast en què cal pensar en una lletra Sans Serif, l'elecció tendeix més a servir com a element estètic que com a element facilitador de la lectura.
  • 28. llegibilitat · La indentació del text, que afegeix píxels de suavització que milloren la transició entre el text i el fons. Especialment en suports de baixa ressolució o poc tamany del dispositiu i si la mida del text és inferior a 12 punts.
  • 29. llegibilitat · El contrast òptim entre els textos i el fons d'una pantalla web és un principi bàsic per a permetre la lectura en pantalla. Els resultats de contrast òptim entre textos i fons han de superar el 70% de lluminositat, evitant que el text desaparegui en el fons per manca de contrast i dificulti la lectura en pantalla, o provoqui fatiga.
  • 30. llegibilitat Hi ha una millor eficiència lectora i menys fatiga en webs on · el contrast entre el text i el fons és molt alt, · el text és de color fosc i el fons és de color clar, · s'eviten els grisos en les seves diferents tonalitats com a fons de pantalla · s'evitin fons amb gràfics, fotografies, degradats o textures
  • 35. llegibilitat · La llargària dels blocs de text en pantalla (ample de línia), té en compte que les frases llargues asseguren una millor eficàcia i una major rapidesa lectora. Els tamanys de pantalla fins al moment han limitat l'ample de línia en webs.
  • 36. llegibilitat Manchon (2003), si es fa necessari utilitzar amples de línia curts és sempre més adient incloure a cada línia una unitat de significat a ser possible.
  • 37. distribució visual · La justificació del text, aporta una imatge més endreçada i contundent.
  • 38. llegibilitat · El kerning, és l'ajustament de l'espai entre lletres. Que cal que sigui variable segons la font i el seu disseny tipogràfic i visual.
  • 39. llegibilitat · En cada tipografia cada lletra ocupa un espai diferent en si mateixa. Existeixen fonts proporcionals on cada lletra ocupa un espai diferent (per exemple una i ocupa un ample diferent que una n) i fonts no proporcionals (monospaced), en les quals totes les lletres ocupen un espai idèntic.
  • 40. llegibilitat La llegibilitat implica un conjunt de relacions entre característiques, no ve donada per una sola ... i a més implica la qualitat estètica.
  • 41. llegibilitat La llegibilitat implica un conjunt de relacions entre característiques, no ve donada per una sola ... i a més implica la qualitat estètica.
  • 43. llegibilitat Visibilitat: Grau en què és possible de veure i/o evidenciar elements en un medi. Llegibilitat i visibilitat estan íntimament relacionades, ... la qualitat de llegibilitat d'un text o una imatge en un entorn interactiu és condició essencial per donar pas a la visibilitat de l'element en si.
  • 44. llegibilitat Bringhurst, 2002, més enllà de la llegibilitat hi ha l’opció d’impregnar cada text de vida, d’energia, que motivi al lector a llegir.
  • 45. llegibilitat Donar visibilitat als textos a la web: · Col·locar els textos més rellevants en les zones més importants de la interfície. · Emfatitzar mitjançant fonts, estils, mides, colors...; utilitzant l’estil negreta, majúscules per a paraules concretes, no per a paràgrafs llargs. · Utilitzar el color i el contrast per distribuir i discriminar objectes i elements. · Agrupar visualment objectes informatius relacionats entre si. · Utilitzar llistes sempre que sigui possible, enumerant idees, amb apartats i sub- apartats. · Evidenciar visualment els encapçalaments, títols, subtítols, dels diferents apartats. · Justificar totalment els textos és una norma que es pot lligar a la llegibilitat, però que en realitat té una repercussió més evident en la visualitat del text en relació amb el total de la pantalla.
  • 46.
  • 47.
  • 48.
  • 49.
  • 50.
  • 51.
  • 52.
  • 54.
  • 55. llegibilitat El text esdevé, fnalment, un element del disseny tant potent com les imatges ... un del s objectius de la visibilitat és donar forma al text per fer-lo visual
  • 56.
  • 57.
  • 58.
  • 59. llegibilitat Claredat: Qualitat d'allò que és fàcil d'entendre, de discernir, perquè no és confús. Llegibilitat: Qualitat de llegible, diferenciació d'un signe d'un altre i facilitació de la lectura. Visibilitat: Grau en què és possible de veure i/o evidenciar elements en un medi.
  • 60. principis de disseny interactiu LEER NO MATA Tinker, M.A. (1965). Bases for Effective Reading. Minneapolis: University of Minnesota Press. Centelles; M. (2004). Escriure (correctament) per al web. Textos universitaris de biblioteconomia i documentació, nº 13. Recuperat el 19 d’agost de 2006 de http://www2.ub.es/bid/consulta_articulos.php?fichero=13centel.htm Shaikh, D. (2004). Paper or Pixels: What are People Reading Online?. Usability News, 6.2, 2004. Recuperat el 18 d'agost de 2006, de http:// psychology.wichita.edu/surl/usabilitynews/62/online_reading_survey.htm Wilson, R.F. (2001). HTML E-Mail: Text Font Readability Study. Web Marketing Today. March 1, 2001. Recuperat al setembre de 2006, de http:// www.wilsonweb.com/wmt6/html-email-fonts.htm
  • 61. Mariona Grané. Laboratori de Mitjans Interactius www.lmi.ub.edu