Gli ultimi post di Edit

jQuery e usabilità degli slideshow

Lunedì 18 Luglio 2011 - 10:20

di Gabriele Romanato

Scripting

Esistono centinaia di effetti possibili da realizzare sugli slideshow con jQuery ed esistono centinaia di plugin che consentono di realizzare tali effetti. Sorprendentemente, però, le tipologie di slideshow sono sostanzialmente due: slideshow ciclici e slideshow manuali. La prima tipologia prevede che le slide si muovano automaticamente, mentre la seconda implica un’interazione da parte dell’utente. Ciascuna di queste due tipologie ha un impatto ben definito sulla user experience. Vediamo quindi quali sono gli accorgimenti da adottare per migliorare l’esperienza utente in tal senso.

Continua a leggere jQuery e usabilità degli slideshow

Tags:

Categoria: Scripting | Permalink | Commenta

Tutto ha un prezzo, pure con i CSS3

Giovedì 27 Maggio 2010 - 08:20

di Cesare Lamanna

CSS

In occasione della conferenza An Event Apart che si è svolta a Boston nei giorni scorsi, Dan Cederholm (una delle voci più influenti nel panorama mondiale del web design) ha svolto una presentazione tutta centrata sui CSS3.

A corredo della presentazione ha mostrato la demo di un sito fittizio (Things We Left On the Moon), una sorta di showcase di quanto sia possibile ottenere già oggi sfruttando al massimo le proprietà e le feature della nuova specifica. L’optimum si ottiene con Safari 4 e Chrome (sono infatti usate alcune proprietà avanzate e sperimentali supportate al momento solo da WebKit), ma l’esperienza è più che buona anche sull’ultimo Firefox e su Opera 10.50. Almeno a livello visuale. Non so infatti se è un problema dei miei browser, del mio Mac o cosa, ma… provate a fare lo scrolling della pagina, magari usando un mouse con la rotellina. Da me tutto procede, come dire, a scatti, fluidità zero. È solo un’impressione, intanto?

Chiaro che, trattandosi di una specie di prototipo dimostrativo, può accadere, e certo nulla è da imputare alla responsabilità di Cederholm. Molto più semplicemente mi pare di poter affermare che al momento non basta dire questa cosa è supportata da tutti i browser per lanciare urla di gioia. La via che porta all’adozione di massa di certe proprietà avanzate deve forse passare attraverso l’ottimizzazione nel rendering. E magari attraverso la saggezza e l’equilibrio di chi dovesse implementarle :).

Tags:

Categoria: CSS | Permalink | Commenti (14)

Suggerire articoli correlati come sul New York Times

Giovedì 15 Aprile 2010 - 08:22

di Cesare Lamanna

Scripting

Sul sito del New York Times hanno adottato un sistema particolare per notificare al lettore il suggerimento di articoli correlati a quello corrente. Potete vederlo in azione su qualunque pagina con lunghi articoli: basta scorrere la pagina fino in fondo e a quel punto vedrete apparire nell’angolo inferiore destro un box a comparsa con il link/suggerimento.

Su Codrops viene fornita la soluzione per implementare l’effetto attraverso poche righe di codice CSS e Javascript (basato su jQuery). È disponibile anche una demo.

Di default, se l’utente chiude il box, esso non ricomparirà più scrollando nuovamente la pagina verso il basso. Tra i commenti, però, l’autrice dello script segnala la piccola modifica da apportare al codice nel caso in cui si desideri far sempre ricomparire il box.

Chiaro, comunque, che in questi casi l’attenzione non va posta tanto sul codice, quanto sull’impatto e sull’utilità della soluzione a livello di progettazione dell’interfaccia e di interazione con l’utente. La trovate utile, ben concepita, interessante?

Tags:

Categoria: Scripting | Permalink | Commenti (1)

Come rendere inusabile il proprio codice (o quasi)

Mercoledì 24 Febbraio 2010 - 07:47

di Gabriele Romanato

Scripting

Se c’è una cosa che non sopporto degli sviluppatori è che spesso, quando scrivono anche la più piccola libreria JavaScript, ci si mettono d’impegno per farti buttare almeno un’ora di tempo per capire come usarla. Se leggete i commenti degli utenti alla libreria SyntaxHighlighter, noterete il ricorrere di parole come ‘doesn’t work’ e ‘can’t make it work’ (in italiano: non funziona, non so come farla funzionare). Questo è solo uno dei tanti casi in cui sarebbe bastato aggiungere dei file di esempio nel download per facilitare il lavoro degli sviluppatori che andranno ad usare la libreria, esattamente come succede per i plugin di jQuery (sia benedetta la community di jQuery!).

Continua a leggere Come rendere inusabile il proprio codice (o quasi)

Tags:

Categoria: Scripting | Permalink | Commenti (10)

Chi cerca trova… e chi modifica?

Martedì 9 Febbraio 2010 - 13:26

di Massimiliano Scorza

Software e Servizi

Anche.

Immaginate di trovarvi per la prima volta di fronte al più classico dei menu, che contiene le seguenti voci:

  • File
  • Modifica
  • Visualizza
  • Strumenti
  • Aiuto

Continua a leggere Chi cerca trova… e chi modifica?

Tags:

Categoria: Software e Servizi | Permalink | Commenti (15)

La label è mobile

Venerdì 29 Gennaio 2010 - 07:56

di Cesare Lamanna

Scripting

Che sia non intrusiva come soluzione non c’è dubbio; che richieda poche righe di codice Javascript è vero. Ho un po’ di dubbi sul fatto che sia ‘pratica’, ancor di più sul definirla ‘elegante’. Si tratta dello script basato su MooTools (demo) creato da David Walsh per emulare le sliding labels ottenute via jQuery (demo).

