Sul sito dedicato al progetto (http://shop.vinooo.it) trovate tutti i dettagli della soluzione proposta.

Per i produttori di vino non ci sono più scuse. Da oggi vendere il vino online è facilissimo!

I numeri cominciano a diventare pesanti.

Per chi ancora non l’avesse capito, oggi tutti usano internet e molti lo fanno per acquistare online.

Non avere un sito ben fatto, aggiornabile e ben indicizzato oggi è assolutamente penalizzante per qualsiasi attività, sia essa industriale o commerciale.

E il futuro è abbastanza ben definito: gli acquisti online sono in forte crescita e sarà sempre più importante essere presenti con il proprio negozio anche online.

Altrimenti si rischia di perdere anche l’unico mercato in crescita che è rimasto!

Aprirai il tuo nuovo negozio online in 20 giorni!

Questo ne è un esempio:

Con una semplice regola nel foglio di stile (CSS) è semplice controllare la largezza massima che possono avere le immagini inserite nel contenuto degli articoli.

Basta identificare la classe o l’ID delle immagini utilizzando Firebug (con Firefox) oppure il Webkit inspector (con Chrome o Safari)

Nel caso di una installazione di un sito realizzato con WordPress molto probabilmente il selettore CSS sarà
.size-full{}

Un volta identificato il selettore corretto basta aggiungere queste regole:
height: auto;
max-width: 640px;
width: auto;

Il risultato finale è questo:

.size-full{
height: auto;
max-width: 640px;
width: auto;
}

L’altezza dell’immagine viene ridimensionata proporzionalmente alla larghezza che viene a sua volta scalata alla larghezza massima indicata dalla regola max-width

Questa semplice regola fa in modo che l’immagini si adatti da sola alla larghezza massima impostata dal webmaster.

Il risultato finale è questo:

Ma c’è una controindicazione. L’immagine viene visualizzata con largehzza ridotta e non altera il layout della pagina ma il file visualizzato ha comunque le dimensioni del file originale.

Per capirci se incorporo nel testo una file da 2048px di larghezza, questa regola fa in modo che il file venga visualizzato ridimensionato ma viene comunque utilizzato il file di grandi dimensioni.

Quindi è preferibile adottare questa tecnica quando le immagini vengono gestite da chi sa cosa sta facendo. Altrimenti si rischia di avere pagine visualiizate corretamente ma di dimensioni di download spropositate!

Consiglio: per evitare questa situazione, c’è un utile plugin che limita la dimensione massima delle immagini caricate, ridimensionando quelle che troppo grandi. Il plugin è estremamente utile per controllare autori poco attenti!

Poi quando si mettono i testi definitivi regolarmente capita che qualcosa è troppo lungo e quindi bisogna troncarlo o rivedere i testi.

Ecco come possiamo fare per “accorciare” i titoli troppo lunghi.

<?php echo substr(the_title('','',0),0,24) . " ..."; ?>

Si inizia inserendo alcune semplici informazioni anagrafiche e poi, in base alla scelta del tipo di preventivo richiesto, cambia le informazioni da inserire.

Ovviamente questo è un configuratore molto semplice ma la stessa tecnologia (jQuery, Php e Mysql) può essere utilizzata per configurare anche prodotti molto più complessi.

Potete visualizzare il configuratore collegandovi a questa pagina: http://www.kopronenergy.com/v2/?page_id=173

Ma riuscire a farlo servono competenze specifiche che non tutti hanno.

Rivolgiti ad un professionista qualificato, con una lunga esperienza in grado di portare il tuo sito in cima ai motori di ricerca.

Non perdere altri clienti che stanno cercando proprio te!

Il cliente di questo progetto è una solida azienda che vende sorpresine (sì, proprio quelle kinder!) e articoli da collezionismo. Prima di conoscerli pensavo che le sorpresine fossero cose da bambini ma mi sono dovuto ricredere. Stiamo parlando di un catalogo con 33.141 articoli, tutti catalogati e arricchiti con fotografie e descrizioni dettagliate. Quindi una mole di informazione notevole, una solida e consolidata architettura software già abilitata alla vendita online che ha precluso fin da subito la possibilità di rifare il sito ex novo.

Ma c’era un piccolo problema.

Il problema

Il problema del cliente era un problema estetico, di web design. Il sito aveva una grafica realizzata qualche anno fa con le tecniche che si utilizzavano qualche anno fa ovvero principalmente tabelle HTML nidificate.

L’esigenza era di rinnovare il sito internet mantenendo il più possibile l’architettura software preesistente. Inoltre serviva anche un logo legato al nuovo nome scelto dall’azienda.

Si partiva da questa situazione

Restyling di un sito web - Non solo sorpresine prima

I player in campo

In questo caso i miei riferimenti per il progetto erano due:

• il cliente per le scelte di carattere grafico
• lo sviluppatore per la parte di backend e integrazione delle modifiche all’interno della preesistente architettura software

La partita

Il progetto si è svolto così:

• Ideazione di un logo semplice e facilmente riconoscibile. In questo caso è stato utilizzato un semplice logo testuale, fresco e informale.
• Sviluppo dell’animazione principale che caratterizza l’intestazione del sito. E’ stata realizzata utlizzando jQuery e un suo interessante plugin che si chiama fisheye.
  Questo ha permesso di dare movimento al sito lasciandolo leggero e facilmente indicizzabile da parte dei motori di ricerca
• Definita l’animazione sono passato alle prime bozze tenendo come colori di riferimento il blu e l’arancione
• Successivamente il cliente ha optato per una soluzione più chiara scegliendo il verde, il bianco e l’arancione.
• Ho realizzato una pagina tipo con intestazione, menù, corpo pagina e piè di pagina. All’interno del corpo pagina sono stati impaginati 8 box contenti le sorpresine in “vetrina”
• Tutto il nuovo layout è stato realizzato esclusivamente con fogli di stile css per facilitarne l’implementazione all’interno del software preesitente.
• Una volta approvata la pagina base, sono state realizzate tutte le altre pagine, sempre utilizzando per l’impaginazione i selettori css
• Il risultato finale sono state 6 pagine con contenuti presi dal sito vecchio, un file css e una cartella immagini per le classi css
• In una settimana circa, il nuovo volto del sito è stato inserito nell’architettura software preesistente

Il risultato finale

Il risultato finale (che per la verità è ancora in corso di perfezionamento) potete vederlo qui: http://www.nonsolosorpresine.it

Restyling di un sito web - Non solo sorpresine dopo il restyling

Nuovo sito internet per la Macelleria Maggio, storica macelleria in Milano. Con il sito promuoverà la sue specialità e i prodotti dell’azienda agricola a conduzione familiare sulle colline piacentine.

http://www.macelleriamaggio.it

Il sito dopo la pubblicazione è stato un po’ rivisto nella grafica dal gestore dell’evento che ne ha praticamente stravolto la grafica.

http://www.music4aid.it