aspose file tools*
The moose likes General Computing and the fly likes Downsizing Images (Storage wise) Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login


Win a copy of EJB 3 in Action this week in the EJB and other Java EE Technologies forum!
JavaRanch » Java Forums » Engineering » General Computing
Bookmark "Downsizing Images (Storage wise)" Watch "Downsizing Images (Storage wise)" New topic
Forums: HTML, CSS and JavaScript General Computing
Author

Downsizing Images (Storage wise)

Joe Ridener
Ranch Hand

Joined: Jul 16, 2012
Posts: 66
My images are for the backgrounds. They are not hugely complex and should not take up one megabyte. I am using the Adobe PS for this. How do I downsize images so that it takes up a moderate amount of KB's as opposed to a whole megabyte?
Greg Charles
Sheriff

Joined: Oct 01, 2001
Posts: 2771
    
  10

Have you tried to save them as JPEGs? You should be able to select a compression factor. Higher compression means smaller files, but with a loss of quality. It might take some trial and error to get the right balance.
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 60049
    
  65

How are you saving the images? Even a good size high-quality PNG won't take up megabytes. Are you saving them at some ridiculous resolution and size?


[Asking smart questions] [Bear's FrontMan] [About Bear] [Books by Bear]
Joe Ridener
Ranch Hand

Joined: Jul 16, 2012
Posts: 66
Yes I saved them as PNG files. They were about 1 mb in size and took a moment to load on a slower connection. The options for file formats included bitmap tiff and PNG. I am used to jpg, jpeg, gif and png so I chose png. not certain that a browser would display tiff or the photo shop file extension type formats.

The size I save was the actual size I wanted it to display. I am not certain how to display a background image and control the size. With an img tag you have height and width attributes but with the style attribute background-image you do not have the option of resizing it that I know of. Scaling the image down to 1/3 or so of its actual size would work. But it would display that size and not display properly. For example if you have a large screen size by width. You'll see... even at 1000 pixels of horizontal resolution the image repeats itself on the right of the screen http://www.joerdesigner.net/Sitemap/employers.html
Greg Charles
Sheriff

Joined: Oct 01, 2001
Posts: 2771
    
  10

I'm not a Photoshop guy, but I know it can definitely save images as JPEGs. There may be a need to reduce color depth first, but the online help or a Photoshop forum would help you with that.

Now, if I understand you right, you want your background image to scale based on the browser window size. I don't know how to do that directly, but if instead of using a background image, you just defined a regular image right under the body tag, and gave it a class background, then this CSS should do the trick for you.



The z-index 0 should (I think) make the image paint behind anything else in the window.
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 60049
    
  65

What image are we talking about? The gradient? Why aren't you just using CSS for that?

That said, a JPEG is fine for that type of image where the lossy-ness would be irrelevant.

Images where quality is more important, or that use the alpha channel, need to be PNG.

And all that said, there's still no need for even a large PNG to be megabytes.
Rob Crowther
author
Ranch Hand

Joined: Nov 06, 2012
Posts: 268
    
    4

Are you doing 'Save As' or 'Save for web'?


Read my books: Hello! HTML5 & CSS3 | HTML5 in Action | Read my blog
Joe Ridener
Ranch Hand

Joined: Jul 16, 2012
Posts: 66
Rob Crowther wrote:Are you doing 'Save As' or 'Save for web'?


I was using the save and save as.... I got it fixed..

I got it fixed though... I just used a img tag and set the z-index on it. Could also have used the background attribute in CSS3 as well.. with a background-size attribute. Thanks antway.
 
I agree. Here's the link: http://aspose.com/file-tools
 
subject: Downsizing Images (Storage wise)
 
Similar Threads
How to deal with slow client connections?
Passing a collection in request
Why *.cgi in javaranch site
Size of class file
Replicate XML Node using XSL