Buone feste!

iPod natalizioAuguro a tutti i lettori di questo blog un felice Natale e soprattutto un ottimo 2007, sperando che ci porti buone novità nell’ambito del web design!

A quanto pare nel sondaggio che ho attivato da pochi giorni la speranza più diffusa è quella di avere in futuro maggior supporto per i CSS, seguita dalla morte di IE6… un sentimento comune. Staremo a vedere cosa ci riserverà il nuovo anno.

Buon feste! Troverete nuovi articoli nei prossimi giorni nonostante il periodo vacanziero.. restate sintonizzati.

Le icone della suite Adobe CS3

Le nuove icone realizzate dalla Adobe per la suite CS3 stanno sollevando incredibili discussioni in rete, soprattutto sui blog stranieri.

Cosa ci sarà mai di strano in delle semplici icone? Molto, visto che la Adobe ha deciso di attuare una vera e propria rivoluzione per i vari Photoshop, Illustrator, Dreamweaver e tutti gli altri prodotti della serie (se ricordate, ha acquisito la Macromedia).

Ecco il risultato:

Le icone Adobe CS3

Detto sinceramente, apprezzo il tentativo di allontanarsi da una grafica fin troppo ricca e decorata, ma si poteva raggiungere lo stesso obiettivo anche in altri modi. Semplificare al massimo non è un male, ma qualcosa non va.

L’aspetto che non mi convince più di tutti è il dover per forza riconoscere le diverse icone da un elemento testuale: Ps = Photoshop, Dw = Dreamweaver, solo alcune hanno conservato un simbolo come ad esempio l’Acrobat Reader.

Questo approccio comporta grandi problemi, soprattutto ad una prima occhiata: l’unica forma che consente di distinguere le icone è proprio il testo, in un font banale e senza particolari variazioni. Il riquadro esterno è identico per tutte, e non ci sono altri elementi caratterizzanti.

Non è nemmeno possibile fare affidamento sui colori soprattutto per chi ha problemi a distinguerli, chi conosce le WCAG avrà presente il problema.

Considerato che queste icone saranno sul desktop di tutti coloro che lavorano con i programmi Adobe, e che saranno costretti a vederle ogni giorno.. il risultato è deprimente.

Sperando in un cambiamento, voi cosa ne pensate?

Per chi conosce l’inglese, vi segnalo il post ufficiale di presentazione delle icone sul blog di John Nack della Adobe, su cui trovate molti pareri anche da parte dei vari guru del web design mondiale.

Fantastico record: 100 lettori del Feed RSS

Nella giornata di Lunedì 18 Dicembre è stato raggiunto un record significativo: secondo Feedburner i lettori del feed RSS hanno superato quota 100 per la prima volta!

TomStardust.com feed record

Certo poca cosa rispetto a blog ben più autorevoli, ma un ottimo traguardo per me, soprattutto considerando che TomStardust.com non ha nemmeno un anno di vita.

Approfitto di questo post per ringraziare tutti pubblicamente, augurandomi che la crescita continui su questi ritmi. Anche nel prossimo periodo delle vacanze natalizie non mancherò di scrivere nuovi articoli, restate sintonizzati!

Nuova versione per il validatore CSS del W3C

Qualcuno l’avrà già notato, il validatore CSS del W3C è stato recentemente aggiornato ed alcune novità sono degne di nota.

Prima di tutto adesso supporta i CSS 2.1, visto che precedentemente il supporto di default era fermo ai CSS 2.0. E’ stata anche cambiata la veste grafica, con javascript che migliorano l’usabilità dell’interfaccia, ed è stato aggiunto il supporto a più lingue.

Restano alcuni problemi minori con javascript disabilitato, ma il servizio è pienamente fruibile, almeno dopo le prove che ho fatto.

Colgo l’occasione per ricordare una cosa importante: i warning che troverete praticamente sempre nei report vanno saputi interpretare. Un buon CSS non è detto che debba esserne privo.
Uno dei warning più comuni, ad esempio, riguarda la mancanza di un colore di sfondo quando è stato impostato il colore del testo, ma il validatore non può sapere che magari quel colore di sfondo è stato già specificato in un altro selettore.

Fate attenzione quindi, potete benissimo modificare il vostro foglio di stile per eliminare i warning, ma questo vi porterà ad un codice ridondante, spesso inutile, e sicuramente più pesante.

P.S.: per saperne di più sull’aggiornamento del validatore CSS, trovate maggiori informazioni sul blog dedicato

Il redesign di Mezzoblue

