Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Super Tiny Website Logos in SVG

shkspr.mobi

Post reply on HN
Print view View original

51–60 of 121 posts

Re: Super Tiny Website Logos in SVG

#51

Post by Bromskloss »

edent wrote: post #48
baybal2 wrote: post #46

Earlier quoted context omitted.

Do you care about readability? Does ungzipped size counts or you assume that users will be using gzip? Here is DO logo that you can gzip down to 221b http://www.w3.org/2000/svg" fill="#0080ff"> Do you think it is ok to pull out newlines?

In the readme, I've said that I want to keep newlines for readability. That helps with people learning about SVG. I'm not fussed about compressed size - but I'd certainly welcome a Pull Request if you've managed to shrink that icon.

How about keeping readable versions in the repository, along with a script that compresses them? The compressed ones could be automatically served on a separate site.

Re: Super Tiny Website Logos in SVG

#52

Post by Mindless2112 »

chrisweekly wrote: post #34

Slight tangent, but for anyone coming late to the party, here’s a sampling of why SVG matters: http://slides.com/sdrasner/svg-can-do-that#/

I'd say that's a sampling of how SVG went wrong.

What we wanted was a vector image format; what we got was PowerPoint.

Re: Super Tiny Website Logos in SVG

#53

Post by Bromskloss »

IshKebab wrote: post #42
arca_vorago wrote: post #39

Earlier quoted context omitted.

Perhaps Inkscape?

Inkscape is ok. It has serious issues though - pretty terrible performance, confusing UI, still requires X11 on Mac, etc. Probably still the best free SVG editor but I'm not sure I'd go so far as to call it good.

> confusing UI

Anything particular you have in mind?

Re: Super Tiny Website Logos in SVG

#54

Post by Eduard »

IshKebab wrote: post #42
arca_vorago wrote: post #39

Earlier quoted context omitted.

Perhaps Inkscape?

Inkscape is ok. It has serious issues though - pretty terrible performance, confusing UI, still requires X11 on Mac, etc. Probably still the best free SVG editor but I'm not sure I'd go so far as to call it good.

Using it for years. Never experienced any of the mentioned problems

Re: Super Tiny Website Logos in SVG

#55

Post by edent »

Bromskloss wrote: post #51
edent wrote: post #48

Earlier quoted context omitted.

In the readme, I've said that I want to keep newlines for readability. That helps with people learning about SVG. I'm not fussed about compressed size - but I'd certainly welcome a Pull Request if you've managed to shrink that icon.

How about keeping readable versions in the repository, along with a script that compresses them? The compressed ones could be automatically served on a separate site.

Could be fun! Please send a pull request.

Re: Super Tiny Website Logos in SVG

#56

Post by jordache »

Twirrim wrote: post #30
MRSallee wrote: post #22

Earlier quoted context omitted.

Yes, you can make an image that compresses to a smaller raster image vs. SVG, and complexity is a good way to do that. Especially possible if your image/logo isn’t just solid colors, but contains gradients or textures. I would guess, though, that if you make a logo that is larger as an SVG than a compressed raster, you’ve probably made a bad logo. Logos should be simple.

> Logos should be simple. Agreed. Simple but important things to also consider with Logos include "What does it look like if printed in black and white?" It's a bit outdated advice in some regards, based as much on letter headers, fax machines, and news print adverts, as anything else. You'll notice that almost all memorable logos work really well in black and white, though.

"simple" that's a very subjective term.

Is there a way to quantify simplicity in terms of SVG? Can we say number of points & number of paths? What other constructs can be used to measure complexity?

Re: Super Tiny Website Logos in SVG

#57

Post by ozaark »

helenius wrote: post #13

Remember to always (every time) set width/height for the tag, otherwise it will fill the entire screen/container.

Yes! Loading many sites without width/height set on mobile connections display a horrible jitter with logos and social icons polluting the entire screen initially.

Re: Super Tiny Website Logos in SVG

#59

Post by jazoom »

vortico wrote: post #41

Amazing! With SVG being supported on all browsers you should care about today, it obsoletes icon fonts, which require the entire icon set to be downloaded. Anyone know of a FontAwesome-like project, ideally with a CDN, that serves SVG icons like Font Awesome has so including them in a website is easy and compact?

I use these and inline them: https://materialdesignicons.com

Huge selection of images.

Re: Super Tiny Website Logos in SVG

#60

Post by majewsky »

vladdanilov wrote: post #47
dawnerd wrote: post #24

Earlier quoted context omitted.

And if you run it through https://tinypng.com it should get down even smaller. PNG compresses surprisingly well when it’s basically two colors + alpha.

Photoshop: 6 705 bytes, 128 colors, 1-bit alpha only TinyPNG: 6 179 bytes, 92 colors Optimage: 5 761 bytes, 154 colors TinyPNG + Optimage (lossless): 5 226 bytes, 92 colors https://imgur.com/a/X9DnJ TinyPNG tends to use fewer colors. But its compressor is pretty suboptimal. I could reduce the image further by 15.4% with the tool I'm making ( http://getoptimage.com ).

> 92 colors

I see 3 colors (blue, white, transparent).

Post reply on HN