13.Progettare il testo
•Descargar como PPT, PDF•
5 recomendaciones•3,040 vistas
Corso di Interazione Uomo Macchina del Prof.R.Polillo - Università di Milano Bicocca - DISCO - AA. 2009-2010
![Scopo di questa lezione ,[object Object]](data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7)
Recomendados
Recomendados
Más contenido relacionado
Destacado
Destacado (20)
Similar a 13.Progettare il testo
Similar a 13.Progettare il testo (20)
Más de Roberto Polillo
Más de Roberto Polillo (20)
13.Progettare il testo
- 1. PROGETTARE IL TESTO Corso di Interazione Uomo Macchina AA 2009-2010 Roberto Polillo Università di Milano Bicocca Dipartimento di Informatica, Sistemistica e Comunicazione
- 4. Introduzione
- 6. Libro delle Ore, Francia, ca. 1440
- 19. Font: esempi (dal primo Macintosh, circa1984)
- 21. Terminologia
- 24. Esempio Times New Roman Verdana
- 26. Legibility
- 27. Il processo di lettura Fonte : Kevin Larson. The Science of Word Recognition
- 32. Esempio: un test di leggibilità (video) Arial 10 Arial 12 (senza grazie) Times New Roman 10 Times New Roman 12 (con grazie) * * 35 partecipanti, vista 20/20, monitor 1024x768, 2 pagine di testo (M.Bernard & M.Mills, So, What Size and Type of Font Should I Use on My Website?, Usability News, Summer 2000) Tempo di lettura in sec
- 33. Un altro test di leggibilità (video) Tempo medio di lettura in sec (testi di circa 2 pag, con font di 12 punti, 22 utenti) (Bernard et al, 2001) Tahoma Times Courier Arial
- 34. Il font Verdana Progettato da Matthew Carter per Microsoft (1996) per essere ben leggibile su video, anche per piccole dimensioni, oggi molto diffuso: Caratteri larghi e ben differenziati, minuscole alte e ben leggibili I (con grazie), l e 1 ben differenziati
- 36. Infatti... L’uso delle minuscole associa ad ogni parola un “pattern” riconoscibile dato dalle ascendenti e dalle discendenti
- 37. Esempio
- 38. Corsivo Il corsivo comunque si legge male sul video, perchè enfatizza l’”effetto sega” creato dai pixel discreti:
- 39. Corsivo: esempio
- 40. Dimensione dei caratteri Un esperimento: (Williams, Scharff) Usare preferibilmente almeno caratteri in corpo 12
- 43. Impaginazione “a pacchetto” Può essere sgradevole in colonne strette (spazi vuoti)
- 47. Messa a fuoco A causa della diffrazione sul cristallino, difficoltà di messa a fuoco contemporanea, sulla retina, di colori diversi agli estremi dello spettro (immagine stereoscopoca, fatica) Quindi: evitare l’uso di scritte in cui siano vicini caratteri di colori saturi agli estremi dello spettro (es.: rosso - blu ; giallo - porpora ) LENTE Blu Verde Rosso Blu Verde Rosso A B C FUOCO SULLA RETINA LUCE BIANCA
- 48. Da questo esempio si vede la difficoltà di messa a fuoco contemporanea del rosso e del blu: da molti le righe di questi due colori vengono viste, per i motivi descritti, come se fossero collocate a distanze diverse dagli occhi. Questo fenomeno non si verifica se si usano due colori che si trovino fra loro più vicini sullo spettro visibile, come si può facilmente verificare da questo secondo esempio, che non dovrebbe presentare l’effetto tridimensionale di cui sopra.
- 49. Readability
- 53. VOCABOLARIO DI BASE (7000 lessemi) VOCABOLAR COMUNE VOCABOLARIO FONDAMENTALE lessemi
- 59. Stile a piramide invertita SINTESI DETTAGLIO MATERIALE AGGIUNTIVO link link
- 60. Stile a piramide invertita: esempi
- 61. Questo testo non è stato pensato per il web!
- 62. “ Wall of text” Fonte: Jakob Nielsen, www.useit.com
- 63. Questo testo non è stato pensato per il web!
- 64. Questo testo non è stato pensato per il web!
Notas del editor
- R.Polillo, Interazione uomo macchina - Parte terza, 3
- R.Polillo, Interazione uomo macchina - Parte terza, 3
- Single Leaf from a Book of Hours, by a French Scribe 163 x 117 mm France, ca. 1440 R.Polillo, Interazione uomo macchina - Parte terza, 3
- Belleville Breviary 1323-26 Illumination on parchment, 24,0 x 17,0 cm Bibliotheque Nationale, Paris The influence of Italian painting is marked in Pucelle's work, demonstrated by his interst in pictorial space. This is possibly the most revolutionary feature of his work. The exploitation of various rudimentary forms of perspective was a completely new feature of late thirteenth-century Italian painting, and Pucelle incorporated something of these experimments into his manuscript illuminations. The page from the Belleville Breviary shows David and Saul enclosed within a small doll's-house-like construction, painted erratically but clearly in three dimensions. R.Polillo, Interazione uomo macchina - Parte terza, 3
- R.Polillo, Interazione uomo macchina - Parte terza, 3
- R.Polillo, Interazione uomo macchina - Parte terza, 3
- YAHOO, circa 1995 ? R.Polillo, Interazione uomo macchina - Parte terza, 3
- R.Polillo, Interazione uomo macchina - Parte terza, 3
- R.Polillo, Interazione uomo macchina - Parte terza, 3
- R.Polillo, Interazione uomo macchina - Parte terza, 3
- R.Polillo, Interazione uomo macchina - Parte terza, 3
- R.Polillo, Interazione uomo macchina - Parte terza, 3
- It has been known for over 100 years that when we read, our eyes don’t move smoothly across the page, but rather make discrete jumps from word to word. We fixate on a word for a period of time, roughly 200-250ms, then make a ballistic movement to another word. These movements are called saccades and usually take 20-35ms. Most saccades are forward movements from 7 to 9 letters, but 10-15% of all saccades are regressive or backwards movements. Most readers are completely unaware of the frequency of regressive saccades while reading. The location of the fixation is not random. Fixations never occur between words, and usually occur just to the left of the middle of a word. Not all words are fixated; short words and particularly function words are frequently skipped. Figure 5 shows a diagram of the fixation points of a typical reader. During a single fixation, there is a limit to the amount of information that can be recognized. The fovea, which is the clear center point of our vision, can only see three to four letters to the left and right of fixation at normal reading distances. Visual acuity decreases quickly in the parafovea, which extends out as far as 15 to 20 letters to the left and right of the fixation point. Eye movement studies that I will discuss shortly indicate that there are three zones of visual identification. Readers collect information from all three zones during the span of a fixation. Closest to the fixation point is where word recognition takes place. This zone is usually large enough to capture the word being fixated, and often includes smaller function words directly to the right of the fixated word. The next zone extends a few letters past the word recognition zone, and readers gather preliminary information about the next letters in this zone. The final zone extends out to 15 letters past the fixation point. Information gathered out this far is used to identify the length of upcoming words and to identify the best location for the next fixation point. For example, in Figure 5, the first fixation point is on the s in Roadside . The reader is able to recognize the word Roadside , beginning letter information from the first few letters in joggers , as well as complete word length information about the word joggers . A more interesting fixation in Figure 5 is the word sweat . In this fixation both the words sweat and pain are short enough to be fully recognized, while beginning letter information is gathered for and . Because and is a high frequency function word, this is enough information to skip this word as well. Word length information is gathered all the way out to angry , which becomes the location of the next fixation. R.Polillo, Interazione uomo macchina - Parte terza, 3
- Prova con 35 partecipanti, con vista 20/20, con monitor 1024x768. Il materiale letto ad ogni prova era di circa 2 pagine di testo (1041 parole in media) M.Bernard & M.Mills, So, What Size and Type of Font Should I Use on My Website?, Usability News, Summer 2000 R.Polillo, Interazione uomo macchina - Parte terza, 3
- Released in 1996 , Verdana was bundled with subsequent versions of Microsoft's Windows operating system , as well as their Office and Internet Explorer software on both Windows and Mac OS . In addition, it was long available for download from Microsoft's web site allowing it to be used by any system supporting TrueType fonts. As a result, it is now installed on most desktop computers. The redistributable downloadable file is still available from a third-party web site; see the External links section. Bearing similarities to humanist sans-serif typefaces such as Frutiger , Verdana was designed to be readable at small sizes on a computer screen . The lack of serifs, large x-height (heights of lower-case letters, as scaled to the letter x being exactly equal to one), wide proportions, loose letter-spacing, large counters (spaces inside partially enclosed portions of letters or symbols such as "c", "s", or curved quotation marks), and emphasized distinctions between similarly-shaped characters are chosen to increase readability. As a result, it is often chosen by web designers attempting to cram large amounts of text into a small space. Indeed, Verdana is so much more readable than other common fonts of the same sizes that some have suggested that web authors not specify it for the body text of a web page, because then the author is likely to select a font size that makes the text unreadable when Verdana is unavailable [1] . According to one long-running survey [2] , the availability of Verdana is 94% on Windows (making it the second most common font on that platform) and 92.6% on computers running Macintosh OS. As an example of the attention given to making similar letters distinguishable, the capital letter 'I' in Verdana has serifs, even though Verdana is a sans-serif font. This makes it easy to distinguish between 'l' (ell) and '1' (one). R.Polillo, Interazione uomo macchina - Parte terza, 3
- R.Polillo, Interazione uomo macchina - Parte terza, 3
- Vedere le Jakob Nielsen’s Alertbox: HOW USERS READ ON THE WEB (Oct 1, 1997) CONCISE, SCANNABLE, AND OBJECTIVE: HOW TO WRITE FOR THE WEB (,John Morkes & Jakob Nielsen R.Polillo, Interazione uomo macchina - Parte terza, 3