Mezzoblue - screenshotTra i siti che seguo ogni giorno c’è Mezzoblue di Dave Shea, ed ho avuto una bella sorpresa quando ho scoperto la nuova versione (la 6), lanciata in questi giorni.

In questi casi un’immagine può dire molto più di mille parole, se non avete ancora visto il sito vi consiglio di visitarlo per farvi un’idea della nuova grafica.

Mettendo però da parte il puro lato estetico, la novità più grande è rappresentata dagli archivi e da come sono strutturati. Molto semplicemente, gli articoli non sono raggruppati nella classica suddivisione mensile, ma pur mantenendo un ordine cronologico vengono accomunati in gruppi dal numero di elementi variabile. Ogni gruppo ha un’unica immagine come tema, imitando la copertina di una rivista.

Un’idea semplice ma allo stesso tempo geniale, era ora di vedere qualche nuova soluzione! Tra l’altro ad ogni immagine è abbinato uno schema di colori diverso, che ovviamente dipende dalla fotografia utilizzata.

Il lato negativo di questa organizzazione, come fatto notare dallo stesso Dave Shea, è che potrebbero esserci problemi di riconoscibilità del “marchio”, visto che i colori cambiano nel tempo.
Comunque non un gran problema in questo caso, prima di tutto perchè è un sito personale e non quello di un’azienda.

Ultima nota: chi ancora utilizza IE6 potrebbe avere delle brutte sorprese visto che il redesign di Mezzoblue fa largo uso di png trasparenti. Scelta importante questa, dettata dalla necessità di pubblicare entro l’anno la nuova veste grafica. Se però i guru del web design iniziano a trascurare (anche temporaneamente) Internet Explorer 6, forse è davvero il tempo di cambiamenti, ricordando che è uscito IE7.

Aggiornamenti: Mootools, favicon e segnalazioni

Ho effettuato alcuni aggiornamenti minori al sito, per migliorare la velocità di caricamento ed il consumo di banda.

La novità più importante riguarda finalmente l’aggiornamento dello script per il pannello di controllo. Adesso utilizzo la libreria Mootools di Valerio Proietti, ed ho abbandonato Prototype. Se non l’avete ancora esaminata a fondo, vi consiglio di studiare le potenzialità di questo framework javascript.

Altro piccolo cambiamento riguarda la favicon del sito, modificata grazie al FavIcon Generator su Dynamic Drive. Basta uploadare un’immagine, anche con delle trasparenze, ed il vostro file .ico è pronto in un attimo.

Queste risorse sono fin da subito disponibili nella pagina utility, che ho appena aggiornato. Ho aggiunto anche un riferimento al plugin Democracy AJAX Poll per WordPress, che in questo momento utilizzo per il sondaggio nella homepage.

Infine per gli appassionati del manageriale Hattrick c’è anche un’utile estensione di Firefox chiamata Firehat, che permette di personalizzare i menu di navigazione secondo le proprie esigenze.

Se volete segnalarmi qualche altra risorsa interessante fatelo senza problemi, la aggiungerò nell’elenco.

Web Design 2007: previsioni per il futuro

Il 2006 sta arrivando al termine, e come è giusto che sia iniziano ad uscire in rete alcune previsioni per il 2007 di web designers e sviluppatori.

Ho letto un interessante articolo a riguardo, che si sbilancia su 5 argomenti, dall’accessibilità all’utilizzo di AJAX nelle pagine web. Questa una sintesi, non necessariamente tradotta dall’originale:

1. AJAX e DHTML saranno usati con cautela

A quanto pare ci si sta rendendo conto che se si è capaci di fare una cosa, non è necessario integrarla per forza nei propri lavori. Nel 2007 dopo la grande crescita di pagine in AJAX, contenuti dinamici, e javascript in abbondanza, ci sarà probabilmente un passo indietro. Meglio ottimizzare le pagine ed evitare l’integrazione di script che pesano più del necessario.

2. Addio angoli arrotondati

Previsione abbastanza azzardata questa.. che vede l’abbandono dei famosi rounded corners per concentrarsi su altri elementi grafici: linee, texture e contrasto.

3. Accessibilità per tutti

Internet continua a crescere, ed in questo processo è evidente l’attenzione sempre maggiore verso gli standard web e l’accessibilità. Nel 2007 queste tematiche avranno ancora più importanza.

4. Diffusione di CSS2 e CSS3

Internet Explorer 7 inizierà a diffondersi, e questo aiuterà l’utilizzo nei CSS di regole e selettori fino ad oggi poco supportati. Non si arriverà probabilmente a sfruttare le potenzialità dei CSS3, ma IE6 resterà solo su una minoranza di computer.
Obbligatorio offrire un’esperienza migliore a tutti gli utenti che navigano con Firefox, Opera, Safari e IE7.

