Simone Volpini » Web

Diatech Pharmacogenetics

Simone — Tue, 27 Dec 2011 07:00:42 +0000

Cliente: Diatech Pharmacogenetics S.r.l.

In collaborazione con la Bimind S.a.S. è stato realizzato il nuovo sito web per la Diatech Pharmacogenetics, azienda che si occupa di ricerca farmacogenetica, la disciplina che studia la risposta individuale ai farmaci in base alle mutazione genetiche di ogni singolo paziente.

Il design dell’interfaccia grafica del sito web, realizzato dalla The Best Raffaello, è stato studiato per permettere la corretta navigazione del sito oltre che per PC e tablet, anche per dispositivi mobile (smartphone). Ho realizzato le pagine in HTML5/CSS3 facendo uso di 1140 CSS Grid per poter rendere l’intero sito web adattabile a qualsiasi risoluzione dei monitor o display.

Tutto il sito multilingua è gestibile in completa autonomia dal cliente, grazie all’uso del CMS proprietario che ne semplifica la gestione delle pagine, foto ed allegati.

Tecnologie: HTML5, CSS3, PHP, MySQL, Javascript (JQuery)

Web Design The Best Raffaello

Diatech Pharmacogenetics is a post from: Simone Volpini

Igienstudio

Simone — Mon, 28 Nov 2011 07:21:04 +0000

Cliente: Igienstudio S.r.l.

Igienstudio è un’area scientifica al servizio delle aziende e degli enti per la consulenza, progettazione, scelta e controllo delle tecnologie a tutela dell’ambiente, della sicurezza nei luoghi di lavoro e dell’igiene degli alimenti.

Il sito web è stato realizzato in collaborazione con Luca Celli, Project Manager, e The Best Raffaello per il web design.

Per il progetto si è fatto uso del CMS proprietario per semplificare la gestione, da parte del cliente, dei contenuti delle pagine (testi, immagini e allegati).

Igienstudio is a post from: Simone Volpini

Former Worlds

Simone — Wed, 19 Oct 2011 14:11:50 +0000

Cliente: Former Worlds

Da un’idea di Stefano Dominici del Museo di Storia Naturale di Firenze, formerworlds.com è una guida per vedere come la terra e le forme di vita si siano evolute nel tempo.

Il progetto è stato realizzato in collaborazione con Ilaria Mauric e permette la navigazione del pianeta per ere geologiche con la possibilità di consultare video, gallerie fotografiche e animazioni di alcuni siti geologici e le loro variazioni rispetto alle precedenti ere.

Ho costruito un CMS su misura che permette al cliente di gestire i contenuti testuali e multimediali (video Vimeo e oggetti Adobe Flash) in base alle singole ere geologiche ed il tutto viene poi visualizzato su una personalizzazione di Google Maps, che permette di visionare e muoversi all’interno delle 13 mappe, una per ogni era geologica.

Web design: Ilaria Mauric

Former Worlds is a post from: Simone Volpini

Sito web Compendium.it

Simone — Thu, 09 Jun 2011 21:35:01 +0000

Cliente: Compendium S.r.l.

Lavoro: realizzazione del sito internet istituzionale dell’azienda Compendium S.r.l.

Questo lavoro è il primo progetto realizzato in collaborazione con due nuovi partner, Kontagio e Ilaria Mauric.
Compendium è un’azienda di consulenza per le imprese che vogliono ottimizzare i costi e le spese aziendali per settori come trasporti, imballaggi, telefonia ed energia.

Mi sono occupato della realizzazione delle pagine in XHTML e CSS e dell’installazione e personalizzazione del CMS proprietario per rendere autonomo il cliente nella gestione della sezione news del sito.

Tecnologie: XHTML, PHP, MySQL, Javascript

Comunicazione e contenuti: Kontagio
Web design: Ilaria Mauric

Sito web Compendium.it is a post from: Simone Volpini

Siti web con immagini di background adattabili a qualsiasi risoluzione

Simone — Fri, 10 Dec 2010 13:58:59 +0000

Una tecnica molto utilizzata nei siti web consiste nell’inserire un’immagine di sfondo di forte impatto visivo, che possa andare a coprire l’intero background del sito indipendentemente dalla risoluzione del monitor o dalla dimensione della finestra del browser.

Si utilizza un’immagine di grandi dimensioni, per esempio 1920×1200 pixel che è una delle risoluzioni maggiori che possiamo trovare nei monitor più recenti di 21 o 24 pollici, che possa coprire l’intero schermo. Mentre il contenuto principale del sito continua a rimanere in una “gabbia” di dimensioni inferiori (generalmente 960 pixel di larghezza), per assicurare la perfetta visibilità anche in quei monitor che supportano la risoluzione minima di 1024 pixel di larghezza (presente anche nei più recenti netbook con monitor a 10 pollici).

