Discussione:
immagini svg: firefox e altri browser
(troppo vecchio per rispondere)
Sandro kensan
2011-11-28 18:49:13 UTC
Permalink
Sto facendo una iconcina, logo per il mio sito, ho pensato bene di farla
in svg, in grafica vettoriale. Fatto tutto per benino sono andato a
vedermi se per caso ci sono incompatibilità con i browser più vecchi.

Prima sorpresa, IE non supporta svg se non dalla versione 9, nemmeno la
8 li supporta: porca puttana!

Seconda sorpresa, il file svg è un po' troppo grosso, 16 k, quindi mi
dico meglio usare il formato compresso svgz: grandezza 8 k, benissimo.
Carico nel server e vado a vedere: Firefox non supporta le svgz: porca
puttano N.2!

Mi sto convincendo che le svg sono molto poco supportate anche dai
browser moderni. Quindi userò i soliti formati: png. :(

Consigli, suggerimenti, osservazioni?
--
Sandro kensan www.kensan.it geek site
gialloporpora
2011-11-28 18:44:16 UTC
Permalink
Post by Sandro kensan
Sto facendo una iconcina, logo per il mio sito, ho pensato bene di farla
in svg, in grafica vettoriale. Fatto tutto per benino sono andato a
vedermi se per caso ci sono incompatibilità con i browser più vecchi.
Prima sorpresa, IE non supporta svg se non dalla versione 9, nemmeno la
8 li supporta: porca puttana!
Seconda sorpresa, il file svg è un po' troppo grosso, 16 k, quindi mi
dico meglio usare il formato compresso svgz: grandezza 8 k, benissimo.
Carico nel server e vado a vedere: Firefox non supporta le svgz: porca
puttano N.2!
Mi sto convincendo che le svg sono molto poco supportate anche dai
browser moderni. Quindi userò i soliti formati: png. :(
Consigli, suggerimenti, osservazioni?
Hai il link all'immagine?
--
*gialloporpora: RT @mozillaitalia: Se ricevi una mail da firefox.com
riguardo a una versione di Firefox 8 ottimizzata per Facebook, ignorala,
è un malwa ... * - http://bit.ly/rpkUia
Sto ascoltando: *Fabrizio De André – Khorakhanè (A Forza Di Essere
Vento) * - http://bit.ly/rsxLh0
Sandro kensan
2011-11-28 20:17:09 UTC
Permalink
Post by gialloporpora
Post by Sandro kensan
Mi sto convincendo che le svg sono molto poco supportate anche dai
browser moderni. Quindi userò i soliti formati: png. :(
Consigli, suggerimenti, osservazioni?
Hai il link all'immagine?
Sto facendo gli ultimi ritocchi all'immagine, una versione provvisoria
la metto qui:

http://www.kensan.it/images/kensan_logo.svg

magari dammi una tua opinione :)

Per la versione svgz basta che provi a salvarla in questo formato con
inkscape e vedrai che non si apre con FF. Se vuoi faccio l'upload della
svgz.
--
Sandro kensan www.kensan.it geek site
gialloporpora
2011-11-28 23:05:08 UTC
Permalink
Post by Sandro kensan
Post by gialloporpora
Post by Sandro kensan
Mi sto convincendo che le svg sono molto poco supportate anche dai
browser moderni. Quindi userò i soliti formati: png. :(
Consigli, suggerimenti, osservazioni?
Hai il link all'immagine?
Sto facendo gli ultimi ritocchi all'immagine, una versione provvisoria
http://www.kensan.it/images/kensan_logo.svg
magari dammi una tua opinione :)
Per la versione svgz basta che provi a salvarla in questo formato con
inkscape e vedrai che non si apre con FF. Se vuoi faccio l'upload della
svgz.
Molto carino :-)

Prova a caricare la svgz, io ho provato con imagemagick ma non mi crea
un buon file (mi dà errore XML malformato), secondo me se supporta le
SVG supporta anche le SVGZ.
Io ho una mezza idea che sia il server che non è configurato bene,
Firefox è solitamente delicato coi mimetype, contrariamente agli altri
browserr.

Ciao
--
*gialloporpora: RT @mozillaitalia: Se ricevi una mail da firefox.com
riguardo a una versione di Firefox 8 ottimizzata per Facebook, ignorala,
è un malwa ... * - http://bit.ly/rpkUia
Sto ascoltando: *Fabrizio De André – Khorakhanè (A Forza Di Essere
Vento) * - http://bit.ly/rsxLh0
gialloporpora
2011-11-29 00:38:48 UTC
Permalink
Post by gialloporpora
Post by Sandro kensan
Post by gialloporpora
Post by Sandro kensan
Mi sto convincendo che le svg sono molto poco supportate anche dai
browser moderni. Quindi userò i soliti formati: png. :(
Consigli, suggerimenti, osservazioni?
Hai il link all'immagine?
Sto facendo gli ultimi ritocchi all'immagine, una versione provvisoria
http://www.kensan.it/images/kensan_logo.svg
magari dammi una tua opinione :)
Per la versione svgz basta che provi a salvarla in questo formato con
inkscape e vedrai che non si apre con FF. Se vuoi faccio l'upload della
svgz.
Molto carino :-)
Prova a caricare la svgz, io ho provato con imagemagick ma non mi crea
un buon file (mi dà errore XML malformato), secondo me se supporta le
SVG supporta anche le SVGZ.
Io ho una mezza idea che sia il server che non è configurato bene,
Firefox è solitamente delicato coi mimetype, contrariamente agli altri
browserr.
Ciao
Ok, provato con Inkscape:
http://www.gialloporpora.netsons.org/images/ff64.svgz

