29/03/2011

Gimp: l'open source che ti aiuta a fare l'Header

Carissimi MyBlogger è giunto il momento di dare un tocco di carattere al vostro Blog, perché, come tutti sappiamo, il contenuto è fondamentale, ma anche l'occhio vuole la sua parte.

Iniziamo dunque questa serie di tutorial che vi guiderà nella personalizzazione del vostro spazio digitale per renderlo più accogliente e accattivante, più facile e piacevole da navigare.

Come prima cosa, se pensiamo al nostro blog come a un salotto dove ci incontriamo con i nostri amici per svolgere piacevoli conversazioni, dobbiamo decidere la forma della stanza la disposizione dell'arredo: per imparare a "customizzare" i vari elementi della pagina vi consigliamo di seguire i nostri tutorial nella sezione tips & tricks.

Ora, in questa prima puntata ci concentreremo sostanzialmente su come creare un bel cartello di benvenuto, ossia l'header che si trova in cima alla pagina, utilizzando un programma di grafica Open Source che possiamo scaricare gratuitamente dal web: stiamo parlando di Gimp.

Come prima cosa è necessario impostare correttamente le dimensioni del file immagine che vogliamo utilizzare come header (a proposito vi consigliamo di seguire il tutorial su come personalizzare l'header del blog)

Per farlo apriamo Gimp, creiamo un nuovo file e inseriamo altezza e larghezza in pixel dell'header...

imposta_immagineHeader_gimp.jpg

Clickando su OK si apre il nostro nuovo foglio e possiamo iniziare a sperimentare...proviamo a importare un'immagine o una nostra foto da utilizzare come sfondo dell'header. In questo esempio utilizzeremo una immagine presa dal sito http://www.freestockimages.org/ un'ottima fonte di immagini di qualità completamente free. Ecco un link all'immagine che abbiamo scelto: una interessante foto di un vecchio tronco d'albero.

Una volta che abbiamo deciso quale suggestione visiva vogliamo utilizzare per rappresentarci salviamola sul computer. Per modificarla in Gimp è sufficiente trascinare il file sull'area di lavoro che avevamo in precedenza impostato. Sulla destra possiamo verificare che nella finestra layer si è creato un nuovo livello contenente l'immagine che abbiamo importato.

layer_immagineHeader_gimp.jpg

Come potrete notare, dato che l'immagine è più grande dell'area del documento che abbiamo creato, una parte risulta nascosta perché eccede i limiti della pagina: a questo punto possiamo decidere di ridimensionare l'immagine per adattarla al nostro spazio utilizzando gli strumenti ruota, inclina, scala, ecc. presenti nella palette Strumenti oppure nella voce Immagine del menù a tendina in alto (tip: tenendo premuto CTRL mentre usiamo lo strumento Scala attiviamo l'opzione di scalatura proporzionale, per evitare distorsioni nell'immagine), oppure possiamo provare semplicemente a muovere l'immagine con lo strumento sposta (click e drag oppure freccette direzionali) per inquadrare una porzione specifica e dare un taglio più accattivante all'immagine. Vediamo i progressi fatti finora...

albero1_immagineHeader_gimp.jpg

Ora proviamo ad aggiungere una scritta. Possiamo farlo utilizzando lo strumento testo: comparirà la finestra dell'editor di testo di Gimp, scriviamo il testo desiderato e clicchiamo chiudi. Dopodiché potremo impostare il font, la dimensione e il colore del testo nel pannello strumenti.

textEditor_immagineHeader_gimp.jpg

 

Come tocco finale possiamo creare un nuovo livello cliccando sull'icona con la pagina bianca nella scheda Livelli confermare i parametri del nuovo livello e con lo strumento sfumatura (short-cut: L) sperimentare diverse possibilità per aggiungere profondità e appeal all'immagine. Se la sfumatura compromette la leggibilità della scritta sarà sufficiente trascinare il layer contenente la sfumatura sotto quello contenente il testo per invertire l'ordine di sovrapposizione e possiamo anche provare a giocare con la modalità di sovrapposizione dei livelli (che di default è impostata su normale) e la trasparenza.

Ultimo passaggio: salviamo con nome il file in formato Gimp per poterlo modificare in seguito, mentre per la pubblicazione sul web sceglieremo di salvarne una copia selezionando il "tipo file per estensione" e scegliendo JPG o PNG.

 

Ecco una semplice composizione realizzata utilizzando esclusivamente questi strumenti:

 

albero2_immagineHeader_gimp.jpg

 

Facile e d'impatto ;)

E voi cosa aspettate? Divertitevi a personalizzare il vostro blog per renderlo sempre più cool !!

 

11:16 Scritto da: myblog.it in Blog - Tips and Tricks | Link permanente | Commenti (0) | Trackback (0) | Segnala | Tag: gimp, tutorial, open source, header, personalizza blog | OKNOtizie | |  del.icio.us | | Digg! Digg |  Facebook

Trackback

L'URL per fare trackback su questo post è: http://redazione.myblog.it/trackback/3281473

Scrivi un commento

NB: i commenti di questo blog sono moderati.