Oggi ho ricevuto la ma prima reflex, la collaudatissima Canon 450d con 18-55 IS in kit, la reflex entry-level di Canon per eccellenza.

Per qualche anno ho usato compatte, bridge e affini e mi sembrava il momento di fare il primo passo nel mondo della Fotografia con la F maiuscola.

Dopo mezz’oretta di utilizzo, eccitato come un bambino col giocattolino nuovo, ecco le mie impressioni a caldo, in ordine sparso…

Read more »

Come molti di voi sapranno Google mette a disposizione per la maggior parte dei propri prodotti una serie di strumenti per sfruttarne le potenzialità nei nostri progetti.
Google Maps non fa eccezione e ci fornisce tutti gli strumenti (API) per sfruttare le mappe di Google nei nostri siti tramite Javascript.

Una delle funzionalità più utili è quella di poter calcolare il percorso ottimale per raggiungere un determinato luogo, ottenendo tutte le indicazioni sulle svolte e sulle strade da percorrere. Non molti sanno che queste funzionalità sono a disposizione degli sviluppatori per integrarle nei propri progetti, ed è proprio ciò che faremo.

Demo

Read more »

Una delle ultime tendenze del web è l’utilizzo di sfondi semitrasparenti. Per ottenere questo effetto non è sempre necessario ricorrere alle PNG trasparenti ma è possibile anche tramite i fogli di stile.

La proprietà che andremo ad utilizzare è l’opacità, che è possibile impostare tramite il parametro opacity: 0.5. Il numero, variabile da 0.0 a 1.0, indica il grado di opacità, dove lo zero corrisponde alla trasparenza e l’uno alla piena visibilità. Per impostare quindi uno sfondo semitrasparente è possibile utilizzare questa proprietà associata ad un colore di fondo. Non possiamo tuttavia utilizzarla direttamente nell’elemento che vogliamo rendere semitrasparente, perché l’opacità influisce direttamente anche sul testo, a scapito della leggibilità. Per risolvere il problema sono sufficienti un paio di DIV in più.

Demo

Read more »

I primi strumenti per il web designer sono carta e matita, che permettono di annotare rapidamente le idee senza gettarsi subito su Photoshop. Il foglio bianco però non ci da l’idea delle dimensioni precise e dell’aspetto generale all’interno del browser.
Per questo ho realizzato una semplice cornice da stampare, grande quanto una schermata a 1024×768 e con un’utile griglia 10×10 pixel. In questo modo è possibile avere un riferimento che ci permette di essere meno approssimativi.
Spero possa tornarvi utile nei colloqui con clienti o nelle riunioni del vostro team!

Guardando i video degli interventi al FOWD di New York ho trovato molto interessante quello di Dan Mall, che esplora il concetto di progressive enhancement in un senso più ampio, aggiungendo ai concetti classici di content, style e behaviour l’elemento experience, e cioè l’aspetto più emotivo.

In quest’ottica infine mostra come Flash possa essere un elemento importante che può contribuire a tutti i livelli di separazione, non solo a quello estetico, mantenendo sempre valido il concetto di progressive enhancement.

Potete seguire il video all’indirizzo:
http://www.viddler.com/explore/carsonified/videos/105/
Mentre le slides sono disponibili qui:
http://www.slideshare.net/danielmall/the-experience-layerfowd-nyc-08-presentation

Visitando il sito Apple Store è possibile vedere all’opera un interessante funzionalità che permette lo zoom delle foto direttamente nel loro spazio, senza aprire fastidiosi popup.

Grazie a jQuery e la sua estensione jQuery UI è possibile realizzare il medesimo effetto in maniera semplice. In particolare andremo ad utilizzare il plugin "draggable" di jQuery UI.

Demo

Read more »

Il formato grafico PNG è estremamente interessante. La possibilità offerta dal supporto alle trasparenze è sicuramente la caratteristica più utile. Purtroppo solo gli ultimi browser supportano questa proprietà, e in particolare soltanto a partire da Internet Explorer 7 per quanto riguarda il browser di Microsoft.

Esiste comunque la possibilità di abilitare le trasparenze PNG anche per Internet Explorer 6 e precedenti attraverso vari plugin basati su javascript. In certe occasioni però l’effetto potrebbe servirci per solo un’immagine ed andare ad aggiungere javascript per così poco può essere superfluo.

In realtà tramite CSS e commenti condizionali possiamo intervenire utilizzando le stesse tecniche utilizzate dagli script javascript disponibili. E’ infatti possibile utilizzare i filtri inclusi in IE, in particolare "AlphaImageLoader", per ottenere il medesimo effetto.

Read more »

In questo passaggio del tutorial a CodeIgniter vediamo finalmente l’elemento del framework che si occupa della logica dell’applicazione, e cioè il controller. Come vedremo questo elemento è quello che viene eseguito direttamente dall’utente ed è ciò che mette in comunicazione i dati (e cioè i modelli) con l’output (le viste).

CodeIgniter infatti, tramite la classe Routing, si occupa di leggere l’URL digitato e indirizzare all’apposito controller il metodo da eseguire. Ad esempio, digitando l’indirizzo http://www.dominio.com/index.php/nome_controller/nome_metodo/ CodeIgniter andrà a richiamare il controller nome_controller ed eseguirà il metodo nome_metodo. Se invece viene omesso nome_metodo verrà richiamato il metodo di default chiamato index.

Read more »

Il footer, per definizione, è quell’elemento che chiude la pagina e si pone alla fine dei contenuti. Quando però il contenuto è più corto dello spazio disponibile a video – il viewport – il footer si “solleva” dal bordo inferiore della pagina, lasciando uno spazio più o meno grande al di sotto di esso. L’effetto in certi casi può essere poco gradevole, dando l’impressione di un layout “tagliato a metà”. Potete vedere qui un esempio…
Read more »

Grazie a questo articolo ho scoperto due software estremamente utili per webdesigner e sviluppatori.

Il primo, Sequel Pro, è un client desktop per gestire i database MySQL tramite un’interfaccia più comoda rispetto al consueto phpMyAdmin. E’ estremamente semplice da usare, basta inserire i dati di connessione e abbiamo subito la possiblità di visualizzare le tabelle, modificarne i campi, eseguire query ed esportare-importare dati da xml e csv. Potete scaricarlo al seguente indirizzo: http://www.mjmedia.com.au/sequel-pro.html.

Il secondo è invece è un’utilissima applicazione per effettuare screenshot dei siti web. Il funzionamento è semplicissimo. Basta inserire l’indirizzo della pagina e premere “Capture!”: il software si occupa di generare un’immagine dell’intero sito, dall’header al footer. Si chiama Paparazzi e si trova all’indirizzo http://www.derailer.org/paparazzi/.