Template per Splinder (Stile aperto)

« Older   Newer »
  Share  
view post Posted on 26/8/2008, 11:43
Avatar

LusHika { 7-3-08 }

Group:
La Co-Founder Psicopatica
Posts:
17,630
Location:
Namimori

Status:


Molti di voi si chiedono come fare per creare un template per splinder, c'è bisogno di sapere non solo la grafica ma anche l'html. tutta via questa che prepareremo adesso è la base, ovvero la grafica.

Si comincia!


Aprite il vostro programma di grafica, io uso Photoshop ma voi potete usare quale volete!
Scegliete una o più immagini da usare (se sono senza sfondo è meglio, in caso o le ritagliate o create qualcosa che possa farla star bene anche se è incompleta.
La selezionate e cliccate su copia



dopodichè scegliamo nuovo e creiamo un base layout di 800 di larghezza e 700 di altezza. (poi l'inutile lo tagliamo) e incolliamo l'immagine, al centro. Lo spostiamo dove ci va più a genio, a destra, al centro o a sinistra e le mettiamo uno sfondo (si preferisce omogeneo, siccome lo sfondo si ripeterà, perchè a volte anche i pattern non combaciano) ed io ho scelto un rosa chiaro, e ho sovrapposto qualche livello per dare un tocco di personalità all'immagine.



Ora lavororiamo con brushes e effetti carini sotto la ragazza (sullo sfondo), altrimenti è troppo spoglio!



E ora, iniziamo ad inserire le tabelle dove andiamo a scrivere! Ne farò 3, stile "Lolly Nanami", ma potete benissimo farne solo 2, eh! XD
Prendiamo lo strumento rettangolo o rettangolo arrotondato. Se avete Photoshop, assicurate di avere i parametri settati come qui sopra:



E ora, tracciamo i 3 rettangoli (userò quelli arrotondati che sono più carini) e siccome ci siete, potete fargli una traccia da 2 o 3 pixel oppure sfoppiare il livello e sposatrlo un pò, diminuendo l'opacità per fare l'effetto "ombra", come in questo screen:



e ora inseriamo le scritte! Metterò le classiche Me, My World e Other, ma voi metteteci quello che volete! E già che ci siamo infiliamo anche qualche scritta nell'immagine ina lto, come il titolo del blog, per esempio!
Ed il layout è finito!



Ma non è finito il lavoro. Ora serve fare il fondo! come? Semplice, basta seguire le mie spiegazioni!
Il fondo è la base che si deve ripetere, per farla basta selezionare la fine del nostro template (che DEVE essere omogeneo, ovvero di un colore UNICO che si deve ripetere. Non nel senso che dev'essere tutto rosa o tutto bianco, ma nel senso che dove sta rosa non ci devono stare disegni o scritte, dev'essere SOLO rosa, lo stesso per il bianco, poi per il grigio ecc. Devono essere solo pienamente di quel colore. Selezioniamo per cui la base sel template che come vedere comprende colori omogenei, e cliccate su modifica - copia elementi uniti.



dopodichè fate file - nuovo e settiamo le nuove impostazioni: l'altezza lasciamo quella che esce, che sarebbe l'altezza dell'elemento che abbiamo copiato, la larghezza peròno, se no si ripeterà. Io prima settavo 1024, però cambiando risoluzione dello schermo a 1280 ho notato che alla fine si vedeva la ripetizione, perciò penso che la via di mezzo buona sia proprio settarlo a 1280, che è una risoluzione buona. Ci sono persone con risoluzione più alta ma sono poche, per cui, come dicevo, settiamo la larghezza a 1280 e lasciamo l'altezza com'è.
E ora come fare?. Innanzitutto prendete il colore dello sfondo del layout (in questo caso rosa) e riempite questo nuovo file lungo del colore rosa, in modo che prenda appunto il colore dello sfondo.



E ora incolliamoci il nostro fondo. Lo incollerà al centro ma noi non dobbiamo MAI lasciarlo li, altrimenti chi ha la risoluzione bassa lo vedrà spostato a destra e gli appariranno le noiose barre scorrevoli. Per cui spostiamolo lievemente a sinistra, non di molto.



Ora salviamo con il nome di fondo o fondino o come preferite.
La Grafica è finita, adesso abbiamo tutti gli elementi per inserire l'html!




Tutorial e immagini © Kira.Lu & Natsu

 
Web  Top
~Natsu
view post Posted on 1/9/2008, 14:13




Grazie a questo tutorial ho fatto il template per il mio blog! Grazie Kira! *o*
 
Top
1 replies since 26/8/2008, 11:43   212 views
  Share