a me funziona. Secondo me è il server configurato male, devi essere
sicuro di due cose:
1) che sia definito il mime type dei file svgz come image/svg+xml
2) che per svgz sia inviato l'header che indica a Firefox che è compresso

In pratica, metti su .htaccess queste due righe:

AddType image/svg+xml svgz
AddEncoding gzip svgz

e dovrebbe funzionare.

Ciao
--
*gialloporpora: RT @mozillaitalia: Se ricevi una mail da firefox.com
riguardo a una versione di Firefox 8 ottimizzata per Facebook, ignorala,
è un malwa ... * - http://bit.ly/rpkUia
Sto ascoltando: *Fabrizio De André – Khorakhanè (A Forza Di Essere
Vento) * - http://bit.ly/rsxLh0
Sandro kensan
2011-11-29 17:44:40 UTC
Permalink
Post by gialloporpora
http://www.gialloporpora.netsons.org/images/ff64.svgz
Prima di tutto grazie dell'interessamento, mi metto d'impegno a capirci
qualche cosa con il tuo aiuto :)

Però ho un dubbio che quell'immagine non sia una svg ma una png
incapsulata in una svgz.

Ho aperto ff64 con firefox e sono andato a vedere "view image info"
tramite il menù contestuale (tasto destro del mouse) e mi dice:

Type: PNG Image

Invece la mia immagine svg:
http://www.kensan.it/images/kensan_logo.svg

Type: image/svg+xml

Poi se provi a salvare la tua immagine la salva come png, se provi a
salvare la mia la salva come svg.

Mi viene il dubbia che la tua immagine sia una png oppure il server la
fornisce come png magari facendo una conversione di formato.
Post by gialloporpora
a me funziona. Secondo me è il server configurato male, devi essere
1) che sia definito il mime type dei file svgz come image/svg+xml
2) che per svgz sia inviato l'header che indica a Firefox che è compresso
AddType image/svg+xml svgz
AddEncoding gzip svgz
e dovrebbe funzionare.
Interessante però voglio che mandi la svg e non la png. Io per quanto
riguarda la compressione ho questo:

# compressione con gzip dei file di testo che vengono forniti ai browser
(maggiore velocità)
AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css
<FilesMatch "\\.(js|css|html|htm|php|xml)$">
SetOutputFilter DEFLATE
</FilesMatch>

Se gli dico di comprimermi anche le svg non è lo stesso per quanto
riguarda la trasmissione dei dati? Forse però la gestione di una svgz
comporta più vantaggi in quanto anche il browser maneggia file più piccoli.
--
Sandro kensan www.kensan.it geek site
Sandro kensan
2011-11-29 18:20:52 UTC
Permalink
Ok mi pare di avere capito.

Qui (
http://groups.google.com/group/mozilla.dev.tech.svg/browse_thread/thread/72aaa9975e354959/971b3ad91dc3a9b3?pli=1
) si dice:

«Firefox only supports svgz files when they are served by a web server.
I'm sure there is a bug about this already in bugzilla. »

