SVG or PNG?
- Started
- Last post
- 19 Responses
- freedom
Are people starting to use .svgs instead of .pngs now?
Any advantage besides pixel clarity?
I see more sites with .svg than ever before.
- Hombre_Lobo0
Ive yet to put them on my sites, but its certainly beneficial to use them. They've become more popular since responsive fluid design and future proofing for pixel density. I don't think there have been browser based vectors other than flash *moments silence...*
Todd motto has a good simple script for svg use with png fallback -
https://gist.github.com/toddmott…
- prophetone0
i haven't bothered but perhaps with that fallback it might be something to test in teh near future, it has its benefits for sure
- 20020
svg no good performance.
- prophetone0
fair enough, i'm more comfy with flash for mobile anyway
- utopian0
SVG = scalable vectors for repsonsive
PNG = non-scalable blurry transparent bitmaps
- xpxhxoxexnxixx0
PNGs are in fact scalable using tools like Texturepacker. You can set HD & SD versions of your output spritesheet (assuming you are using them) and you can also output a packing file , everything from js to .plists. Once you put each sheet in your project, you make a call and it will auto detect the resolution, and return and play that size (hd or sd) png
- instrmntl0
svg will chug your shit. don't use them if possible.
- Hombre_Lobo0
^ive not read anything about thier performance. Are they more demanding that png? i suppose pixels are easy to work with, vector coordinates would likely need more processing, but im guessing! :)
- The browser has to actually draw the object like Illustrator would. PNG it just spits out a grid of pixelsanimatedgif
- animatedgif0
Looks good on their Retina Macbook Pro
Which is obviously number 1 priority after spending $2500 or whatever they cost.
- Stugoo0
If you're talking about things like logos and icons then SVGs are great but I've come across a number of different cross browser issues, but performance is not one of them, unless you're live-tracing pictures in illustrator and dumping them on to your web page as photographs?
You could move forward in the world of scalable graphics on the web or you can multiply the size of your sprite sheet by a minimum factor of 1.5x..... Treat images are an enhancement.
- bklyndroobeki0
bump
- bklyndroobeki0
- ?bklyndroobeki
- Looks cool but not sure if it's really needed.Chimp
- 20020
compared to font icon?
- https://s-media-cach…set
- (not that you're not right, but seriously... https://s-media-cach…)set
- OSFA0
they got me at 'vector'.
- BattleAxe0
try writing one
http://www.w3schools.com/svg/svg…
- rabbit0
When possible I use fonts for icons, create the webfont kit and voila, reduces file size on pages, scalable etc
- detritus-3
SVGs are great... up until they have to be rendered by some bullshit astandard browser on some cheap-ass Korean phone.
*harrumph*
- -1pinkfloyd
- Why? Because Korean?
My test phone's a Samsung, which is Korean, you overly sensitive, drama-seeking clod.detritus - ^drama queenpinkfloyd
- haha, of all the people.detritus
- what's your deal, did some bad asian driver cut you off during driver's ed?pinkfloyd
- My deal? Good lord - what's yours?
You still not learned to love yourself and your heritage, J? f'ing hell - how old are you now?detritus - lol take a time outpinkfloyd