24 ways: Don’t Lose Your :focus

a great article about accessibility troubles…

via 24 ways: Don’t Lose Your :focus.

addThis: come personalizzarlo

Gli strumenti di condivisione sono fondamentali per gestire il traffico sul nostro sito/blog, io utilizzo addthis, per diversi motivi ho dovuto modificarne il codice, per ottimizzarne la visualizzazione e l’usabilità.

ecco il codice prodotto:

Yahoo’s interactive menu, un bell’esempio di design e usabilità

segnalo questo articolo molto interessante

On my previous job, when I was working for a big web portal, we got used to look up to Yahoo’s interaction design as one of the most insightful example of dealing with users’ experience on a large scale audience.

via Yahoo’s interactive menu | Web & Patterns: patterns for a better web..

i blog che leggo

stavo mettendo a posto i miei preferiti, dal conto degli rss mi sono accorto che, da qualche mese a questa parte, leggo blog in maggioranza scritti da donne.

Non so come valutare questo dato

• scrivono meglio?
• scrivono cose più interessanti
• aggiornano più frequentemente
• se aggiornano, vuol dire che hanno più cose da dire (credo di si!)
• sarà per le foto ammiccanti che pubblicano (non troppe a dire la verità)

ragionando meglio vedo che gli argomenti che trattano più frequentemente sono:

1. design (dopo qualche anno devo ammetterlo, sono più bravi i grafici donna)
2. stile (se non vuoi fare la figura del fesso leggi vanity fair e segui i blog delle sue giornaliste)
3. gossip (il chiacchiericcio spesso ben ragionato è nel loro dna)

Search Engine Optimization Is Part of Good Web Design – Webmonkey

Leggo questo articolo sull’argomento design vs SEO e mi rendo conto che spesso non si centra bene l’argomento. L’ottimizzazione delle pagine per le attività S.E.O. sono spesso attività a latere rispetto alla pubblicazione del sito.

Questo è un problema che solo in parte riguarda il webdesigner, poichè se la struttra dell’html e la gestione del css son corretti il rendering prodotto è gia SEOReady.
Se utilizziamo correttamente i marcatori html rendiamo più facile la vista agli spider dei motori di ricerca.
Se la produzione di contenuto informativo è correttamente veicolato dai fogli di stile non ci saranno grandi problemi di utilizzo e poi di share su altri siti.

Insomma dopo tutti questi se credo sia chiara la distinzione dei ruoli, e cioè chi pensa alla progettazione dell’interfaccia per la sua ottimizzaizone grafica e la sua capacità di utilizzo, e chi invece deve ottimizzare i contenuti gestire delle tecniche di marketing e trip and tips vari per far salire di posizione l’url nella pagina di google.

Insomma chi si occupa di SEO faccia bene il suo lavoro che noi designer abbiamo altro a cui pensare;)

Position:relative & position:absolute

Position:relative & position:absolute

oggi impazzivo con questi due attributi css, e nello specifico il mio problema era il solito della differente visualizzazione sui vari browser (explorer 7 e firefox si comportavano in maniera simile ma explorer 6 sbarellava del tutto).
Grazie all’aiuto del mitico collega Max il tutto si è risolto posizionando un div contenitore in maniera assoluta e quello che doveva spostarsi in maniera relativa, in questo modo sono riuscito a posizionare tutti gli elementi senza bisogno di hack e altri smadonnamenti, il codice è questo:

.divContenitore { width:50%; background-color:#FF0000; position:absolute; float:left}
.divContenitore2 { width:50%; background-color:#006600; position:relative; top:13px}
.divContenitore2 p { color:#FFF}

10 domande a cui un sito deve rispondere – domanda 1

la home page

la home page di un sito è l’elemento fondamentale per gestire e veicolare le informazioni, nella progettazione credo che il 60% del tempo è impiegato nella realizzazione del wireframe e della grafica della home.

Personalmente ritengo che il successo o meno di un sito sia il giusto mix di elementi che prendono vita nell’home page, come un ottimo negroni o uno sbalorditivo vodka martini, gli elementi devono essere pochi ma buoni e ben bilanciati tra di loro.

il design deve garantire:

1. l’immedita riconoscibilità degli elementi (es. il logo )
2. ottimizzazione dei processi di fruizione di tutto ciò che è presente nella hp (es. form di iscrizione o di ricerca nel sito)

Google su un Roll: Sidewiki

Il 23 settembre, Google ha annunciato Sidewicki, Una caratteristica sulla sidebar di Firefox e Internet Explorer che ti permetterà di contribuire al contenuto di qualsiasi pagina web.

Con Sidewiki, i visitatori saranno in grado di condividere quello che pensano con l’altro in ogni caso – e proprio sulla vostra pagina web.

Io mi chiedo adesso cosa succedere con le politiche di gestione dello U.G.C. soprattutto se pensiamo ai blog politici o ai siti istituzionale…

via Conversation Agent: Google su un Roll: Sidewiki.

Learning html and css form

impariamo a generare form html gradevoli e funzionali

da qualche giorno sto seguendo una discussione su friendfeed in merito alla gestione dei form, e nello specifico a come utilizzare tutti gli elementi che possono essere utilizzati all’interno di questo tag:

• fieldeset
• legend
• label
• id
• name
• select
• radio
• text area
• button

mi sono imbattuto in queste slide davvero molto utili…have a nice design!

Italia.it – non c’è verso2

Macchè, non c’è verso, il portale nazionale del turismo è nato sotto una cattiva stella, non è cosa!
Gli esordi furono raccapriccianti, col Rutellone che parlava davvero come Alberto Sordi col suo peggior inglese, ma quello che è stato inaugurato oggi dalla rossa Brambilla è un punto peggio.

La grafica è del tutto anonima, nulla a che vedere con lo stile e la qualità del “fatto in Italia”, nemmeno lontanamente apprezzabile come un tramonto sulle colline toscane o le gradazioni di blu del mare salentino.
Si sono impegnati nel realizzare una patacca di quelle epocali!

L’abito non fa il monaco direte voi, e invece questa volta lo fa eccome, anzi l’abito fa lo straccione, perchè da una prima analisi è di questo che si tratta, uno straccio di sito.
Si fa bella mostra della dichiarazione di accessibilità e si precisa anche che per colpa di qualche filmato flash alcuni contenuti non saranno fruibili ai diversamente abili.
Ma fosse solo qualche filmato flash il problema, navigando velocemente il pataccone si rileva immediatamente che:
1. nessuna attenzione al corretto uso delle intestazioni (fig. 02)
2. già dall’home page vengono fuori errori di codice html (fig. 03)
3. mancano quasi del tutto gli attributi alt sulle immagini presenti (compresa quella del presidente ommioddio uggesù) (fig. 04)
4. assenti nella maggior parte dei casi i title sui link e sui bottoni
5. sui link che puntano a siti esterni non c’è il minimo avviso di cambiamento del focus

e queste son solo le cose minime, che saltano subito agli occhi…ma presto spulcerò meglio!