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

Dopo Bite Size Standards di cui ho parlato qui, ecco Vitamin, un nuovo sito multiautore sul web design che, data la caratura degli autori, è senza dubbio molto promettente. Si tratta di una risorsa destinata a diventare un punto di riferimento.I primi articoli sono decisamente interessanti: How CRAP is your site design di Mike Rundle propone un'analisi dei siti web in base ai quattro elementi fondamentali del design: Contrasto, Ripetizione, Allineamento e Prossimità . Molto informativo, e a dire il vero è uno di quegli argomenti che avevo in mente per un articolo.Notevole il punto di vista di Dave Shea in Stop Hacking, or be Stopped sull'importanza di evitare gli hack CSS, soprattutto con IE7 che entrerà  presto nella rosa dei browser da tenere in conto per lo sviluppo e il test di siti web. A proposito di IE7, il 24 aprile è stata rilasciata la beta 2 che vale la pena di installare. Mi raccomando: se avete installato la beta precedente, va disinstallata prima di procedere con l'installazione.Infine, in Making Popular Layout Decisions Eric Meyer parla di scelte essenziali nello sviluppo di siti web: la risoluzione, il tipo di layout e il dimensionamento dei font. Quello che risulta è che non ci sono risposte assolute e scelte migliori rispetto ad altre.

Continua a leggere Vitamin, il web design multivitaminico

Categoria: Web Design

Il titolo è un gioco di parole fatto a partire da un libro di Sofia Postai: Siti che funzionano. Di siti che emozionano parla invece Donald Norman in questo breve saggio apparso sul suo sito personale.Norman prende le mosse dai nuovi, straordinari, servizi di mappe geografiche di Google, Yahoo! e Microsoft. Rispetto ai loro predecessori, a parità  di fattori come l'utilità , l'usabilità  e le informazioni che forniscono, offrono un'esperienza di gran lunga più coinvolgente. Perché? Per l'immediatezza del feedback, per i colori, per gli effetti di semi-trasparenza dei livelli sovrapposti, ma soprattutto per il movimento e per la fluidità  di questo movimento.Vi lascio alla lettura dell'articolo, non prima di aver riportato la parte finale, quella che guarda al futuro: We are moving from static pages with their clunky, slow repainting of the page to fluid, dynamic displays, where the movement is a major part of the charm. We are moving from behaviorally effective designs to ones that add emotional engagement.

Continua a leggere Siti che emozionano

Categoria: Web Design