5. Nascita di nuovi talenti

Previsione abbastanza scontata: è facile immaginare la nascita di nuovi talenti nell’ambito del web design, degli standard web e della programmazione. Anche in questo campo, probabilmente arriveranno novità dall’Asia.

Queste sono le previsioni di Ted Drake, pubblicate sul suo blog. Interessanti, anche se quella sugli angoli arrotondati mi lascia abbastanza dubbioso.. sicuramente è un’opinione basata su gusti personali.

E voi quali idee avete sul 2007 che arriverà? Io ritengo molto verosimile la prima previsione: è ora di abbandonare librerie javascript che pesano anche più di 200kb!

Sito nuovamente online: problemi di banda risolti

Ieri sera, per qualche ora, TomStardust.com è rimasto offline per aver raggiunto i limiti di banda mensile messi a disposizione dal corrente servizio di hosting.

Non è stato un grande problema poichè monitoravo la situazione ed eravamo all’ultimo giorno del mese, infatti passata la mezzanotte il sito è tornato visibile. Comunque un episodio poco piacevole.

Questo post è semplicemente per informare che dal prossimo mese non dovrebbero esserci più problemi del genere, visto che ci sarà un rilevante upgrade.

La crescita del sito negli ultimi mesi è andata senza dubbio oltre le migliori previsioni, mi sembra doveroso evitare problemi di banda per il futuro!

Grafici e programmatori: collaborazione difficile?

Prendo spunto da un recente articolo sul blog di html.it per affrontare l’eterna questione: come dovrebbe essere il rapporto ideale tra grafico e programmatore?

Prima di tutto va tenuto presente che la figura soprannominata negli anni ’90 web master sta diventando sempre più rara.
Ovviamente non parlo di siti amatoriali, ma è un dato di fatto come per avere buoni risultati sia necessario prendere il meglio delle varie specializzazioni: i singoli che sanno eccellere in tutto sono veramente pochi.

Sono però frequenti casi in cui le due realtà non riescono a comunicare tra loro in maniera efficace, complicando la realizzazione di un sito e facendo lievitare le spese. Questo spesso succede quando il creativo ed il coder non hanno la capacità di confrontarsi, e pretendono di restare sulle loro posizioni senza venirsi incontro.

Ci sono alcuni punti che andrebbero sempre tenuti presenti in determinate circostanze:

  • la diplomazia è essenziale, così come il rispetto del lavoro altrui
  • sono sempre necessarie delle conoscenze di base da entrambe le parti, per potersi confrontare con cognizione di causa
  • il dialogo deve essere costante, prima e durante la realizzazione dei compiti

Il caso peggiore che può capitare è un grafico che realizza un psd senza mai parlare con chi costruirà il sito: a quel punto, continuando con la peggiore ipotesi, il programmatore tirerà fuori un prodotto finale che non rispetta le bozze grafiche e non soddisfa nessuno, cliente compreso.

Questo è ciò che posso dire con la mia relativamente breve esperienza, visto che spesso mi trovo a realizzare siti accessibili in xhtml e css partendo da template realizzati da agenzie grafiche.
E voi avete esperienze a riguardo?
Vi avviso che non ho voluto complicare troppo la questione parlando anche di attività come l’information e l’interaction design!

Background sfumati con una sola immagine

Il 13 Novembre è stato pubblicato su A List Apart un articolo su come creare sfondi sfumati tramite i CSS, utilizzando un’unica immagine di sfondo.

L’idea è interessante, ma si basa su un presupposto: è necessario utilizzare un png trasparente per ottenere l’effetto desiderato. Ho già parlato in passato dei problemi che esistono attualmente con questo tipo di immagini, ed infatti la trasparenza non è supportata da Internet Explorer 6.

L’autore dell’articolo presenta una soluzione al problema basata sul filtro AlphaImageLoader, ma si dimentica di dire un particolare importante: in questo modo il CSS non sarà valido.

Discutibile anche la scelta di inserire l’immagine trasparente direttamente nel codice per poterla ridimensionare. In questo modo l’html prodotto ha un elemento presentazionale al suo interno che non ha senso di trovarsi lì. Io avrei fatto tutto dal foglio di stile, ripetendo l’immagine in orizzontale con un semplice repeat-x:
background: url(grad_white.png) repeat-x;
Riassumendo, l’idea è molto interessante e sarà valida con IE6 fuori circolazione, ma non mi sentirei di consigliare questa tecnica così com’è, applicando almeno le modifiche citate.