Archivi categoria: Web Design

Adobe Creative Cloud: recensione

Pubblicato il da
Rispondi

Adobe Creative Cloud
Vi postiamo qualche schermata del Cloud di Adobe, che ha, dalla versione CS6, fornito ai propri clienti questo nuovo sistema di licenza, che permette, a fronte di una spesa mensile, di usufruire di tutti gli applicativi, sia desktop che mobile, della software house californiana.

Appena effettuato il login, la schermata si presenta così:

Cliccando in alto su Applicazione e Servizi, si accede all’elenco degli applicativi installabili in locale sui PC/MAC dell’utente.
Chiariamo, poichè le spiegazioni in merito da parte di Adobe non sono di primo acchito chiarissime, che Creative Cloud permette l’utilizzo di tutti i software Adobe e di uno spazio web da 2gb espandibile: ogni applicazione sarà poi scaricabile in locale, installabile ed utilizzabile senza alcun bisogno di linea internet disponibile.

Adobe Dreamweaver CS6
Ci sono alcune succose novità per quanto riguarda Dreamweaver.
La prima è quella di poter creare, con un semplice click, un layout fluid grid style ( o tradotto in italiano, Layout a griglia fluida ): attraverso l’utilizzo delle colonne di riferimento poste sul background, è possibile indicare al CSS quale layout avrà nelle 3 configurazion principali: smartphone, tablet e desktop.

Dreamweaver andrà, sulla base delle vostre indicazioni, a generare un CSS utilizzando le media query, ossia indicando quale grafica dovrà avere ogni singolo elemento nelle visualizzazioni diverse. Questa tecnica è alla base del responsive design, ossia il realizzare una grafica che sia “responsiva” del device che si sta utilizzando: avremo quindi una grafica diversa ma controllata a seconda che si stia navigando con un PC fisso, un tablet oppure uno smartphone, lavorando sulla dimensione in pixel della laghezza della finestra.

Accanto alla possibilità di lavorare in maniera automatica ( ma fino ad un certo punto ) con le fluid grid, c’è l’integrazione con jQuery Mobile e Phonegap, progetto open source acquisito proprio da Adobe. Si potrà, con pochi click e previa registrazione ai servizi online di Phonegap, esportare il proprio progetto mobile in vari formati contemporaneamente ( iOs, Android, Blackberry, WebOS e Symbian ).

 

Aprire un file JSON con la console Firebug

Pubblicato il da
Rispondi

Ogni tanto, navigando, mi capita di imbattermi in sviluppatori e web designer che non riescono, durante il loro lavoro, a superare il problema degli errori javascript delle proprie pagine web.
Viene da se che realizzare siti, scrivere javascript, senza usare una console di debug, è un attività un po’ surreale.
Firefox, nonostante a mio avviso non sia il miglior browser, da ad ogni sviluppatore uno strumento portentoso, con il quale debuggare e andare oltre vari errori, soprattutto se jQuery e javascript sono il vostro pane quotidiano, come il sottoscritto. Proprio in occasione del parsing dei tweet che arrivano da Twitter, Firebug è uno strumento fondamentale per capire come il browser sta interpretando i vostri script.
Partiamo dall’account di twitter del sottoscritto, @alemussini, e immaginiamo di dover pubblicare sul proprio sito gli ultimi 20 tweet. Semplice? Si, no, dipende. Dipende dalla vostra conoscenza degli strumenti che sono a vostra disposizione, gratuitamente, sul web. Certo che se utilizzate esclusivamente IE per debuggare i vostri siti, fatevi qualche domanda.

Innanzitutto, procuratevi Firefox e successivamente Firebug qui.
Una volta installata, avrete la vostra bella iconcina in alto a destra. Quando caricherete la prima pagina, probabilmente la console non sarà ancora attiva. Cliccate sull’icona di Firebug per attivare la console ed, eventualmente, ricaricate la pagina.
Poniamo il caso di voler esaminare l’indirizzo http://search.twitter.com/search.json?q=from%3Aalemussini&rpp=20, che non è nient’altro che il JSON degli ultimi miei 20 tweet.

Come vedete, la console ha caricato correttamente il file search.js, e vi da molte informazioni a riguardo. Chiaramente il suo funzionamento è ampiamente spiegato nel sito di Firebug, quindi procediamo speditamente a consultare quale sia il funzionamento che mi serve.

Nel tab Net, cliccando sul nome del file GET search.json, mi si apre un sottopannello, con tutte le fino sui parametri di callback, sulla cache e, dulcis in fundo, sul JSON generato. Bello vero?



Avete tutte le variabili a vostra disposizione, cosi come il sottoalbero della variabile results, dentro la quale ci sono i 20 tweet che ho richiesto nell’url sopracitato.
Ora non vi resta che ricavare con una chiamata AJAX da JQuery ( o come volete voi ) il vostro elenco e scriverlo in pagina sul vostro sito.
Non sapete come fare neanche questo? Ma come no!
Nei miei prossimi post vedrò di analizzare passo passo anche questi aspetti, perchè quello che può sembrare logico per alcuni, non lo è per altri.
Un altro ambito abbastanza misterioso è il mondo di Sencha e ExtJS, che permettono di fare delle web app spettacolari, ma la curva di apprendimento è veramente ripida, e l’inizio può sembrare veramente frustrante.