Oggi sono monotematico. Tra le novità  presentate ieri su Yahoo! User Interface Library c'è anche una nuova serie di pattern che va ad aggiungersi ad una già  ricca collezione.Ah, piccolo reminder: "Un pattern descrive la soluzione ottimale ad un problema comune nell'ambito di uno specifico contesto.", come da definizione data al termine proprio su Yahoo!. E un problema sempre più comune, in parte affrontato nel post dedicato alla nuova funzionalità  di ricerca del Wall Street Journal di cui si parlava qui, è il riuscire a far capire agli utenti che oggi, sulla pagina, possono fare cose che prima non potevano. Cose che prima erano disponibili solo su applicazioni desktop e che sempre più ritroviamo sul web.Di questo caso particolare si occupa la collezione di pattern dedicata alla cosiddetta Invitation: qual è il modo migliore, per fare un solo esempio, di far comprendere all'utente che una certa zona della pagina è direttamente editabile? Questo post su Y!UI Blog presenta i pattern Invitation e offre tanti spunti di riflessione sul tema. Da leggere.

Continua a leggere ‘Invitare’ l’utente

Categoria: Web Design

Ieri, sognando il mio prossimo viaggio, mi sono trovato quasi per caso a visitare il sito della KLM, la compagnia di bandiera olandese. Una visita che mi ha portato ad alcune riflessioni che vorrei condividere con voi. Si parla molto ultimamente del Web 2.0, e molto probabilmente molti di voi hanno usato GMail o un live-search su un blog.C'è però un'intera tipologia di siti che si spinge ben oltre nell'uso massiccio di Javascript e AJAX ed è proprio... la categoria di siti delle compagnie aeree. Non è un caso che Rico, uno dei framework Javascript/AJAX più completi, sia patrocinato dalla Sabre Airlines Solutions. Ho così passato in rassegna alcuni dei siti di compagnie aeree che mi sono venute in mente, ed è risultato che tutti fanno un uso più o meno notevole di Javascript (e presumibilmente AJAX) in moltissimi casi: menu a discesa, tab a scomparsa, ricerca destinazioni e selezione date... (more...)

Continua a leggere Web 2.0: accessibilita’ o user experience?

Categoria: Web Design

L'articolo CSS Reboot Trends di Christian Montoya sul recente CSS Reboot evidenzia tra le altre cose una tendenza sempre più evidente: i siti con testo chiaro su sfondo scuro. Tendenza confermata anche da una nuova galleria di siti di ispirazione (Light on dark) in cui sono elencati esclusivamente siti con queste caratteristiche.C'è da tenere in conto che i siti menzionati su entrambe le risorse sono per lo più siti personali di blogger e/o web designer, e che molto probabilmente scelte cromatiche simili sarebbero forse inadeguate per un sito commerciale: ad esempio uno sfondo scuro lo vedrei poco indicato per un'agenzia di viaggi o una ditta alimentare...La tendenza quasi opposta (uso di colori accesi) è presentata in Ultra pop, a parer mio più accattivante e versatile. A proposito di Design Melt Down e siti showcase: segnalo in conclusione the Daily Slurp, la nuova galleria di siti nata proprio per raccogliere i numerosi siti presenti su questa valida risorsa.

Continua a leggere La rinascita del nero… e del colore

Categoria: Web Design

Ho un diploma da geometra, una laurea in Scienze della Comunicazione; per mesi ho lavorato mezza giornata al computer e l'altra mezza in un cantiere edile. Il destino a volte disegna dei quadri pazzeschi. Ma in questo strampalato cocktail di impegni, ho meditato per tempo ad un parallelismo casuale solo fino a un certo punto: cosa accomuna e cosa divide la costruzione di una casa dalla costruzione di un sito web? (Uno sforzo di interpretazione è requisito necessario alla continuazione della lettura del post) (more...)

Continua a leggere Costruire un sito, mattone su mattone

Categoria: Web Design

Scrivo ai tanti veb desainer che ritengono che il loro lavoro consista solo nel disegnare il sito individuando un layout, decidere in che linguaggio svilupparlo, creare i menu e realizzare i movie.Design non significa disegno, come molti di noi italiani pensano. Design significa progettazione. Il Designer è un progettista a tutto campo, che si preoccupa delle forme, dei materiali, dell'ergonomia, della sicurezza, dell'impressione che il suo prodotto dovrà  produrre, della risposta alle sollecitazioni, della solidità  strutturale. (more...)

Continua a leggere Per i veb desainer egoisti

Categoria: Web Design

Interessante questo post di Joshua Porter. Analizza e commenta il cambiamento della posizione (da verticale a orizzontale) della barra di navigazione principale sul sito della CNN.La modifica riguarda per ora la sola home page, dal momento che nelle pagine interne la posizione è rimasta immutata (il post presenta un paio di screenshot che illustrano bene la situazione).Porter sottolinea come una scelta del genere abbia comportato una serie di decisioni piuttosto delicate. La barra orizzontale, per via dei limiti imposti dal layout, costringe per esempio ad abbreviare il testo dei link. Ma anche ad avere in vista un numero inferiore di item nel menu. La soluzione adottata è stata quella di mantenere lo stesso numero di link rispetto alla versione laterale e verticale (17) ma di confinare gli ultimi 5 ad una tendina ('More sections'). Cosa ne pensate? Di certo, sottolinea l'autore, è un fatto che equivale esplicitamente ad una scelta di priorità  tra le varie sezioni del sito.Vi lascio al resto del post per ulteriori spunti di riflessione.

