Spritebox è un servizio gratuito che permette di generare il codice CSS per usare immagini in siti web con la tecnica Sprites.

Avevamo visto in passato la tecnica CSS Sprites che consiste nel caricare una singola immagine e spostarla con l’ausilio di codice CSS al fine di aver una sola richiesta, allegerendo la pagina e velocizzandone la visualizzazione.

Dal punto di vista dei CSS, tutto consiste nell’usare la proprietà background-position per visualizzare l’area dell’immagine che ci interessa.

Una volta creata la nostra immagine singola con tutti gli elementi grafici, ci basterà caricarla dal pannello e selezionare le porzioni da rendere visibili.

Avremo a disposizione un pannello nel quale oltre a caricare l’immagine, avremo la possibilità di prelevare il codice CSS e visualizzare alcuni paramentri come altezza, larghezza, ripetizione e ingombro.

Grazie all’uso del mouse e da tastiera potremo selezionare con perfetta precisione i nostri elementi su sfondo millimetrato e generare il codice CSS.

Utilizzare e conoscere servizi gratuiti, che ci permettono di ottimizzare i tempi di sviluppo è uno degli aspetti fondamentali per un web designer.

Author

Sono un Creative Strategist con più di 10 anni di esperienza in strategie digitali. Il mio ruolo di Stratega consiste nell’ideare e sviluppare concept creativi per progetti multicanale, individuando le attivazioni e dinamiche di Marketing da applicare attraverso un approccio strategico.

5 Commenti

  1. Conoscere gli strumenti giusti è il primo passo per ottimizzare il proprio lavoro! Sante parole Julius continua così!

  2. sante parole!Mattia ha scritto:

    Conoscere gli strumenti giusti è il primo passo per ottimizzare il proprio lavoro! Sante parole Julius continua così!

    il guaio magari è che possono essercene parecchi e chi ne sa poco di webdesign si scoraggia facilmente e lascia perdere le buone cose.

Commenti