Come si vede, l’effetto consiste nel rendere animate la label associate ai campi di un form, label che scivolano fuori dal campo stesso nel momento in cui esso riceve il focus.

La mia opinione però conta poco. Cosa ne pensate?

Tags:

Categoria: Scripting | Permalink | Commenti (11)

Sui misuratori di vulnerabilità delle password

Venerdì 8 Gennaio 2010 - 12:45

di Cesare Lamanna

SicurezzaScripting

Non so se esistono studi sull’uso (e sulla percezione) da parte degli utenti dei sistemi di avviso sulla vulnerabilità delle password create al momento dell’iscrizione ad un sito. Di certo non sono pochi quelli che ritengono tali sistemi inutili se non obbligano l’utente a seguire schemi precisi nella definizione delle password che vadano al di là del semplice numero minimo di caratteri.

Mi chiedo poi quanti, di fronte ad un messaggio che mette in guardia rispetto alla debolezza di una certa combinazione, modificano la stessa fino ad ottenerne una considerata sicura dal sistema. Personalmente lascio sempre quella che inserisco, a prescindere dal feedback che ricevo, cerco sempre cioè di combinare sicurezza e usabilità della password anche se il risultato finale non corrisponde ai criteri definiti da chi gestisce il meccanismo di iscrizione.

Nonostante ciò, non metto in discussione la funzione positiva di questa soluzione (mettere in guardia, consigliare è comunque apprezzabile sempre quando si parla di sicurezza). Sarebbe però utile, a mio avviso, che il feedback non si limiti alla classica misurazione basata sull’uso di colori (in genere dal rosso al giallo al verde) o di termini chiave come ‘vulnerabile’, ‘media’, ’sicura’, etc.: accanto a questi ’segnali’ andrebbero fornite anche precise istruzioni che guidino in maniera esplicita l’utente all’adozione di pattern complessi e considerati sicuri. Un po’ come è possibile fare con il plugin Password Strength Meter per jQuery (demo).

Tags:

Categoria: Sicurezza, Scripting | Permalink | Commenti (9)

Una select editabile

Venerdì 8 Gennaio 2010 - 08:15

di Cesare Lamanna

ScriptingWeb Design

Trovo che alcune soluzioni Javascript in cui mi imbatto quasi quotidianamente siano molto simili ai celebri sei personaggi di Pirandello eternamente alla ricerca del loro autore. Nel caso che ci riguarda da vicino la ricerca potrebbe essere quella di uno scenario di utilizzo.

Lo script in questione è questa select editabile che è possibile realizzare grazie a un apposito plugin per jQuery. Ecco la demo.

In buona sostanza, il plugin fa sì che una normale select con le sue belle opzioni venga sostituita da un input di testo editabile che però continua ad emulare il funzionamento della select. Di fatto, è possibile a questo punto selezionare un valore tra quelli predefiniti o modificarne uno o crearne uno ex novo e poi passare all’invio del modulo. Non mi soffermo qui nei dettagli su quelli che non so se definire bug o limiti (che magari più che dello script sono della mia capacità di coglierne la logica di funzionamento). Una buona sintesi delle possibili osservazioni è presente tra i commenti al post di presentazione.

Il punto è: in che contesto d’uso una simile soluzione potrebbe essere utile, accettabile, consigliata, etc.? Quali accorgimenti trovare per rendere manifesta all’utente la duplice funzione di select/campo di testo modificabile? L’unico appiglio che trovo tra il già visto è l’ibrido select/box di ricerca del sito Giraffe Restaurants di cui parlammo in questo post. In quel caso, almeno, mi pare che a livello di comunicazione della funzione il problema sia stato affrontato brillantemente.

Tags:

Categoria: Scripting, Web Design | Permalink | Commenti (9)

Cose insopportabili

Mercoledì 16 Dicembre 2009 - 08:47

di Cesare Lamanna

Web Design

Ho appena rivisto la mia personalissima classifica delle cose fastidiose, inutili e assurde avvistate sul web.

Svetta ora al primo posto la geniale idea di certi siti che raccolgono testi per canzoni sui quali viene impedita la selezione del testo, presumo per stroncare sul nascere la malsana idea di compiere il criminale gesto del copia e incolla. Esempio. Ma dico, ma come si fa…

Tags:

Categoria: Web Design | Permalink | Commenti (19)

Selezionare la data

Martedì 1 Dicembre 2009 - 08:53

di Cesare Lamanna

Web Design

A cosa serve un date-picker? A selezionare da un calendario la data da inserire nel campo di un form, si sarebbe portati a dire. In realtà credo che dal punto di vista dell’usabilità la cosa debba essere così posta: è un’alternativa all’inserimento manuale di una data nel campo di un form. Piccola esperienza personale appena vissuta.

Vado sul sito della compagnia aerea Vueling per prenotare un volo. Il modulo è a prima vista quello consueto per questa tipologia di siti. Mi appresto a selezionare la data di partenza e clicco sull’icona del calendario. Nulla, l’unica cosa che ricevo in risposta è la gif che indica il caricamento in corso. Aspetto un minuto, niente. Poco male, mi dico, la metto manualmente la data. Ma cosa scopro? Che è impossibile! Il campo di testo è praticamente bloccato, il click attiva il calendario.

Quale fosse il motivo del problema non lo so, né mi importa saperlo, avevo fretta e poi mica posso fare un debug per prenotare un biglietto aereo. Mi sono rivolto ad altri. Io ho perso una ventina di euro. Loro 200.

screenshot

Tags:

Categoria: Web Design | Permalink | Commenti (12)