Grafica  »  Guide  »  Guida Fireworks 

Ottimizzazione e preparazione per l'esportazione (III parte)



Rimangono da preparare i documenti relativi ai cinque continenti.
Apriamo europa.png. Anche qui impostiamo le stesse linee guida usate per corpo.png (orizzontali a 20 e 295 pixel, verticale a 155). Prepariamo poi le porzioni per la barra:

Dimensioni Posizione Nome
155x20
X = 0, Y = 0
barra_alto
155x30
X = 0, Y = 20
barra
155x20
X = 0, Y = 190
(sotto l'ultimo pulsante)
sfondo
155x85
X = 0, Y = 210
(sotto la porzione sfondo)
via2
155x10
X = 0, Y = 295
barra_basso

Alle porzioni corrispondenti ai pulsanti daremo i nomi dei pulsanti sempre tenendo conto delle regole da usare per l'attribuzione dei nomi ai file.

Il resto della pagina (tutta la parte bianca) dovrà servire per scrivere testo o inserire delle tabelle che potrebbero contenere le miniature delle immagini. Ma se esportiamo la pagina in questo modo Fireworks inserirà al posto dello spazio bianco una immagine e questo creerà dei problemi quando poi dovremo elaborare la pagina nell'editor HTML.

Il metodo a mio parere più semplice per risolvere il problema (non è l'unico, specialmente per chi ha una buona pratica con Dreamwever o con il codice HTML, ma è sicuramente quello che crea minori difficoltà ad utenti poco esperti e che consente di risparmiare più tempo in fase di modifica) è quello di tagliare il documento.
Scegliamo quindi Elabora > Area di lavoro > Dimensioni area di lavoro. Nella finestra di dialogo che si apre scegliamo come punto di aggancio quello in alto a sinistra e impostiamo come valore per la larghezza 155 pixel. Salviamo il documento.
Per le altre pagine il procedimento da ripetere è identico e si creano le stesse porzioni con gli stessi nomi (ad eccezione di quella chiamata "via..." a cui deve essere cambiato il numero ogni volta).
La porzione "sfondo" non avrà sempre la stessa posizione visto che viene creata dopo l'ultimo pulsante ma deve avere sempre la stessa altezza (20 pixel).

Nota per questi documenti è inutile impostare l'ottimizzazione per ogni singola porzione dato che saranno tutte uguali, nella prossima lezione vedremo che è possibile impostare un'ottimizzazione globale al momento dell'esportazione.

Ultimi articoli Grafica

Creare Testo 3D con Photoshop CS5

Creare una scritta sfruttando gli effetti tridimensionali...

Photoshop CS6: le novità più interessanti

Un'interfaccia rinnovata, semplificazione di comandi ripetuti,...

Digital painting con Photoshop

Creare illustrazioni digitali sfruttando la capacità del software di...

Forme e texture con Photoshop, creare una carta da gioco infuocata

Sfruttare forme vettoriali e texturing per ottenere un'illustrazione...

Attenuare rughe d'espressione e imperfezioni della pelle con Photoshop

Le tecniche per attenuare rughe d'espressione e imperfezioni della...

Altri articoli

Guide Grafica

Guida Photoshop CS5

Modifica e ottimizzazione dell'immagine, strumenti di disegno e...

Guida Photoshop CS4

Disegno, fotoritocco, effetti con Photoshop CS4: impariamo a usare...

Guida Paint Shop Pro

Paint Shop Pro è un celebre programma di fotoritocco,...

Altre guide

Newsletter @Grafica e Web Design

Ogni settimana, direttamente nella tua e-mail: guide, articoli, tutorial e FAQ su Web Design e grafica per il Web.

Iscriviti alla newsletter

Altre newsletter

Corsi in aula

Corso Google AdWords Base

25 Giugno 2012 a Milano
Disponibilità: 7 Posti

Corso Google AdWords Base

05 Giugno 2012 a Roma
Disponibilità: 7 Posti