Quindi FF non gestisce le svgz. Conferma: ho provato ad aprire le svgz
tramite Firefox e mi rimanda ad ark che è un programma di gestione delle
compressioni/archiviazioni. Se invece clicco sull'icona svgz il mio
programma di gestione delle immagini me lo apre correttamente, quindi la
svgz è corretta. Ergo FF non gestisce direttamente le svgz.

Per farle gestire come hai suggerito tu occorre agire tramite server,
però a me non interessa, volevo una gestione nativa oppure uso le molto
più leggere png (almeno per la mia immagine).

Una svg occupa 16k, una svgz 8k mentre una png 3k (72x72 px), per
arrivare a 8k serve una png da 200x200 px.
--
Sandro kensan www.kensan.it geek site
Sandro kensan
2011-11-29 18:23:12 UTC
Permalink
Post by Sandro kensan
Ok mi pare di avere capito.
e invece non ho capito nulla...
Post by Sandro kensan
Qui (
http://groups.google.com/group/mozilla.dev.tech.svg/browse_thread/thread/72aaa9975e354959/971b3ad91dc3a9b3?pli=1
«Firefox only supports svgz files when they are served by a web server.
I'm sure there is a bug about this already in bugzilla. »
Forse le gestisce ma solo se fornite dal server e questo è un bug non
corretto da due anni e mezzo?
--
Sandro kensan www.kensan.it geek site
gialloporpora
2011-11-29 18:50:34 UTC
Permalink
Post by Sandro kensan
Post by Sandro kensan
Ok mi pare di avere capito.
e invece non ho capito nulla...
Post by Sandro kensan
Qui (
http://groups.google.com/group/mozilla.dev.tech.svg/browse_thread/thread/72aaa9975e354959/971b3ad91dc3a9b3?pli=1
«Firefox only supports svgz files when they are served by a web server.
I'm sure there is a bug about this already in bugzilla. »
Forse le gestisce ma solo se fornite dal server e questo è un bug non
corretto da due anni e mezzo?
Allora,
è vero che la mia era una PNG incapsulata in una PNG, in ognicaso se
Firefox non supportasse SVGZ non avrebbe aperto nemmeno quella.
Io, prima di ieri, non ho mai usato il formato SVG, però mi sembrava
strano che Firefox supportasse le SVG e non le SVGZ che altro non sono
che SVG zippate usando il formato gzip. Infatti basta che usi 7-ZIP per
ottenere un'immagine SVGZ a partire da una SVG:

7z a -tgzip image.svgz

Per dire che è semplicissimo supportare le SVGZ non appena si supporta SVG.

Esempio:
http://www.gialloporpora.netsons.org/images/firefox.svgz

questa è veramente una SVG e non una PNG incapsulata.

Il problema è che quando un browser legge un file non può, come fanno i
sistemi operativi, affidarsi all'estensione per sapere di cosa si
tratta, il server gli dice che tipo di file è inviando l'header
Content-Type, essendo che SVG e SVGZ hanno lo stesso mimetype
(imgage/svg+xml), deve anche comunicare al browser che il file è compresso.
Ora, per i tipi più comuni di file, tutti (o quasi) i server sono
configurati per inviare il giusto header, per tipi un po' più
particolari bisogna mettere mano ai file di configurazione del server.
Di solito si può riscrivere queste regole via .htaccess (almeno su
Apache) e su siti come netsons o altervista questo è anche l'unico modo
credo.

Ci sono browser che se ne fregano di quello che dice il server, credo
facciano un test iniziale per riconoscere il tipo di file, purtroppo
Firefox è rigido da questo punto di vista e non fa nulla di testa sua ma
si fida ciecamente a quanto gli viene comunicato dal server, quindi se
il server gli dice, come succede quando non è configurato per supportare
un certo file, che il file è un text/plain lui lo apre come file di
testo e non interpreta il codice come se fosse un file SVG.

La tua è questa:
http://www.gialloporpora.netsons.org/images/kl.svgz

Non è un bug di Firefox, semplicemente Firefox è più rigido nel seguire
le comunicazioni fatte dal server, altri non si fidano del server e
preferiscono stabilire di che tipo di file si tratti (non Opera).

Ciao
--
*gialloporpora: RT @mozillaitalia: Se ricevi una mail da firefox.com
riguardo a una versione di Firefox 8 ottimizzata per Facebook, ignorala,
è un malwa ... * - http://bit.ly/rpkUia
Sto ascoltando: *Fabrizio De André – Khorakhanè (A Forza Di Essere
Vento) * - http://bit.ly/rsxLh0
Sandro kensan
2011-11-29 20:06:10 UTC
Permalink
Post by gialloporpora
http://www.gialloporpora.netsons.org/images/kl.svgz
Rispetto alla mia la tua immagine è di 150 byte più corta, altro dubbio...

Comunque siamo arrivati a conclusioni analoghe :)

Mi rimane da scoprire quanto sono compatibili le svg(z): quanti browser
le supportano?
--
Sandro kensan www.kensan.it geek site
gialloporpora
2011-11-29 19:19:49 UTC
Permalink
Post by Sandro kensan
Post by gialloporpora
http://www.gialloporpora.netsons.org/images/kl.svgz
Rispetto alla mia la tua immagine è di 150 byte più corta, altro dubbio...
Comunque siamo arrivati a conclusioni analoghe :)
Mi rimane da scoprire quanto sono compatibili le svg(z): quanti browser
le supportano?
Sarà 7-ZIP che la comprime meglio di Inkscape, è possibile l'algoritmo
di compressione sia più aggiornato.

