mantenere qualità

[aleritty]

Ciao a tutti!

Ho una domanda su una cosa che mi è capitata più di una volta nell'ultimo periodo!

Ho dovuto creare dei loghi per un paio di siti internet, cosa che ho fatto a partire da file vettoriali quindi senza problemi di dimensione!

Il fatto è che una volta esportato il file in gif, modificato con gimp ecc. ecc. io ho un file (tanto per fare un esempio) di 800x800px che è perfettamente identico al vettoriale!
Poi però essendo un logo da caricare on-line se lo riduco ad esempio a 200x200 mi compaiono un sacco di artefatti ed il logo diventa piuttosto "brutto"! Vedo però tutti i giorni loghi anche più arzigogolati sulle pagine web e non hanno questi artefatti e problemi!
Per essere chiaro linko un esempio:

Questo logo non era così "pixelloso" in qualità originale e non è nemmeno così piccola come immagine!

Come posso evitare questi problemi?

[Sandra Maria]

quando devi ridimensionare evita di partire da file gif che sono composti da un numero limitato di colori - nella scalatura il programmma avendo appunto un numero limitato di colori (palette ridotta del gif) a disposizione non riesce a generare il giusto antialiasing sul bordo dell'immagine - prova a rifare la medesima cosa partendo da un file jpg di buona qualità e poi successivamente salva in gif con numero colori limitato a ciò che necessario per avere una qualità accettabile


scusa modifico/rettifico
ho letto male prima
quanto sopra comunque vale lo stesso

se ho ben capito... stai salvando un file 800x800 in gif e poi lo utilizzi scalato 200x200 su una pagina html, dovresti invece preparare il tuoi file già della giusta misura per evitare quel problema di visualizzazione dovuta al ridimensionamento dell'immagine

[Arrakis]

Il problema risiede nel formato di esportazione.
Se vuoi mantenere la trasparenza, devi lavorare con un PNG.

[[P i X A R] 3D]

Il vettoriale ha il pregio, utilizzando vettori, appunto di essere scalabile.

Se lo esporti in formato Gif (ad esempio) e poi lo scali con un programma di fotoritocco (poi dipende dal software) è probabile che tu abbia l'effetto che citi.

Se hai il vettoriale, allora usalo.

[aleritty]

Ringrazio tutti!

quando devi ridimensionare evita di partire da file gif che sono composti da un numero limitato di colori - nella scalatura il programmma avendo appunto un numero limitato di colori (palette ridotta del gif) a disposizione non riesce a generare il giusto antialiasing sul bordo dell'immagine - prova a rifare la medesima cosa partendo da un file jpg di buona qualità e poi successivamente salva in gif con numero colori limitato a ciò che necessario per avere una qualità accettabile


scusa modifico/rettifico
ho letto male prima
quanto sopra comunque vale lo stesso

se ho ben capito... stai salvando un file 800x800 in gif e poi lo utilizzi scalato 200x200 su una pagina html, dovresti invece preparare il tuoi file già della giusta misura per evitare quel problema di visualizzazione dovuta al ridimensionamento dell'immagine

No, io parto da un file vettoriale (eps), però per lavorarci in gimp lo "importo", ci faccio le modifiche sopra ed infine lo salvo 200x200 (è solo un esempio eh...) in questa maniera vettoriale non lo è più ed il file è della corretta dimensione per la pagina, non lo faccio riscalare al browser!

Il problema risiede nel formato di esportazione.
Se vuoi mantenere la trasparenza, devi lavorare con un PNG.

Temo di non aver capito... Il problema non è sulla trasparenza dell'immagine quanto sulla qualità della stessa!

Il vettoriale ha il pregio, utilizzando vettori, appunto di essere scalabile.

Se lo esporti in formato Gif (ad esempio) e poi lo scali con un programma di fotoritocco (poi dipende dal software) è probabile che tu abbia l'effetto che citi.

Se hai il vettoriale, allora usalo.

I vantaggi del vettoriale li conosco, il problema è che in ambito web per fare un logo o un pulsante non credo di poter usare direttamente dei file eps o di altro formato vettoriale... (correggetemi se sbaglio!) Le compatibilità come sono?

Il mio problema è che se io faccio a mano un logo e poi lo rimpicciolisco (un po' come nel tuo esempio) a me non viene con lo stesso dettaglio di quello della NASA (della seconda riga) ma mi viene tutto sgranato e "brutto" come hai potuto vedere nell'esempio allegato! Di sicuro sbaglio qualcosa io nella procedura perchè tutti riescono... Ma non so precisamente cosa!

[[P i X A R] 3D]

Originariamente inviato da aleritty
I vantaggi del vettoriale li conosco, il problema è che in ambito web per fare un logo o un pulsante non credo di poter usare direttamente dei file eps o di altro formato vettoriale... (correggetemi se sbaglio!) Le compatibilità come sono?

Il mio problema è che se io faccio a mano un logo e poi lo rimpicciolisco (un po' come nel tuo esempio) a me non viene con lo stesso dettaglio di quello della NASA (della seconda riga) ma mi viene tutto sgranato e "brutto" come hai potuto vedere nell'esempio allegato! Di sicuro sbaglio qualcosa io nella procedura perchè tutti riescono... Ma non so precisamente cosa!

L'importante è ridimensionare in vettoriale ed esportarlo in formato bitmap già della dimensione da te prestabilita.

Che effetti devi applicare con the gimp?

P.S. in realtà, mi scuso se hai interpretato male la disposizione dei loghi da me postati.
La riga in alto è un logo ridimensionato sempre in vettoriale.
Sotto, sono da leggersi in verticale. Quindi alla tua sinistra hai un logo gif riidotto (dall'alto verso il basso) e all destra l'inverso, come scritto del resto, a lato.

[aleritty]

Ad esempio a questo in particolare ho aggiunto lo stetoscopio... Ma ogni volta è diversa!

Proverò a ridimensionare in vettoriale! E' che poi fare le modifiche con pochi pixel diventa menoso con gimp!

Non riesco a capire!

Cioè, se voi doveste realizzare da zero un logo come quello postato come fareste? Magari così capisco cosa sbaglio!

[[P i X A R] 3D]

Io, lo farei in vettoriale da zero:



Una volta realizzato, studierei il layout e la dimensione che deve avere, i colori di background e le sfumature.
Una volta stabilito su carta e codice le linee guida decido in che formato esportare il logo e che grandezza dargli, una volta fatto questo, esporto in formato (gif, jpg o png) direttamente dal vettoriale esattamente come il logo dovrà essere inserito nel sito tramite i css e/o l'html.

Ciao

[aleritty]

Devo farti davvero i complimenti!
Probabilmente per te non è stato niente di difficile, ma io con la tua immagine (che avrai creato con due colpi di mouse in 5 minuti visto il tempo della risposta) sotto non sto riuscendo a farla uguale... E dire che hai migliorato il font ed aggiunto quell'effetto rilievo che fa fighissimo!!

In ogni caso quindi me lo devo lavorare tutto in inkscape e poi salvare in png all'ultimo allora... Provo anche a fare così!
Ma che font hai usato?? Sembra un sans, ma il mio sans non ha quella g li!!

[[P i X A R] 3D]

Thks


Il font è: Palatino Linotype

Per i fonts, in generale cerca (cercare è un eufemismo, il termine che si addice meglio è: "ravanare") in DAFONT

Ciao