Da qualche mese quando si parla di Javascript non si può fare altro che affiancargli AJAX, e trattare degli argomenti ad esso correlati. Sono moltissimi gli strumenti rilasciati per supportare questa tipologia di piattaforma, e moltissime sono le parole spese a riguardo.Tanto per non discostarci troppo dall'argomento, mi sento in dovere di spendere qualche parola a proposito di una libreria sviluppata in Javascript che permette di gestire filmati Flash senza dover toccare l'IDE Macromedia attraverso un'API molto facile e potente. La libreria in questione si chiama AFLAX, e sfrutta l'ExternalInterface di Flash 8 per fornirci un set di funzionalità  per il disegno vettoriale (e molto altro) da javascript. La libreria funziona bene, non ha grossi problemi di compatibilità  e le applicazioni demo introducono molto bene le potenzialità  di questo strumento. Che dire, speriamo che questa interessante tecnologia segua l'evoluzione di AJAX e cominci ad essere supportata e seguita dagli sviluppatori web.

Continua a leggere Gestire Flash da Javascript con AFLAX

Categoria: Scripting

Chi ha provato anche solo a giocare con Javascript per manipolare il contenuto di elementi HTML presenti su una pagina, sa che prima o poi ci si imbatte nel dilemma: usare innerHTML o ricorrere a metodi più eleganti e standard compliant?Credo che questo articolo apparso su SlayerOffice possa rappresentare un'ottima guida per fare la scelta giusta. Oltre ad essere pieno di riferimenti a risorse esterne di grande interesse, è ben strutturato nella presentazione degli esempi. Propone infatti una serie di situazioni o casi specifici e per ciascuno presenta fianco a fianco la soluzione basata su innerHTML e quella DOM-based. Un metodo in grado di far emergere chiaramente i pregi e i limiti di questa proprietà  introdotta a suo tempo da Microsoft.

Continua a leggere Alternative a innerHTML

Categoria: Scripting

'Menu' (senza accento sulla -u, vi prego!) è storicamente una delle chiavi di ricerca più usate su HTML.it, ma ultimamente l'ho vista perdere colpi nella Top 10. Interesse sfumato? Tutto già  visto, tutto già  sentito? A prescindere, io la segnalazione la faccio: DOMscripting powered Panel Bar (qui il post di presentazione, qui la pagina con l'esempio completo e il link allo zip da scaricare con tutto il codice e le immagini usate).

Continua a leggere Just another CSS/JS menu…

Categoria: Scripting

Tags: , ,

Jonathan Boutelle ha iniziato sul suo blog una serie di post dedicati agli AJAX Design Patterns, modelli di interazione basati su questo insieme di tecnologie in grado, rispetto al semplice HTML, di migliorare l'interfaccia di un sito o di risolvere specifici problemi di usabilità .Dopo il primo intervento dedicato ai Read/Write Div (le sezioni editabili come quella del meteto presente sulla home page personalizzata di Google), ha analizzato una soluzione relativa alla costruzione di un modulo di login/registrazione.Si tratta di quella implementata sul sito ZohoCRM, che pur non essendo 100% pure AJAX (non prevede nessuno scambio di dati con il server in modalità  asincrona), presenta comunque aspetti interessanti.Il problema è quello di conciliare il login degli utenti già  registrati con l'invito alla registrazione per i nuovi. Boutelle fa notare che, in genere, si sceglie uno tra due approcci alternativi:Privilegiare i nuovi potenziali iscritti ed evidenziare il form di registrazione, deviando gli utenti già  registrati su un'altra pagina per il loginPrivilegiare gli iscritti, fornendo agli altri un link ad un'apposita pagina di registrazione.Perché, a suo parere, l'idea di ZohoCRM funziona? Perché tiene entrambe le categorie sulla stessa pagina con una soluzione di semplicissima implementazione e senz'altro efficace.

Continua a leggere AJAX che funziona

Categoria: Scripting

Al termine della serie dedicata alle liste di definizione (prima e seconda parte), Alessandro Fulciniti ha proposto un piccolo esperimento: un menu per ristorante strutturato in HTML ricorrendo a questo particolare tipo di lista e definito nella presentazione con i CSS.Su TJKDesign, c'è invece un tutorial che spiega come creare una serie di FAQ con le liste di definizione e Javascript, usato per visualizzare e nascondere la risposta.

Continua a leggere Creare FAQ con le liste di definizione

Categoria: Scripting

Ho parlato poco tempo fa dello scrolling morbido con Javascript. Lo stesso effetto si può ottenere in orizzontale, e in Sliding Lists viene applicato a un mini-sistema di navigazione. Credo si tratti di una versione beta, e la compatibilità  è da verificare (per esempio non va con Opera 8.5), ma potrebbe essere un buono spunto.A proposito, dato che siamo in tema mi piacerebbe lanciare un piccolo sondaggio. Ho salvato tra i miei bookmark due siti che utilizzano lo scrolling soft orizzontale. Il primo è Biok: è fatto in Flash, ma è leggero e piacevole; il secondo è Beca: una singola pagina HTML, tre sezioni principali e un po' di Javascript che degrada perfettamente. Quale preferite?