Le SVGZ sono supportate da tutti i browser che supportano le SVG, in
realtà non sono un vero formato.
http://en.wikipedia.org/wiki/Svgz

Comunque secondo me ti basta una PNG, credo che le SVG siano utili per
fare animazioni via JS, un logo può benissimo essere in formato PNG.
Ciao
--
*gialloporpora: RT @mozillaitalia: Se ricevi una mail da firefox.com
riguardo a una versione di Firefox 8 ottimizzata per Facebook, ignorala,
è un malwa ... * - http://bit.ly/rpkUia
Sto ascoltando: *Fabrizio De André – Khorakhanè (A Forza Di Essere
Vento) * - http://bit.ly/rsxLh0
Sandro kensan
2011-11-29 19:56:21 UTC
Permalink
Post by gialloporpora
http://www.gialloporpora.netsons.org/images/ff64.svgz
a me funziona. Secondo me è il server configurato male, devi essere
sicuro di due cose: 1) che sia definito il mime type dei file svgz
come image/svg+xml 2) che per svgz sia inviato l'header che indica a
Firefox che è compresso
AddType image/svg+xml svgz
AddEncoding gzip svgz
Altre prove. Sto seguendo la tua traccia e fin'ora sembra funzionare.
Prima di tutto questo post:

https://bugzilla.mozilla.org/show_bug.cgi?id=52282

Commento 56
Post by gialloporpora
Realising this has drifted a little off topic, but wanting to clear
Phillip, SVG is Scalable Vector Graphics
http://www.w3.org/Graphics/SVG/ http://www.w3.org/TR/SVG11/ the
data: protocol is defined by RFC 2397 'The "data" URL scheme', L.
Masinter, August 1998.
Boris, the fact that compressed SVG and uncompressed SVG have the
same Internet media type is by design, and follows the relevant IETF
guidelines on separating content type from compression. See
http://www.w3.org/TR/SVGMobile12/conform.html#ConformingSVGServers
for a discussion on Internet media Type and compression. It would be
incorrect and inappropriate to register all combinations of media
type times compression method as new media types.
Jonathan, you are correct that the data: protocol does not provide a
means to indicate the Content-Encoding (or indeed, any other http
headers). I would therefore not recommend using compressed data in a
data: uri since there is no way to indicate that it is compressed or
what method has been used to compress it.
All, the general issue is that most protocols (file, ftp, data, etc)
do not provide metadata headers - just the actual data. Internet
Media type, compression, language, and so forth therefore need to
infer this information.
For SVG, the .svg extension implies media type image/svg+xml while
the .svgz extension implies media type image/svg+xml and
Content-Encoding: gzip.
"SVG implementations must correctly support gzip-encoded [RFC1952]
and deflate-encoded [RFC1951] data streams, for any content type
(including SVG, script files, images)." [1]
As Chris as well mentioned (in comment 56), this must be done using
heuristics due to lack of meta-information in several protocols.
Although the currently available test suite [2] doesn't explicitly
test for this, there's a specific test [3] in SVG 1.1 SE which will
break whenever the test suite is being executed locally (the online
version works file due to the metadata inserted at HTTP level).
<rant> Apart from the conformance issue, this is one of the most
longstanding and annoying and issues regarding SVG support. The
broken feeling when opening ".svgz" files locally probably causes
many users not to use a format which is highly desirable due to the
XML overhead, for perceived performance and bandwidth reduction
reasons. Also, the behavior is quite unintuitive/unexpected for most
users/authors, as they are able to access the exact same content
online, but not locally... :-| </rant>
Commento 49
Post by gialloporpora
and there is only one MIME type for svg.
This is the real problem. Or lack of content-encoding in data:, I
guess. But plenty of other things don't support content-encoding.
Mi sembra di capire che esiste solo il tipo di dato svg e non esiste il
tipo svgz, quindi lato server occorre che le due immagini (le svg e le
svgz) siano inviate in modo distinto con le svgz che abbiano specificato
la compressione.

