Progettare per il web: Fireworks o Photoshop?
Qual è il programma migliore per il web design, Photoshop o Fireworks?
Ultimamente mi è capitato spesso di imbattermi in questa domanda e di sentire i sostenitori dell’uno o dell’altro illustrare le potenzialità del proprio programma preferito.
Il mio parere è un po’ discordante, in quanto credo sia riduttivo sceglierne uno privandosi delle ottime potenzialità dell’altro.
La soluzione migliore potrebbe essere quella di lavorare con entrambi i programmi, anche sullo stesso progetto, selezionando con cura le operazioni che ci conviene fare con Fireworks e quelle che dobbiamo necessariamente fare con Photoshop.
Oltretutto i programmi della Creative Suite interagiscono molto bene tra loro, sono stati pensati proprio per lavorare in sincronia.
Proviamo a porre la domanda in termini diversi: nell’ambito web design quando è conveniente utilizzare Fireworks e quando Photoshop?
Un po’ di storia
Per trovare la risposta dobbiamo fare un piccolo salto indietro nel tempo.
Nel lontano 1990 i fratelli Knoll crearono la primissima, giurassica, versione di Photoshop. Era talmente giurassica che stava tutta dentro un floppy e girava solo su Mac (o meglio Macintosh).
I fratelli Knoll erano figli di un fotografo, e crearono questo programma per il fotoritocco e la manipolazione delle immagini.
Col passare degli anni l’Adobe si rese conto dell’enorme importanza che stava assumendo Internet, così iniziò ad ampliare Photoshop con molte funzioni dedicate ai grafici che lavoravano sul web.
Fireworks, invece, fu pensato e realizzato appositamente per il web.
Fu lanciato da Macromedia nel 1998, e nel 2005 fu acquisito dall’Adobe che lo perfezionò e lo incluse nella Creative Suite 3.
Negli anni Photoshop si è evoluto moltissimo, ad oggi è un programma estremamente completo e flessibile che ci consente di spaziare in maniera intuitiva dal fotoritocco alla grafica tradizionale, dalla grafica “cartacea” al web design.
Non c’è nulla che non possiamo fare con Photshop, e forse proprio per questo può risultare dispersivo in alcune circostanze.
Dividiamo i compiti
Fireworks è ottimizzato per il web, questo significa che non ha rivali nel caso in cui dobbiamo salvare delle immagini per il web o dobbiamo esportare un layout.
Inoltre è ottimo per realizzare piccoli elementi grafici, loghi, interfacce e layout molto semplici.
Photoshop, invece, si rivela indispensabile se dobbiamo lavorare su delle foto, manipolare delle immagini, ma anche se dobbiamo realizzare un layout un po’ più complesso, magari con dei giochi di pattern, brush e texture.
All’interno di uno stesso progetto possiamo decidere, ad esempio, di disegnare il layout con Photoshop ma creare i pulsanti con Fireworks, salvare il lavoro finito in psd ed esportare con Fireworks.
Le principali caratteristiche di Fireworks
Quali sono i punti forza di Fireworks che lo rendono differente dai programmi utilizzati solitamente per il web design?
Innanzitutto abbiamo a disposizione una serie di strumenti avanzati per gestire in maniera efficiente elementi bitmap e vettoriali, anche all’interno dello stesso documento.
È un po’ come se l’Adobe avesse sintetizzato in unico programma le più importanti funzionalità di Photoshop e di Illustrator nell’ambito della grafica per il web.
Altra caratteristica interessantissima è il pannello delle proprietà, che ci consente di avere sotto controllo tutti i parametri di ogni singolo oggetto, e di gestirli comodamente in un’unica finestra.
Nel pannello degli stili abbiamo a disposizione una serie di preset da applicare ai nostri oggetti per gestirne l’aspetto con un semplice click.
Inoltre possiamo creare i nostri stili personali, raggrupparli in librerie e riutilizzarli tutte le volte che vogliamo.
Possiamo gestire i tracciati in maniera semplice e intuitiva: grazie ad una serie di strumenti e funzionalità avanzate possiamo ottenere tracciati complessi in pochissimi click, anche senza utilizzare il pennino di Bezier.
Il fiore all’occhiello di Fireworks, però, sono gli strumenti per l’esportazione, altamente ottimizzati per il web.
Oltre al fatto che Fireworks ci permette di ridurre notevolmente il peso delle immagini pur mantenendo un’eleveta qualità, ci mette a disposizione degli ottimi strumenti per sezionare i layout e per ottimizzare e personalizzare l’esportazione.
Ci sono anche delle funzionalità che dovrebbero aiutarci a produrre codice xhtml/css, alcune delle quali sono strettamente collegate a Dremweaver.
Ma su questo punto preferirei sorvolare in quanto sono un’amante del codice scritto a mano.
E tu utilizzi Fireworks, Photoshop o preferisci lavorare con entrambi?
46 commenti
Trackback e pingback
-
Articoli settimana 26/02/2012 | Saverio Gravagnola
[...] per il web: Fireworks o Photoshop? (Your Inspiratione [...]





Io uso Photoshop, ormai anche per una questione di abitudine, in accoppiata con Illustrator quando serve.
Penso, però, che la migliore ottimizzazione del peso delle immagini di Fireworks non sia determinante quando esistono strumenti come http://punypng.com/ o http://www.jpegmini.com/ che raggiungono risultati migliori sia di PS che di FW.
Ciao Francesco, sicuramente è bene utilizzare gli strumenti che conosciamo meglio e con cui ci sentiamo più a nostro agio.
Jpeg mini è ottimo, anch’io lo utilizzo spesso.
Ciao Giovanna, bellissimo articolo:)
Io ho sempre utilizzato photoshop per tutto, Fireworks è li ma ricordo d’averlo aperto solo 2 volte (la prima volta per vedere com’era l’interfaccia, la seconda per sbaglio). Più che altro non ne ho mai capito la funzione, ho letto un po in giro ma sono sempre arrivato alla conclusione che facesse le stesse cose che fa photoshop.
Comunque quasi quasi ora gli do un occhiata.
Anche il mio Fireworks è rimasto abbandonato nella Cretive Suite per moltissimo tempo, ma da quando l’ho scoperto non l’ho più lasciato!
Ho sempre utilizzato Photoshop, e non mi ero mai posto il problema di sfruttare anche le potenzialità di Fireworks. Credo sia proprio giunto il momento di utilizzarli entrambi. Corro ad installarlooooo!
Facci sapere come ti trovi!
Lavoravo su Fireworks quando era Macromedia ed esportava i siti in “slice” con le tabelle… che orrore a ripensarci adesso! Ora faccio tutto con Photoshop e prediligo il codice scritto di mano mia ad ogni modo :)
Bell’articolo, complimenti!
Grazie Giuseppe!
Già, a ripensarci adesso fa uno strano effetto.
La funzionalità di Fireworks per il codice credo sia la meno interessante, per la grafica web è un’ottimo programma, ma per il codice servono ben altri strumenti!
Per un periodo ho usato Fireworks, giusto per fare un paio di layout, devo dire che il pannello delle proprietà è una vera manna dal cielo, permette di ridimensionare ogni elemento in qualsiasi momento, invece che andarlo a ritoccare a mano come in Photoshop.
Non dimentichiamo inoltre la possibilità di creare”pagine master” da utilizzare come tempate per le varie pagine del sito e la possibilità di vedere tutto in modalità live, con effetti di rollover, navigazione ecc… ma ci vorrebbe ben più di un articolo per evidenziare le caratteristiche di Fireworks, consiglio a tutti di dargli una bella occhiata perché può ridurre di molto i tempi di lavoro.
Il pannello delle proprietà è veramente geniale!
Un altro punto a favore di fireworks rispetto a photoshop è la possibilità di creare immagini png32 che photoshop anche nell’ultima versione non permette di fare!! Ripropongo qui anche un articolo che illustra le potenzialità di fireworks rispetto a photoshop: http://www.reinegger.net/50_reasons_not_to_use_photoshop_for_webdesign.html
Grazie per la condivisione dell’articolo Marco, appena ho 5 minuti lo leggo!
Io ho diviso sempre gli usi, all’inizio quando ho conosciuto fireworks mi rifiutavo di usarlo, facevo tutto con photoshop, ma poi ho capito…fireworks per la manipolazione e la gestione di layout per un sito web, ma anche piccolo oggetti grafici è il massimo, veloce e versatilissimo…ovviamente il codice scritto a mano :D
La penso esattamente come te Marky! ;)
Per mia esperienza personale Fireworks è molto più versatile per tracciare un layout, in quanto ha lo strumento porzione che, da un certo punto di vista, ti evita troppe menate. Poi passo a Dreamweaver e definisco il tutto.
Con Photoshop ottimizzo al meglio tutto il resto dei contenuti bitmap utilizzando “salva per web” per alleggerire, senza troppa perdita nel dettaglio le immagini.
In ogni caso photoshop lo utilizzo dal lontano 1991 con il mio primo Mac II cx ed è ancora, secondo me, il programma di gestione raster per antonomasia.
Comunque i due, a seconda del progetto che devi realizzare, si equivalgono.
Buon lavoro!
Lo strumento Porzione è comodissimo! ;)
Bell’articolo.
Insegno Photoshop da un po’ di anni e credo non abbia degna concorrenza.
Sia per il web che per la stampa Photoshop riesce a fare ritocchi strabilianti.
Unica pecca della CS5.5, se non si ha un buon processore ed una buona RAM, è la pesantezza.
I 32bit sono un altro punto a sfavore, ma direi bypassabile per cosa offre in generale.
Fireworks è ottimo per il web, i ritagli e l’esportazione in HTML, ma trovo logico ripulirlo di codice sporco rendendo ancora meglio la presentazione del lavoro web.
Grazie Monica!
In effetti Photoshop è il programma più completo e performante. Fireworks lo considero più un’ottimo alleato per i progetti web.
L’esportazione in html non l’ho mai usata, quindi non saprei pronunciarmi.
C’è anche Gimp troppo potente e free. Cmq uso preferibilmente fireworks.
Per i siti codice a mano o CMS
Sinceramente non ho mai usato Gimp, l’ho anche installato sul pc ma non l’ho mai aperto ^_^”
Pur essendo un devoto di Photoshop (e lo sarò a vita) devo ammettere che in fase di ottimizzazione, per quanto mi riguarda, Fireworks è completo e parecchio efficace…Uno strumento che merita di essere conosciuto meglio del suo fratello fortunato.
Giusto Giovanni, diciamo che si completano a vicenda
“La soluzione migliore potrebbe essere quella di lavorare con entrambi i programmi, anche sullo stesso progetto, selezionando con cura le operazioni che ci conviene fare con Fireworks e quelle che dobbiamo necessariamente fare con Photoshop.” Racchiude quello che penso anche io, frutto del tempo passato con l’uno e con l’altro.
Ho sempre usato solo Photoshop prima di iniziare a lavorare in agenzia. Qui usavano Fireworks e quindi ho dovuto imparare a conoscerlo e ad apprezzarne le funzionalità. Non nego che preferisco Photoshop, ma penso solamente per una questione di abitudine, però se posso li uso “incrociati”. Le funzionalità di gestione pagine, di “copia-incolla” e di esportazione di Fireworks sono decisamente più web-oriented ;)
Sicuramente bisogna usare anche Photoshop in un progetto, a meno che non si tratta di qualcosa di molto semplice.
La vera forza sta nell’abbinamento di questi due ottimi programmi.
Uso Fireworks da tempo e credo che é molto + agile di Photoshop sotto molti aspetti.
Le linee, shape etc…si fanno molto piú velocemente.
Photoshop é molto pesante quando si arriva a tenere file grandi, cmq per me Photoshop é e resta un sw speciale x le immagini e gli effetti…ogni cosa per il suo uso.
Hai ragione Perla, utilizzando ogni programma per il suo uso specifico ci semplificheremo la vita ed otteremo migliori risultati nella metà del tempo!
Leggendo l’articolo, e il paragrafo sulla storia, mi viene in mente con nostalgia,
la prima volta che ho installato Photoshop su un PC 486 con 4 MB di ram.
Era la versione 2.5 per win 3.1, disponibile su 7 dischetti floppy.
Era il 1993 !
La mia scheda video gestiva solo 256 colori, poichè aveva 512 KB di ram video !
HD da 210 MB, un’enormità mi pareva.
Che bei tempi : (
I mitici floppy! A parlarne ora ora sembra di rievocare l’era delle caverne ;)
Heylà Giovanna,
io anche ho sempre visto i due programmi come due specializzazioni differenti, uno più orientato alla fotografia/stampa, l’altro orientato al web (ragion per cui è nato) e difatti li sfrutto a seconda delle finalità. Sopratutto per la creazione di sfondi/sfumature png preferisco usare firework che è più rapido ed inoltre la possibilità di salvarli come png fireworks permette di effettuare modifiche molto più rapidamente e immediate.
Ma ci sono sicuramente altre utilità che non ho avuto di sperimentare ancora per cui mi affido ai prossimi articoli :D
Già, la comodità di Fireworks sta proprio nell’ottimizzazione dei tempi!
Per i prossimi articoli cercherò di fare del mio meglio ;)
Io sono a favore dell’utilizzo di entrambi gli strumenti, Photoshop è un must, quello che si fa con photoshop non si fa con nessun altro software…fireworks è un ottimo fratello minore per il web design ;)
Esatto Ciro, sono due ottimi alleati
un buon articolo..tempo fa ne leggevo uno simile…ma mai iniziato a veder fireworks come parte per creare un semplice html per web..però magari per salvare a pesi minori alcune immagini si… si potrebbe studiarlo meglio!
Uso Fireworks dal 2002 e devo dire che mi ci sono sempre trovato benissimo. Chiaramente ad oggi per comodità utilizzo molto di più photoshop. Insieme sono un connubio perfetto potremmo proporre il FIRESHOP.
Ahahaaah Fireshop Power!
Ciao Giovanna!
Bell’articolo complimenti: proponi una discussione e degli spunti interessanti!
Personalmente ho scoperto Fireworks in passato: ottimo già da allora per ottimizzare immagini e disegnare layout. Dopo ho scoperto Photoshop: impareggiabile nel fotoritocco ma a mio parere un po’ pesante per impostare una pagina web, parlo di qualche anno fa.
Di recente ho ripreso la passione per il web design, e visti i costi non proprio abbordabili dei prodotti Adobe ho scoperto Gimp: per il mio livello ora va più che bene, ci si può fare tutto ed è estensibile in tutti i modi. Certo la differenza con un prodotto professionale come PS si sente comunque!
Ultimamente molti propongono FW per il wireframing, ricordo bene la comodità dei simboli e delle librerie. Da poco ho provato Balsamiq e secondo me svolge splendidamente quella parte.
Magari più in là tornerò verso Adobe, l’esperienza e la completezza dei prodotti è difficile da imitare! ;)
Ciao Guido,
non conoscevo Balsamiq, l’ho appena installato e sembra davvero interessante!
Ora ci gioco un po’, grazie per la dritta! ;)
Io ho iniziato con Photoshop, ma poi sono finita a collaborare con un’agenzia che usava Fireworks e non l’ho più abbandonato. :)
Per la creazione di layout web batte sicuramente Photoshop, per questo lo uso. Quando però devo gestire o modificare delle immagini mi trovo meglio con Photoshop (o Lightroom, se le foto le ho fatte io e quindi ho i Raw).
Ho fatto anche due lezioni a riguardo alle prime della Naba, una in cui dovevano creare un layout in Photoshop e l’altra in cui invece usavano Fireworks, proprio perché volevo sapere da loro con cosa si erano trovati meglio… indovinate chi ha vinto? :)
Sinceramente trovo assurdo che illustrator non venga neanche tenuto in considerazione nell’articolo. Fireworks è vero nasce per il web, ma essenzialmente è per i principianti. Photoshop, nonostante sia utilizzato da tantissimi grafici del web, è un software di fotoritocco, per il web design viene sfruttato si e no al 10% e ti ritrovi in mezzo ad un mare di setting e strumenti fuorvianti, oltre ad avere una gestione basica del vettoriale. Per me la base è illustrator, photoshop solo per i raster, fireworks personalmente neanche lo considero.
Ciao Dj, sinceramente non ho nominato Illustrator in quanto questo articolo è scaturito da un dibattito a cui mi è capitato di assistere spesso ultimamente, nel quale ci si interrogava appunto su quale fosse il programma più indicato per il web design tra Fireworks e Photoshop.
Questi due programmi infatti, nell’ambito della grafica per il web, hanno aree di competenza molto simili che spesso si sovrappongono.
Photoshop è nato per il fotoritocco, ma ha moltissimi strumenti che permettono di creare dell’ottima grafica raster, così come Fireworks, anche se quest’ultimo permette di lavorare anche sul piano vettoriale in maniera estremamente comoda e “immediata”.
Il dibattito verteva su questo.
Ovviamente Illustrator è nato per il vettoriale, come Photoshop è nato per il fotoritocco. E’ sicuramente ineguagliabile per illustrazioni, loghi, o elementi vettoriali piuttosto complessi. Ma se dobbiamo creare un semplice web-element può risultare anch’esso dispersivo.
Poi ognuno ha le sue preferenze ed è libero di lavorare con i programmi con cui si trova più a suo agio.
Su una cosa però devo dissentire: Fireworks è più snello dei fratelli maggiori Photoshop ed Illustrator perchè è stato progettato per rendere più semplici e immediate alcune operazioni di routine, è ottimizzato per fare determinate cose e permette di risparmiare un mucchio di tempo. Dire che è un programma per principianti è un tantino riduttivo.
Assolutamente d’accordo con Pupixel
@ DJ, se gente del calibro di Andy Clarke, Molly Holzschlag, e altri li definisci principianti…..
Una curiosità personalissima, mi piacerebbe sapere quanti di voi che hanno postato sono muniti di licenza per il GRANDE Photoshop?
Io lavoro nel campo della grafica e web design. Ho sempre usato photoshop perchè in passato si era sempre fatto così.. adesso sto studiando con FW per giocarci un po’ e riuscire ad integrare i due programmi e sfruttarli al meglio. (La molla è stata l’incubo di dover cambiare a mano lo stile di ogni pulsantino o elemento in tutti i psd XD )
Quello che vi chiedo è:
- in pratica, cosa consigliate/sconsigliate di fare in FW (noi non facciamo layout molto semplici)
- meglio partire in FW e creare alcuni elmenti in PS o viceversa?
- ho letto che FW rasterizza o elimina gli smart object… ci sono altri intoppi del genere a cui stare attenti?
Grazie mille!! :)
PS. Dato ceh la grafica è il nostro core business noi siamo muniti di regolare licenza per i prodotti Adobe… anche se ho sentito dire in effetti che è uno dei prodotti più crackati.
Ciao Ju, in linea di massima puoi realizzare un layout completo in Fw, a patto che non si tratti di qualcosa di troppo elaborato. E’ perfetto per lo stile web 2.0, ma puoi ottenere buoni risultati nella maggior parte dei casi.
Se devi realizzare qualcosa di più elaborato, ad esempio con un utilizzo notevole di textures o spennellate varie, allora è il caso di ricorrere all’aiuto di Ps.
Non c’è una regola fissa su come gestire il lavoro, devi valutarlo a seconda dei casi.
Ad esempio, se in un progetto devi realizzare uno sfondo molto elaborato e manipolare alcune immagini da inserire in un layout abbastanza semplice, ti converrà costruire l’intero layout in Fw e soltanto lo sfondo e il ritocco alle immagini in Ps.
Viceversa, se devi realizzare un layout in stile vintage con varie sovrapposizioni di textures, invecchiare tutte le foto, fare un collage di immagini ecc.., allora ti converrà impostare tutto il lavoro in Ps e magari realizzare i pulsanti in Fw.
Dopo le vacanze mi piacerebbe scrivere alcuni articoli per approfondire proprio questo argomento, ossia come lavorare al meglio interagendo con Ps e Fw, prendendo il meglio da ciascuno di questi programmi.
Grazie mille per la risposta!
Aspetterò con ansia l’articolo allora :)