Continua a leggere Da verticale a orizzontale

Categoria: Web Design

In questi ultimi tempi ho raccolto diversi link ad articoli sull'accessibilità  che a mio parere meritano più di una lettura. Cominciamo con un articolo non troppo recente (risale a circa un anno fa) ma molto interessante e comunque attuale: CSS Accessibility che presenta tra l'altro un corposo elenco di approfondimenti. Restando in tema di CSS: in CSS in Action: Invisible Content Just for Screen Reader Users vengono presentati alcuni esempi pratici per fornire ausili efficaci per la navigazione e consultazione di utenti con screen reader, nascondendoli visivamente su schermo.Roger Johansson ha da poco presentato la pagina indice di Evaluating Website Accessibility, una serie in tre parti che offre una solida base per la valutazione dell'accessibilità  dei siti web. La prima e la seconda parte sono state tradotte in italiano da Luca Magnani.Roberto Scano presenta in A Journey Through Accessibility storia e futuro dell'accessibilità  in relazione allo sviluppo dei web standards: una lettura decisamente informativa.Segnalo infine Accessibility Navbar un interessante tutorial per rendere un sito più accessibile attraverso appunto una navbar: parte dal markup, passando attraverso lo style switcher per lo zoom layout e i dispositivi mobili - rilevati automaticamente - fino ad arrivare agli skip links. Questo è tutto per ora: buona lettura!

Continua a leggere Accessibilita’: alcune letture

Categoria: Web Design

GrayBit

28 Apr

"Affidarsi ai colori per determinare la visibilità  e il contrasto di una pagina può portare a valutazioni errate. Convertire i colori nei loro equivalenti in scala di grigi è un metodo più affidabile. Eliminando l'influenza del colore, siamo in grado di valutare meglio il contrasto visivo reale...".Così recita la pagina di presentazione di GrayBit, uno strumento messo a punto da Mike Cherim e Jonathan Fenocchi per svolgere questo tipo di test su qualunque pagina web (qui la versione in scala di grigi di questo blog).Alcuni dei limiti del servizio sono evidenziati in un post su Accessify, mentre per una panoramica in italiano sull'argomento non posso non rimandarvi a Contrasto Colori, che offre tra l'altro una lista di altri strumenti automatici di valutazione del contrasto.

Continua a leggere GrayBit

Categoria: Web Design

Diverse segnalazioni interessanti sul web design raccolte negli ultimi tempi. Le liste e le classifiche sono tra le risorse più frequentate: ecco quindi Top 10 Best Designed Blogs di Elliot Back che propone la sua selezione favorita.Merita di essere aggiunto ai tutorial imperdibili il recente articolo Rock Solid CSS Layouts, un corposo tutorial che porta passo passo a realizzare un'intera pagina/template. Principles and Elements of Design è la quarta parte di una serie su Digital Web Magazine: in questo appuntamento un'analisi di alcune entry di CSS Zen Garden analizzate sotto l'aspetto del design. Andy Clarke riflette sull'uso semantico del codice in relazione al design in Semantics and design che merita una lettura attenta.Infine, due segnalazioni sui CSS. In Fixed: IE 6 min/max-width hack Cameron Moll propone un modo per avere un commento condizionale per avere min-width e max-width che non manda in crash IE6.Concludo con una delle poche segnalazioni critiche che ogni tanto mi piace fare: è diventato piuttosto popolare A Simple CSS Image preloading technique che presenta una tecnica per il preload con i CSS che usa un div vuoto per caricare attraverso i CSS diverse immagini. Due i punti da considerare: si tratta di usare un div vuoto per scopi puramente presentazionali, ma soprattutto non sono sicuro che sia una tecnica che funziona: dichiarando diverse immagini di background secondo la logica dei CSS l'unica ad essere considerata è l'ultima in ordine di codice: non è purtroppo dichiarata l'efficacia sui diversi browser, ma personalmente ho delle riserve in proposito. Se proprio c'è la necessità  di preload, Javascript è senza dubbio da preferire.

Continua a leggere Bookmark sul web design e CSS

Categoria: Web Design

Personalmente trovo decisamente accattivanti i siti a pagina singola. Come aveva preannunciato alla fine dell'anno scorso Marko Dugonjic in One-pagers will be the hit of the 2006, sono una promettente nuova tendenza.Una recente ed ampia analisi, corredata da un'interessante galleria, viene presentata in One Page Sites su Design Melt Down. Conferma il trend anche One Page Folios che conta ad oggi più di duecento siti/portfolio a pagina singola: davvero una risorsa notevole e d'ispirazione.

Continua a leggere Siti a pagina singola

Categoria: Web Design