Lato client il caricamento delle svgz non funziona in quanto non è
specificato da nessuna parte che si tratti di una svg *con* compressione
e FF ha un solo tipo di immagine le svg (le svgz non sono un tipo distinto).

In pratica le svgz sono delle svg con compressione e quest'ultima è
specificabile solo lato server e non tramite il caricamento da locale.

Detto questo Ho provato il tutto tramite l'immagine svgz seguente:

http://www.kensan.it/images/kensan_logo.svgz
dimensione 8.8 kB

Con .htaccess specificato da gialloporpora:

AddType image/svg+xml svgz
AddEncoding gzip svgz

e funziona. Potete provare con IE e altri browser?
--
Sandro kensan www.kensan.it geek site
SBRONZO DI RIACE
2011-11-29 10:00:01 UTC
Permalink
Post by Sandro kensan
Post by gialloporpora
Post by Sandro kensan
Mi sto convincendo che le svg sono molto poco supportate anche dai
browser moderni. Quindi userò i soliti formati: png. :(
Consigli, suggerimenti, osservazioni?
Hai il link all'immagine?
Sto facendo gli ultimi ritocchi all'immagine, una versione provvisoria
http://www.kensan.it/images/kensan_logo.svg
magari dammi una tua opinione :)
Per la versione svgz basta che provi a salvarla in questo formato con
inkscape e vedrai che non si apre con FF. Se vuoi faccio l'upload
della svgz.
--
Sandro kensan www.kensan.it geek site
con firefox 8 e con opera 11 si vede, comunque meglio le png
Sleepers
2011-11-29 12:42:44 UTC
Permalink
Post by Sandro kensan
http://www.kensan.it/images/kensan_logo.svg
Per la versione svgz basta che provi a salvarla in questo formato con
inkscape
L'hai creato con Inkscape?
--
Ciao, Alessio - http://www.sleepers.it

Materiale in italiano per Agent: http://agentit.altervista.org/
Sandro kensan
2011-11-29 17:47:30 UTC
Permalink
Post by Sleepers
Post by Sandro kensan
http://www.kensan.it/images/kensan_logo.svg
Per la versione svgz basta che provi a salvarla in questo formato con
inkscape
L'hai creato con Inkscape?
Esatto, ho scaricato il programma e mi sono messo a disegnare copiando
da una bandiera buddhista. Un po' di pazienza e diverse ore per capire
come si fa a fare quello che avevo in testa.
--
Sandro kensan www.kensan.it geek site
Lutrin
2011-11-28 19:22:14 UTC
Permalink
Post by Sandro kensan
Prima sorpresa, IE non supporta svg se non dalla versione 9
[...]
tutte le versioni dalla 6 in poi possono visualizzare svg nel browser,
previa installazione dell'

*adobe svg viewer*

che è freeware, ma l'arretratezza di internet ex(schif)plorer si nota
anche da questi dettagli
--
Puppy Linux wiki: http://dokupuppylinux.tk
Puppy Linux Forum: http://www.italianpuppy.org/
Windows me genuit, Ubuntu rapuere / tenet nunc Puppy Linux...
invito dropbox 2GB free - http://db.tt/Vc6IeN4
Sandro kensan
2011-11-28 20:34:24 UTC
Permalink
Post by Lutrin
Post by Sandro kensan
Prima sorpresa, IE non supporta svg se non dalla versione 9
[...]
tutte le versioni dalla 6 in poi possono visualizzare svg nel browser,
previa installazione dell'
*adobe svg viewer*
che è freeware, ma l'arretratezza di internet ex(schif)plorer si nota
anche da questi dettagli
L'ho letto, ho letto che esistono molti plugin per le svg, però se
nemmeno FF è esente da critiche perché le svgz non le carica, non mi
metto a usarle nel mio sito.
--
Sandro kensan www.kensan.it geek site
Loading...