Salve gente,
Mi stavo dilettando con photoshop a creare un layout per un sito. Ora, di norma, come si fa?
si fa tt la grafica e poi si ritaglia con il taglierino e si esporta? e se voglio modificare qualcosa devo ritagliare tutto?
quali altri trucchi ci sono?
forse è un pelino generica come domanda.. vabbè..
apri un file della larghezza del layout piu' un tot per parte
riempi il primo layer con quello che dovrebbe essere il colore di sfondo
aggiungi un layer
selezioni una parte che potrebbe essere il corpo del layout
aggiungi un nuovo layer
simuli... che ne so... un angolo particolare
etc layer dopo layer fino a quando ottieni la simulazione di una pagina vera e propria, ricordandoti di salvare man mano nel formato proprietario del programma che stai usando in modo da mantenere i layers separati
quando hai terminato, a seconda del tipo di layout, esporti le immagini che ti serviranno per decorare il codice nascondendo eventualmente layer che in quel momento non ti servono (spesso simuli il menu di navigazione, ma poi lo fai testuale, ad esempio... dipende, appunto)
se non sbaglio photoshop permette di esportare tutto il layout gia' ottimizzato per il web: credo che la scelta di come procedere dalla fine del layout in avanti sia strettamente legata al modo in cui creerai poi le tue pagine
un esempio pratico:
sulla sinistra vedi un layout simulato: ogni elemento sta su un layer differente; sulla destra vedi il layout pronto per essere tagliato (nascondo i layers che non mi interessano ed appiattisco gli altri) e bordate in rosso le sezioni che vado effettivamente ad utilizzare (per l'header, per il corpo e per il footer, via css: tutto il resto lo riproduco direttamente sul codice)
ma ci sono altre tecniche e molto dipende anche dal tipo di layout che vai a creare
:master:
insomma creo la grafica, poi tolgo tt tranne la base.. giusto?
taglio header footer e menù
e esporto.
il resto delle immagini come le esporto? e le aggiungo sull'html o tramite il css?
scusa, forse non mi sono spiegata: prima simuli il layout completo usando i vari layer e te lo salvi nel formato proprietario, poi dipende: a seconda delle tue conoscenze e del tipo di layout procedi; nel caso che ti ho postato a me sono sufficienti quei tre pezzi dell'immagine, ma se il layout fosse piu' complesso o anche solo diverso o non facessi uso dei css magari procederei in altro modo, ad esempio usando l'esportazione automatica di photoshopOriginariamente inviato da bako
:master:
insomma creo la grafica, poi tolgo tt tranne la base.. giusto?
taglio header footer e menù
e esporto.
il resto delle immagini come le esporto? e le aggiungo sull'html o tramite il css?
altri layout potrebbero non avere alcun bisogno di immagini, perche' hanno angoli dritti e non hanno ombre, ad esempio e nel mio caso lo rifarei completamente coi css
quali sono le tue conoscenze?
quali gli strumenti che usi normalmente per lavorare sul codice?
e soprattutto: qual'e' il layout che intendi ottenere?
ad esempio se dovessi riprodurre un layout come quello a sinistra, tutto quel che mi servirebbe sarebbe l'immagine dell'header e basta, mentre per quell'altro ritaglierei i due elementi bordati in rosso nell'immagine piu' a destra... dipende da caso a caso, appunto; di solito le parti che non riesco a riprodurre altrimenti, se devo dare una "regola"
hai gia' un'idea di cosa intendi realizzare?
dimile a questo: http://stefanot.altervista.org/grafi...e/grafica.htmlOriginariamente inviato da rebelia
scusa, forse non mi sono spiegata: prima simuli il layout completo usando i vari layer e te lo salvi nel formato proprietario, poi dipende: a seconda delle tue conoscenze e del tipo di layout procedi; nel caso che ti ho postato a me sono sufficienti quei tre pezzi dell'immagine, ma se il layout fosse piu' complesso o anche solo diverso o non facessi uso dei css magari procederei in altro modo, ad esempio usando l'esportazione automatica di photoshop
altri layout potrebbero non avere alcun bisogno di immagini, perche' hanno angoli dritti e non hanno ombre, ad esempio e nel mio caso lo rifarei completamente coi css
quali sono le tue conoscenze?
quali gli strumenti che usi normalmente per lavorare sul codice?
e soprattutto: qual'e' il layout che intendi ottenere?
ad esempio se dovessi riprodurre un layout come quello a sinistra, tutto quel che mi servirebbe sarebbe l'immagine dell'header e basta, mentre per quell'altro ritaglierei i due elementi bordati in rosso nell'immagine piu' a destra... dipende da caso a caso, appunto; di solito le parti che non riesco a riprodurre altrimenti, se devo dare una "regola"
hai gia' un'idea di cosa intendi realizzare?
sfondo e colori diversi, questo l'ho realizzato tagliando tt a mano con photoshop e eliminando le immagini in eccesso.
le conoscenze che ho sono discrete, uso la suite macromedia.
anzitutto farei un'ombra meno spostata di lato e meno evidente (diciamo v=0 o=0 e blur=5), poi creerei una gif con la parte segnata in verde su sfondo trasparente (solo la scritta, senza il bianco intendo) e del resto taglierei le tre immagini rettangolari (rosso, giallo, blu) + l'immagine per lo sfondo (viola) e le userei come sfondo per i div del layout
mmm.. che è il div del layout?
il layout, cioe' la struttura in html che contiene "i contenuti" (scusa la ripetizione), la si fa o a tabelle o a div: ecco, io uso div
fai tutto senza tabelle ergo.. :master: :master:Originariamente inviato da rebelia
il layout, cioe' la struttura in html che contiene "i contenuti" (scusa la ripetizione), la si fa o a tabelle o a div: ecco, io uso div
c devo provare..
Permessi di invio
Rispondi quotando