Dopo una lunga attesa, anche gli sviluppatori di Safari hanno implementato la validazione dei form basata su HTML5; si tratta di un aggiornamento che finalmente regala il supporto cross-browser a questa feature in grado di semplificare notevolmente il lavoro dei developer. Per il momento parliamo di una novità limitata alla Technology Preview 19 dell'applicazione di Cupertino, ma la strada che porterà Safari a recuperare questa lacuna nei confronti degli altri browser è stata ormai tracciata. (more...)

Continua a leggere HTML5 e validazione dei form, cosa cambierà

Categoria: Web Standards

Tags: ,

Recentemente mi sono chiesto, anche sull'onda di quanto già  fatto da sviluppatori stranieri, è come mai si ha paura ad osare di più con i CSS. Un campo di indagine su cui ho svolto molti test sono i form. Ho cominciato nel 2006 ed ho continuato fino ad oggi. Sostanzialmente, con i form si può osare di più, anche alla luce del fatto che non sempre i risultati sono così difficili da ottenere. Mi sono chiesto: perché non cercare di riprodurre il layout della modulistica cartacea anche sul web? Non sarebbe interessante avere dei form che assomiglino in tutto e per tutto al loro originale cartaceo? Visto che si sta andando verso una progressiva digitalizzazione del cartaceo, non sarebbe utile presentare all'utente un layout a lui/lei già  familiare? (more...)

Continua a leggere Form sperimentali con i CSS

Categoria: CSS

Tags: ,

jQuery Tools si è nel tempo guadagnata l'attenzione di molti sviluppatori come ottimo complemento a jQuery per la creazione di interfacce. La libreria si presenta infatti come un set di componenti pronti per l'uso e personalizzabili dedicati all'implementazione di pannelli a tab, elementi con scrolling dei contenuti, overlay e tooltip. La novità  principale di questa versione 1.2 consiste nell'aggiunta di un nuovo modulo destinato alla creazione e alla validazione di form. La via scelta è stata quella di HTML5. Come si può verificare dalle demo, per i browser che li supportano i campi sono definiti usando gli attributi e/o i nuovi tipi di input previsti nella specifica (input a slider per l'inserimento di valori, ma anche campi per la selezione delle date). Garantita comunque anche la compatibilità  con IE6, anche se per il vetusto browser di Microsoft il look dei widget si presenta in una versione, come dire, lo-fi.

Continua a leggere Nuova release per jQuery Tools

Categoria: 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? The product seems to have a direct effect on making me more regular. Cheap generic levitra without prescription! Sixty-three percent, 74%, and 82% of the patients on 25 mg, 50 mg and 100 mg of our medications, respectively, reported an improvement in their health.

Continua a leggere La label é mobile

Categoria: Scripting

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.cialis next day delivery

Continua a leggere Una select editabile

Categoria: Web Design

Proseguendo nella sua carrellata sulle novità  di HTML5 in Dive into HTML5, Mark Pilgrim arriva a toccare l'argomento dei form. Il prerequisito è la conoscenza almeno sufficiente della lingua inglese, ma mi sento di dire che, essendo a posto da questo punto di vista, ciascuno potrà  trovare in quella pagina una chiarezza di esposizione davvero esemplare. Andando dritto al sodo, senza inutili complicazioni, Pilgrim presenta i nuovi tipi di input previsti dalla specifica, accompagnando il tutto con esempi, snippet di codice e tabelle per il supporto sui vari browser. Supporto invero al momento molto limitato, con l'eccezione di Opera (è l'unico browser, ad esempio, che supporta i nuovi campi di tipo datepicker) e dei browser basati su WebKit (Safari e Chrome). Su questo aspetto consiglio a tutti di soffermarsi sui paragrafi dedicati a campi come il nuovo input di tipo e-mail o quello specifico per gli indirizzi web o quello per i box di ricerca. In nessun caso sembrerebbe esserci differenza rispetto agli attualmente usati e comuni input di testo, ma se diamo in pasto il codice HTML5 ad un iPhone, allora le differenze si notano, per esempio quando si sta attenti a come il Melafonino modifica il layout della tastiera a seconda del campo che l'utente deve compilare. E così si capisce un po' meglio il perché della corsa al supporto di HTML5 e nuove funzionalità  (anche sperimentali) dei CSS3 da parte del team di sviluppo di WebKit. Tutto rivolto allo sviluppo di interfacce per iPhone. Almeno per ora. Intanto si sono portati avanti. bupropion sr in uk

Continua a leggere I form di HTML5

Categoria: Web Standards

Tags: , ,

"Un form non è altro che una lista di campi e delle corrispondenti label". Mi pare che possa essere questo l'assunto di fondo (magari discutibile) su cui si basa questo ultimo arrivato nella collezione dei framework CSS per la gestione di form. Si chiama RMSforms. Partendo da una struttura HTML in cui gli elementi che compongono il modulo sono rappresentati da li di una lista non ordinata, il CSS offre una serie di classi che applicate in combinazione ai vari elementi consentono la creazione di diverse tipologie di layout (si può per esempio scegliere se collocare la label a fianco del campo o in alto, se organizzare i campi stessi in senso orizzontale o verticale, etc). Per avere un'idea dei risultati ottenibili vi rimando alla pagina degli esempi. cialis order 5 mg

Continua a leggere Un altro framework CSS per la gestione dei form

Categoria: CSS

Tags: , ,

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. non-prescription cipro

Continua a leggere Selezionare la data

Categoria: Web Design

Tags: ,

Caro form…

25 Nov

Il link è come tanti, solo quel Web 2.0 sparato lì e che sa ormai di vecchio (ricordate quando pure l'aria che respiravamo era 2.0?): Acid.JS Web 2.0 Component Library. Diamo un'occhiata. La libreria serve ad applicare skin ai form, non a questo o quell'elemento, serve a dare un look and feel coerente a tutto il modulo. Segnalare o non segnalare? Uhmmm... forse non è il caso, 'ste skin non mi paiono poi così strepitose. Intanto giocherellando con la rotellina del mouse arrivo al footer: The Lite version of Forms.JS is displays a trial message at the top of the page, the client methods for enable, disable and toggle of form controls are disabled, and is shipped with three skins only. The full version is fully functional, does not display any trial messages and comes with the full set of 12 skins.cialis discount prices Urca! Lite? Trial? Full? Dov'è il trucco? Risaliamo. Buy via PayPal: USD20. Segnaliamo, segnaliamo. Commentiamo?

Continua a leggere Caro form…

Categoria: Scripting

Tags: ,

Credo che Facebook (vedi screenshot qui sotto) sia uno dei pochi siti che all'atto della registrazione non richiede il doppio inserimento dell'indirizzo e-mail (se è per questo nemmeno della password...). La prassi del doppio inserimento, per quanto la si possa trovare noiosa, ha una sua ragion d'essere, su questo non si discute. Cià non toglie che possano essere individuate delle alternative che non vadano ovviamente a rinunciare al controllo dell'utente su quanto inserito nel form. Un alert in forma di testo rosso che segnala a chi compila il modulo quanto ha scritto. O altre variazioni sul tema in varie posizioni e con modalità  invero molto particolari. Vale davvero la pena in questi casi tentare nuove strade? C'è qualcuna delle soluzioni proposte che vi convince?

Continua a leggere Alternative al doppio inserimento dell’indirizzo e-mail

Categoria: Web Design

Tags: ,