How to lose your ass... bigtime!

[Mister X]

So the guy who has our server calls up friday and says that we have used over 350 gigs this month and the server is spewing out 50 megabytes per second. I'm like Holy effin shit Batman! Because there is no way that particular server should be using that much friggin bandwidth. It has some fairly low bandwidth sites and my domain is hosted on it. I check the logs and one domain that belongs to a friend of a friend who does the occasional tgp gallery is sucking an incredible amount of bandwidth. In fact it used 77 gigs that day cuz the guy didn't call until late so I didn't hear about it until the next day.

So then I'm trying to figure out what this guy is doing to use that kind of bandwidth. I figured he must be hosting movies or warez or something. It turns out that all that bandwidth was being sucked by ONE page on the Hun. Which seemed basically impossible until I took a look at the page. This guy used thumbnail pics that averaged over 32 KB in size. The thumbnails on my pages average 5 to maybe 8 KB. So we do the math.... 15 thumbs x 30 KB = 450 KB. Add about 50 KB or so for 2 banners and a couple of reciprocal banners and the html file itself. That means every time the page was loaded for the first time by a surfer it sucked 500 KB of bandwidth. There were 3 days with 90 to over 100,000 uniques. 100, 000 x 500Kb = 50 GB right? And that's before they even looked at a single big pic!

I ended up not shutting down the site cuz by the time I tracked it down the gallery was off the main page at the Hun's and the bandwidth was dropping. So in 5 days that one single gallery used 223 gigs of bandwidth. I don't know if he even got any signups out of the deal but it would surprise me a hell of a lot if he got enough to pay for that.

The moral of the story? Check the details! If he had looked at the size of the thumbs before posting that page he might have made some money instead of losing.

:bonk:

[Mefo]

wow 32KB thumbs how the hell did he do that :confused:

[Mister X]

Originally posted by Mefo
wow 32KB thumbs how the hell did he do that :confused: He must have made them and then saved them as 99 or 100% jpegs I guess. Whatever he did it wasn't so smart, lol.

[Mefo]

lol indeed my big pics aren't even much bigger than that...:)

[Vid Vicious]

Ha ha .. THat's so funny .. Why people won't take the time to compress pics, I'll never know ...


Looks like you buddy learned a valuble (and expense) lesson in Optimizing a web page .. :)

[Horg]

Urgh, what a waste of money!!! How much does that cost him in total? He should have read my super duper tutorial :
http://ratedhot.com/tutorial/imagecompression.php

[Mister X]

Originally posted by Horg
Urgh, what a waste of money!!! How much does that cost him in total? He should have read my super duper tutorial :
http://ratedhot.com/tutorial/imagecompression.php Lets' see... a total of about 230 gigs of bandwidth or so for that one page it looks like. 230 X $1.50 Canadian = 345 Canadian bucks!

Hope he got his money's worth, but I doubt it. :D

[McAttack]

Originally posted by Horg
Urgh, what a waste of money!!! How much does that cost him in total? He should have read my super duper tutorial :
http://ratedhot.com/tutorial/imagecompression.php

Very good article Horg! i've always had a problem with my image compression. I usually lose a lot of quality. Then I go out and look at some stuff some guys are doing and it freaks me out that they get better quality in GIF than I get in JPG sometimes.

[Horg]

Wow, I hope he has a big wallet! hehe

Thansk McAttack for the comment :) It was originally supposed to be about a page long, but I gor carried away and wrote all that crap hehe. I'm glad it helps!

[Mister X]

Nice article Horg. You did leave out one thing that I might have mentioned though. When size of a file is an issue but you want very nice clear text then I will often choose gif over jpeg. This is especially true with certain colour combinations of text/background. The loss in visual quality of the photographic section of a banner can many times be more than offset by having sharp and clear text that the surfer has no trouble reading. Probably anybody that has done a few banners has noticed that it can be a real bitch to find a combination of colours/fonts that doesn't look blurred in jpeg even with settings of 95 or above. And also when there are large sections of the same colour, as there often are in banners, the gif files can actually be significantly smaller than a jpeg.

[Mister X]

