|
| |
|
|
inthephilippines
Posts: 6
Joined: 11/15/2004
Status: offline
 |
Fast loading graphic as big as 800x600 - 11/17/2004 5:28:38
I want to put a graphic as big as 800 X 600 and make it as the whole page of the graphic with all the texts and designs on it. But the file size is too big and takes a long time to load. How do I reduce the file size of the graphics and load fast in the web without reducing width and height or actual size of graphics and not sacrificing photo quality. Pls help.
|
|
|
|
Nigel
Posts: 383
Joined: 7/24/2002
From: Wirral - UK
Status: offline
|
RE: Fast loading graphic as big as 800x600 - 11/17/2004 5:41:09
Do you want to show a pic or are you using this as the basis of a website?
Image splicing is the first that springs to mind - this is where your image is broken up into smaller peices. There are a few threads here on it. You can do it with photoshop - image ready and in fireworks amongst others.
Nigel
_____________________________
Innerview
Web Design - Virtual Tours - 360 Panoramas - Shopping carts
| |
|
|
|
d a v e
Posts: 4168
Joined: 7/24/2002
From: England (but live in Finland now)
Status: offline
|
RE: Fast loading graphic as big as 800x600 - 11/21/2004 4:16:59
slicing up the image - assuming it's not a background image - will give the *appearance* of it loading more quickly, but unless there are some parts of the image that you can optimise more aggressively then it will end up being the same size and take the same amount of time (actually if it is in lots of pieces it will take longer as each request to the server to download each piece will take a small amount of time).
images for the web aren't affected by resolution: one pixel is one pixel (save a n image at 300 ppi and one at 72ppi, put them on a webpage and then look at the filesize...)
quote:
How do I reduce the file size of the graphics and load fast in the web without reducing width and height or actual size of graphics and not sacrificing photo quality. Pls help.
you've answered your own question, either reduce the dimensions, or reduce the image quality. if it's a gif reduce the number of colours in the palette. if you have the original picture post it here and see how small some of th members can make it in their image editing apps. many people have professional apps likem photoshop/image ready, PSP (paintshop pro) macromedia fireworks etc. if you don't have access to these then we can probably help you.
there is obvisously a limit to the amount of compression you can use and still maintain acceptable quality.small to moderate amounts of blurring or smoothing the image will also aid the jpeg compression process
another thing to bear inmind when using fullscreen background images is that you don't what size viewport users have - if they are surfing for example at 800x600 or 1600x? so you will need a sufficiently large image or one that will tile gracefully. this is why you don't see image used as whole page backgrounds very often.
also remember that pages ideally should be around the 50k mark in total (if you are bothered at all about modem users or even those at the lower broadband speeds) and using a background image will soon exceed that 'limit'.
if you can post a link to the image (optimised and original) and we'll see if we can help :)
_____________________________
David Prescott
Gekko web design
| |
|
|
|
dpf
Posts: 7126
Joined: 11/12/2003
From: India-napolis
Status: offline
|
RE: Fast loading graphic as big as 800x600 - 11/21/2004 9:45:36
quote:
excellent reply dave, as usual, and thanks for clearing up that common misconception about file sizes and resolution
and Dave, thatks also for clearing up the misconception about sliced images!
quote:
slicing up the image - assuming it's not a background image - will give the *appearance* of it loading more quickly, but unless there are some parts of the image that you can optimise more aggressively then it will end up being the same size and take the same amount of time (actually if it is in lots of pieces it will take longer as each request to the server to download each piece will take a small amount of time).
_____________________________
Dan
| |
|
|
|
d a v e
Posts: 4168
Joined: 7/24/2002
From: England (but live in Finland now)
Status: offline
|
RE: Fast loading graphic as big as 800x600 - 11/21/2004 10:41:47
well i hope i'm right about the slicing! as i understand it from something like
http://www.websiteoptimization.com/services/analyze/wso.php?url=http://www.mozilla.org/products/firefox/central.html
it says there's a time for each packet of info to come from the server and you can only fit so much in the packet, so you you have to ask for things a few at a time, it sends them, then request the next lot. you can't just give it the whole 'shopping list' of things and it (the server) gives you everything back in one go!
that's not to say slicing is a bad idea - it certainly speeds up the apperance of the loading as it comes bit by bit - say if it's split into a reasonable amount like 10-15 parts. split a 100k image into 50 parts and it's going to take significantly longer to download than a single 100k image (hey try it and see if i'm right:)
well that all seems resaonable to me unless anyway knows better ;)
_____________________________
David Prescott
Gekko web design
| |
|
|
|
Nigel
Posts: 383
Joined: 7/24/2002
From: Wirral - UK
Status: offline
|
RE: Fast loading graphic as big as 800x600 - 11/21/2004 15:01:06
Image slicing allows a couple of things - different optimisation of different parts of the image so potentially allowing for a smaller file size. This is appropriate if you design a full webpage where you will probably have a mixture of gifs and jpgs when sliced.
For one image it won'y make much difference as the optimisation is likely to be the same for the whole image regardless of how many parts it's in. Slicing can give the appearance of something happening faster but you still have to wait for the last slice to see the whole image.
This is mostly confirmation of what Dave says. I'm not so sure a whole pic as a background image is a good idea. It can work sometimes if the opacity is reduced which will also reduce the file size.
Nigel
_____________________________
Innerview
Web Design - Virtual Tours - 360 Panoramas - Shopping carts
| |
|
|
|
inthephilippines
Posts: 6
Joined: 11/15/2004
Status: offline
|
RE: Fast loading graphic as big as 800x600 - 11/22/2004 14:46:37
Hi! You were all helpful but it made me more confused. Since I want to write on top of the graphics, I made it as a table background. Actually I just exaggerate it at 800X600 (if there will be a way, i want to use that size as a whole backgrund).
Here's the link of the site I am making (Still under construction).
www.philippinewebspace.com. The pix background is 106K file size
I still want to use a graphic as big as 800x600 in the future so i wish there is a way of reducing file size.
| |
|
|
|
walrus
Posts: 547
Joined: 3/13/2003
From: London
Status: offline
|
RE: Fast loading graphic as big as 800x600 - 11/22/2004 15:27:07
convert to jpeg and compress it a bit, it will shave loads off
_____________________________
I hope The Boss isn't reading this, ...she thinks I program everything!
| |
|
|
|
inthephilippines
Posts: 6
Joined: 11/15/2004
Status: offline
|
RE: Fast loading graphic as big as 800x600 - 11/26/2004 18:26:08
Thanks thanks a bunch. I only explore that compression thing after advising me in this forum. Everytime I save, I don't use that option "save for the web". Now, what I'm doing is training my eyes on how low I can go in file size without making the picture looks crappy (and this is quite hard you know).
Click on this http://www.philippinewebspace.com/sidepicture.htm.
I made the picture 11 kb, kinda little crappy but you think it can pass already web quality?
| |
|
|
|
inthephilippines
Posts: 6
Joined: 11/15/2004
Status: offline
|
RE: Fast loading graphic as big as 800x600 - 11/26/2004 18:36:21
Hmmmmm... there should be no period at the end of the link. Sorry, typo error. Try it again.
| |
|
 New Messages |
 No New Messages |
 Hot Topic w/ New Messages |
 Hot Topic w/o New Messages |
 Locked w/ New Messages |
 Locked w/o New Messages |
|
Post New Thread
Reply to Message
Post New Poll
Submit Vote
Delete My Own Post
Delete My Own Thread
Rate Posts
|
|
|
Printable Version 