Continua a leggere Scrolling soft orizzontale

Categoria: Scripting

Zimbra è una delle startup legate al cosiddetto Web 2.0 di cui più si è parlato negli ultimi mesi. La sua Collaboration Suite è stata da molti indicata come un modello della tendenza a distribuire il software come servizio web e dell'utilizzo di AJAX per la realizzazione di interfacce complesse, in grado di replicare l'esperienza del desktop.Ne parlo qui riprendendo questo post apparso sul blog della società . L'autore affronta il tema della pesantezza delle applicazioni AJAX, una cosa che può verificare chiunque abbia provato ad usare uno di questi servizi. Non c'è ovviamente da stupirsi se si pensa alla quantità  di codice Javascript che il browser deve caricare. Per Zimbra il peso di questo codice JS, senza compressione, è addirittura di 2Mbyte.La dieta suggerita per rendere l'applicazione più leggera e fruibile è questa:Combinare tutti i file JS in un unico file badando all'ordine di concatenazioneSottoporre il file ad un processo di ottimizzazine con jsmin per rimuovere commenti, spazi bianchi e righe eccedenti (il peso cala del 25/30%)Usare la compressione gzip sul mega-file (il peso questa volta cala del 300/400%)Il post si chiude con un esperimento fatto applicando queste tecniche alla home page di Digg. Da 199246 byte si passa a 70040, le richieste HTTP scendono da 26 a 13.

Continua a leggere Comprimere e ottimizzare Javascript

Categoria: Scripting

L'altro giorno stavo mostrando un prototipo ad una società  per la quale pensavo che AJAX potesse rappresentare un'ottima soluzione. Avevano la necessità  di validare molti form e di popolare textareas e combobox.Volevo allora mostrare come tecniche di remote scripting potevano fare al caso loro. Inserisco il cd con i miei prototipi e lancio i file HTML. Si apre Internet Explorer ma non succede nulla. Nessun file HTML fa quello che deve. Superati i primi secondi di panico chiedo di poter accedere ad Internet e mostrare qualcosa online.Solo a quel punto le cose erano più chiare. I sistemisti avevano disabilitato gli ActiveX nelle Security Settings.Questo banale equivoco mi ha fatto riflettere molto anche perchè non è la prima volta nella mia carriera che vado in una società  e trovo questo settaggio imposto dal reparto dei Sistemi Informativi. In questi scenari è d'obbligo percià fare un passo indietro e tornare a programmare il Remote Scripting con l'uso del vecchio buon IFrame.In fin dei conti, anche se l'oggetto XHR (XMLHttpRequest) espone la possibilità  di accedere agli headers ed ad altri dettagli del protocollo HTTP, a fronte di una maggiore compatibilità  sui browser l'uso dell'IFrame rappresenta ancora una scelta validissima.Nel caso, per esempio, di questa società  dovrà necessariamente perseguire questa strada.Leggiamo quotidianamente post del tipo : Ajax contro Flash, Ajax contro Coldfusion, Ajax contro Godzilla... Ma forse dovrebbe essere AJAX o IFrame per il Remote Scripting ?

Continua a leggere E se fosse AJAX contro il vecchio IFRAME

Categoria: Scripting

Avendo una conoscenza non approfondita delle tematiche relative all'accessibilità , non so se una cosa del genere possa essere davvero utile o semplicemente sensata. Mi limito a segnalare, allora, da questo post di Roger Johansson, due soluzioni che consentono all'utente di personalizzare a suo piacimento i tasti di accesso definiti dall'autore tramite l'attributo accesskey.La prima è una classe PHP (c'è pure la versione ASP) creata da Gez Lemon e Rich Pedley. La seconda (di Jacques Distler) è basata invece su Javascript: navigando fino al footer della pagina con l'articolo potrete verificare direttamente il funzionamento.

Continua a leggere Tasti di accesso personalizzabili

Categoria: Scripting

Negli ultimi giorni gli utenti che navigano con IE avranno notato il layout leggermente scombinato grazie ad una pagina senza titolo che punta al blog e compare nella sezione destra, ovvero quella dei link Technorati. Essendo i dati prodotti direttamente dalle API del servizio non è possibile intervenire con modifiche. Si tratta di un link con testo decisamente lungo e mentre in browser come Opera,Firefox e Safari questo sborda sulla destra della colonna senza influire sull'impaginazione, in IE ha il fastidioso effetto di allargare la colonna che occupa stravolgendo il layout.Di fronte a un problema, realizzare e valutare diverse soluzioni è una buona strategia e allo stesso tempo un buon modo per allenare la creatività . La prima soluzione è senza dubbio l'uso dei CSS: basterebbe una sola regola specificando la larghezza dei list-item che contengono i link "incriminati" e usando la dichiarazione overflow:hidden.C'è un'alternativa ai CSS: l'uso di Javascript. Si presenta senz'altro meno ortodossa dei CSS, ma è un buon esercizio di DOM scripting. (more…)

Continua a leggere Tagliare i link con testo troppo lungo

Categoria: Scripting

Tags: ,