Originally posted by McAttack
Very good article Horg! i've always had a problem with my image compression. I usually lose a lot of quality. Then I go out and look at some stuff some guys are doing and it freaks me out that they get better quality in GIF than I get in JPG sometimes. One thing that I have noticed is that the quality of the original image has a huge impact on how well it can be compressed. The better the camera used to take a picture, the less artifacting that is present in the original pic. The artifacting is often basically invisible to the eye but when you go to compress it, it complicates things.

Cutting down the number of resizings and compressings between the original image and the finished product can also help a lot with getiing clearer pics with a smaller files size. For instance the original pics might be 1280x1024 or even larger with quality set to 100. Naturally you don't want to use those on a paysite so you resize them to 800x600. You also don't want other sites ripping you off so you add a watermark or a small banner image to the pics. That's 2 operations on each pic to get it to web ready. If you need to adjust the colour or something it can be 3 or 4 operations. If it is saved in between each operation you are introducing flaws each time which can become magnified with the next operation/save. If you use a good batch program you can do all your operations for each pic with only 1 save between the original and web ready.

[Horg]

Yup, the best is to work with a lossless compression format (such as BMP, TIFF, PSD, etc) until it's ready then save it for the web. But that takes quite a lot of space. No wonder my work directory is a couple gigs hehe.

As I said in my article, try to avoid using red text as it really smudges when saved in a jpg. But anyway, the colors that people will see the most are white and yellow, two colors that jpeg loves hehe. You can still use red, but use it for the background, for example :
<div align="center"><img src="http://www.tinymeatproductions.com/portfolio/banners/apf-468x60-02.jpg" border="1"></div>
Another way to make your text easier to read and less destroyed by compression is to have a border around it :
<div align="center"><img src="http://www.tinymeatproductions.com/portfolio/banners/pf-468x60-02.jpg" border="1"></div>
Without a border and a shadow this text would have been really hard to read in this color.

[-=HUNGRYMAN=-]

Rule of thumb for compression is JPEG for pictures, and GIF for text and cartoon drawings.

A JPEG quality of more than 60 is adding file weight that you will NEVER see with the naked eye.

And when saving text as GIF, be sure to always select PERSPECTIVE PALETTE, and color reduction in text layers (the little button to the right of PERSPECTIVE will open a prompt that will allow you to reduce colors in text layers )

Great topic !!
I am doing a seminar at Cybernet, and I think I will take a moment to go over image compression, as it is something that MANY PPL don't know what they are doing ....

[McAttack]

Let me push this a little further. I found a gallery once that I found very nice. If you look at the header on this page (http://www.vivianweb.com/helmy/amanda/index6.html)

The header which is the COED CHICKS thing is a GIF but looks very high quality. How can an effect like this be reached? Is it only because the original picture was made very light, with the dodge (or burn, I always forget which one) ?

I've always found this very nice. The set also helps! hehehe but i'm talking about the template itself.

[Horg]

That pic is a gif because it has a transparent background. That's why you can see on the edges of the curved areas it's all pixelated. It would have been a lot lighter (size wise) in jpeg. Which effect are you talking about exactly?

[McAttack]

I know it's a GIF, but I'm just surprised that the girls on the right side of the header show no pixelation in the gradience.

[Horg]

Surprising what 256 colors can do huh? Hehe
Well back some years ago games were in 256 colors (or less). For example, Doom, DoomII and Quake were only in 256 colors but still looked pretty neat for the time!

[McAttack]

Yeah, back when a VGA game was amazing cause you were so used to EGA.

[Mister X]

Originally posted by McAttack
Let me push this a little further. I found a gallery once that I found very nice. If you look at the header on this page (http://www.vivianweb.com/helmy/amanda/index6.html)

The header which is the COED CHICKS thing is a GIF but looks very high quality. How can an effect like this be reached? Is it only because the original picture was made very light, with the dodge (or burn, I always forget which one) ?

I've always found this very nice. The set also helps! hehehe but i'm talking about the template itself. The trick to that header is that the pic portion of it contains pics with very little actual variation in colour. The majority of them is just plain skin. If it was 4 more varied pics or if one of them was an ebony babe it might not have been as good.