Di solito l”immagine viene gestita tramite i CSS e inserita come background del tag :

body { background: url(immaginedisfondo.jpg) no-repeat 0 50% #fff }

immaginedisfondo.jpg sarà posizionata come sfondo della pagina, rimarrà centrata orizzontalmente (0 50%) e quando il contenuto della pagina è superiore alle dimensioni dell’immagine e comporta uno scroll verticale per leggerne i contenuti, lo sfondo assumerà il colore bianco #fff.
Con questo tipo di posizionamento ci assicuriamo che la parte centrale dell’immagine sia sempre visibile a tutte le risoluzioni, con l’inconveniente che a risoluzioni inferiori (1024 pixel) non vedremo una parta ampia della foto.

Per ovviare a questo problema si può utilizzare un’altra tecnica che rende adattabile la dimensione della foto alla risoluzione della finestra del browser permettendo così di avere sempre una visione completa dell’immagine.
Prendendo spunto dall’articolo e dagli esempi segnalati da Julius Design, si inserisce l’immagine all’interno dell’HTML con lo specifico tag img

e poi si assegna il seguente stile CSS:

img.bg {

position: fixed;

top: 0;

left: 0;

width: 100%;

min-width: 1024px;

z-index: -9999;

}

che posiziona l’immagine sullo sfondo (position: fixed; z-index:-9999) con una larghezza che si adatta alla finestra del browser (width: 100%). L’immagine rimarrà sempre proporzionata perché non abbiamo dato nessun vincolo all’altezza.
Il min-width serve per bloccare il ridimensionamento della foto quando la finestra del browser assume dimensioni inferiore ai 1024 pixel.

P.S: non funziona con Internet Explorer 6 (IE6).

Siti web con immagini di background adattabili a qualsiasi risoluzione is a post from: Simone Volpini

Zend_Pdf, creare file pdf in PHP (1)

Simone — Wed, 11 Aug 2010 12:44:26 +0000

Nella realizzazione dei siti web, può capitare di dover creare dei file in formato PDF direttamente con il codice PHP, per esempio per realizzare moduli d’ordine per un e-commerce o schede tecniche di articoli di un catalogo. Comunque creare pdf i cui contenuti siano prelevati dinamicamente dal database in modo da avere dei file sempre aggiornati con i dati recenti del sito (come nel caso di schede tecniche di prodotto).

Per realizzare i file in PDF si possono trovare diverse librerie. Nel mio caso ho preferito utilizzare quelle presenti in Zend Framework, le Zend_Pdf. Dopo aver scaricato e copiato le librerie nel vostro hosting (nel mio caso tengo la directory Zend nella root del sito) iniziamo a creare il file:

require_once ‘Zend/Pdf.php’;

Dopo aver incluso la libreria possiamo iniziare a creare la prima pagina del PDF in due modi: con una pagina bianca oppure partendo da un altro PDF esistente. Questo secondo metodo può essere molto utile perché così potremo inserire solamente i contenuti testuali senza dover realizzare la gabbia grafica che può essere realizzata in Indesign o con altri software grafici.

1° metodo: pdf con pagina bianca

$pdf = new Zend_Pdf();
$pdf->pages[0] = new Zend_Pdf_Page(Zend_Pdf_Page::SIZE_A4);

Abbiamo così creato una nuova pagina in formato A4. $pdf->pages[0] corrisponde alla prima pagina del PDF e possiamo creare le successive ripetendo il comando più volte:

$pdf->pages[1] = new Zend_Pdf_Page(Zend_Pdf_Page::SIZE_A4);
$pdf->pages[2] = new Zend_Pdf_Page(Zend_Pdf_Page::SIZE_A4);
….

2° metodo: pdf da altro file pdf da utilizzare come base

$pdf = Zend_Pdf::load(‘modello.pdf’);

In questo modo la nostra prima pagina avrà come sfondo il layout del file modello.pdf.
Se vogliamo creare le pagine successive con lo stesso modello, possiamo salvare subito il template su di una variabile per poi utilizzarla in fase di creazione delle altre pagine:

$template = $pdf->pages[0]; // salvataggio del template
$pdf->pages[1] = $new Zend_Pdf_Page($template);
$pdf->pages[2] = $new Zend_Pdf_Page($template);
….

Infine per salvare il nostro PDF

$pdf->save(‘mio_pdf.pdf’);

che nel nostro caso sarà formato da una serie di pagine vuote, bianche o con il pdf di base a seconda del metodo utilizzato.

I prossimi giorni vediamo come gestire i contenuti testuali.

Zend_Pdf, creare file pdf in PHP (1) is a post from: Simone Volpini

Bimind

Simone — Wed, 02 Jun 2010 21:29:29 +0000

Cliente: Bimind

Lavoro: realizzazione del sito web aziendale della Bimind S.n.c. specializzata nella progettazione e realizzazione di software gestionale.

Il sito è stato realizzato facendo uso del CMS Open Source Joomla che permette la completa gestione dei contenuti come testi, immagini e allegati. Sono stati inoltre installati e configurati i seguenti componenti:

Joom!Fish per la realizzazione del sito web in più lingue
noixACL per la realizzazione di aree riservate con la gestione avanzata di utenti o di gruppi di utenti

Tecnologie: XHTML, PHP, MySQL, Javascript (JQuery)

Web design: Eugenia Faini

Bimind is a post from: Simone Volpini

Nel mio piccolo ci provo anch’io …

Simone — Tue, 30 Mar 2010 07:30:12 +0000

… a far diminuire il numero di utenti di Internet Explorer 6.

Analizzando le statistiche di alcuni siti web realizzati, ho potuto notare che c’è ancora un folto numero di utenti che utilizza Internet Explorer 6 per navigare: in media, una percentuale che si aggira tra il 10% e il 20%. Nonostante si abbia la possibilità di aggiornarlo alla versione 8 gratuitamente, dopo il dichiarato abbandono da parte di YouTube (Google) e dopo il funerale ormai celebrato, c’è chi si ostina ad utilizzarlo regolarmente.

Ho così deciso di “scopiazzare” YouTube, che dai primi di Marzo si presenta in questo modo (solo per gli utenti di IE6 o versioni precedenti):

Quindi da oggi anche nel mio sito appare un messaggio simile.

Nel mio piccolo ci provo anch’io … is a post from: Simone Volpini

Dropbox e storage remoto

Simone — Mon, 01 Feb 2010 07:00:48 +0000

Da qualche giorno sto provando il servizio gratuito di storage remoto Dropbox, per archiviare o fare dei backup online dei vostri file e sincronizzarli fra più PC. L’utilizzo è veramente semplice sia per Windows che per Linux ed in versione free offre fino a 2GB di spazio di archiviazione.

Dal sito ufficiale scaricate Dropbox per Windows, Mac, Linux (.deb, .rpm o direttamente i sorgenti) o iPhone e procedete all’installazione. Per Linux, una volta completata la procedura di installazione, è necessario effettuare un nuovo login al sistema e poi dovrete far partire il programma che potete trovare sul menù principale sotto “applicazioni -> internet”.

Al primo avvio create un nuovo account indicando nome, email e password e scegliete la dimensione dello storage con taglio gratuito di 2GB, o da 50GB e 100GB a pagamento (a partire da circa 10 dollari al mese).

Completata la procedura verrà creata una directory Dropbox sul vostro PC e potrete iniziare ad utilizzare il vostro storage remoto. Avrete la possibilità di creare nuove directory o copiarvi dei file ed in maniera trasparente tutto il contenuto verrà automaticamente copiato anche sui server Dropbox.

Se avete un secondo PC, potete effettuare anche in esso un’installazione del software, indicando la vostra username e password in modo tale da utilizzare l’account precedente. Anche in questo caso verrà creata la nuova directory Dropbox sul vostro sistema e verrà automaticamente sincronizzata con il contenuto dello storage remoto. In questo modo potete trasferire o archiviare i vostri lavori, documenti, mp3 o film (spazio permettendo) in modo molto semplice tra casa e ufficio, senza perdere niente.

Dal sito web potrete sempre consultare e monitorare il vostro spazio ancora a disposizione, verificare tutte le operazioni eseguite (copia, cancellazione o creazione di file o directory) ed inoltre potrete condividere alcune directory con altri utenti iscritti al servizio Dropbox.

Ovviamente la sincronizzazione tra PC e i server Dropbox è legata strettamente alla dimensione dei file ed in particolare alla vostra connessione ad Internet.

Dropbox e storage remoto is a post from: Simone Volpini

Subissati

Simone — Tue, 01 Dec 2009 07:15:17 +0000

Committente: capolinea.it

Cliente: Subissati

Lavoro: sito web istituzionale dell’azienda Subissati di Ostra Vetere (AN) specializzata nella progettazione e realizzazione di case in legno, strutture e coperture civili e militari.

Il sito è stato realizzato facendo uso del CMS Capolinea@Interlink per semplificare la gestione, da parte del cliente, dei contenuti delle pagine (testi, immagini e allegati). Inoltre sono stati sviluppati alcuni componenti javascript (jQuery) per la realizzazione del menù e delle gallerie fotografiche dei progetti e della sezione news.

Tecnologie: XHTML, PHP, MySQL, Javascript (JQuery)

Web design: capolinea.it

Subissati is a post from: Simone Volpini