Potreste non pensarci spesso, ma le tabelle devono essere lette. In questo estratto dal Capitolo 2 del suo libro, Web Typography, Richard Rutter spiega come la tipografia possa migliorare la UX delle nostre righe e colonne.
Argomento: Tipografia & Web Fonts
Comunicare con i font. Font e layout. Progettare per i lettori. Leggibilità. Web Font: c’è vita oltre Georgia e Verdana. Usare @font-face di CSS per inserire i font con gli opportuni permessi sui propri siti. Typekit e altre soluzioni. Controllare la tipografia web: dimensione, font, colore. Metodi CSS, problemi dei browser, problemi lato utente e workaround. Punteggiatura tipograficamente corretta. Unicode. Scalare il testo.
Tipografia Web: numeri
In questo estratto dal Capitolo 2 di Web Typography, Richard Rutter spiega l’importanza dell’uso corretto dei numeri nel nostro lavoro, incluso quando dovreste e non dovreste usare i caratteri numerici vecchio stile.
Usare i webfont
L’utilizzo dei webfont comincia con una semplice dichiarazione CSS, ma creare un font stack usabile e dei fallback non è così semplice come sembra. Bram Stein ci spiega come avere successo in un esclusivo estratto dal Chapter 2 del suo nuovissimo Webfont Handbook, disponibile adesso da A Book Apart.
Interfacce utente per i variable font
Gli strumenti con cui facciamo design hanno un effetto peculiare sul nostro modo di lavorare, ponendoci vincoli e offrendoci possibilità mentre esploriamo, esaminiamo, creiamo. I variable font ci danno un nuovo, ampio spazio tipografico con cui lavorare. Invece di prescrivere il valore di singoli elementi di UI nel nulla, dovremmo usare un approccio ibrido e calcolato nei confronti delle interfacce per i variable font. Come strutturare i nostri tool di design perché si adattino ai nuovi vantaggi che ci forniscono i variable font?
L’accessibilità è come il gioco della talpa
Eleanor Ratliff chiede: “Come gestiamo i bisogni di accessibilità per cui non ci sono risposte definitive?”. A volte arriviamo a una soluzione che aiuta un gruppo di persone solo per scoprire che quella stessa soluzione lede l’esperienza di un altro gruppo. Attraverso il prisma della scelta del carattere tipografico, Ratliff racconta come insieme al suo team abbia gestito il problema del gioco della talpa dell’accessibilità per un progetto di rebranding.
Interpolazione live dei font sul Web
Tutti vogliamo progettare delle esperienze tipografiche grandiose e contemporaneamente soddisfare una gran varietà di utenti su numerosi devices. Ma i font oggi non sono flessibili e non si ridimensionano. Possiamo risolvere questo problema rendendo i webfont più come font di sistema e consci del loro contesto, e l’interpolazione live dei web font (la modifica del design di un font nel browser) può aiutarci a raggiungere il nostro obiettivo. Andrew Johnson ci mostra come.
Come si legge
Quando leggiamo, filtriamo il testo attraverso le nostre esperienze e le passate conversazioni. Mettiamo le parole in un contesto. Interpretiamo. Ma in che modo possiamo usare la tipografia per dare il benvenuto ai lettori e per convincerli a sedersi con noi per questo processo? Jason Santa Maria di A List Apart ce lo spiega in questo estratto dal Capitolo 1 di On Web Typography, il suo nuovo libro pubblicato da A Book Apart.
Creare style guide
Una style guide, nota anche come pattern library, è un documento sempre in evoluzione che descrive in dettaglio il codice front-end per tutti gli elementi e per tutti i moduli che compongono un sito web o un’applicazione. Inoltre, documenta il linguaggio visuale del sito, dagli stili per l’header alla palette di colori. In breve, una style guide ben fatta è una guida onnicomprensiva a cui può far riferimento l’intero team quando deve decidere sui cambiamenti e sulle iterazioni da fare su un sito. Susan Robertson ci mostra come creare e mantenere una style guide che aiuti tutti, dai product owners e product producers ai designer e agli sviluppatori a mantenere il brand e gli obiettivi di un sito in continuo mutamento.
L’era dei symbol font
Benvenuti nella terza era dell’ottimizzazione della performance web: i symbol font. Qualsiasi cosa, i punti elenco e le frecce, le icone per i feed per i social media, possono ora essere raggruppate in un singolo piccolo file di font che può essere messo in cache e reso a diverse dimensioni senza la necessità di avere più immagini o colori. Si tratta di un file con gli stessi benefici di caching e di dimensioni di una sprite CSS, con in più i vantaggi che stiamo solo cominciando a realizzare con i display ad alta risoluzione. Scopriamo i vantaggi ed esploriamo le sfide che si incontrano quando si usano i symbol font.
ALA Summer Reading Issue
Vi presentiamo la ALA Summer Reading Issue, i nostri articoli preferiti scelti tra i 355 numeri di A List Apart. Potete leggerli (in inglese) anche come epub sul Kindle, sull’iPhone, sull’iPad, su Readmill o altri lettori di e-book.
