kurt.santo Posted February 10, 2008 Share Posted February 10, 2008 Have on one container a large bg image and each time the page loads you look for some time at bg colour before image ready to display (png). What could I do to make the whole think loading quicker? I have not used pngs in past, so there was no option to save as low res...Kurt Link to comment Share on other sites More sharing options...
newseed Posted February 10, 2008 Share Posted February 10, 2008 I would think png files that large would be better suited as a jpg file compressed down enough that it loads quicker and yet the quality looks good.Got a URL for us to look at? Link to comment Share on other sites More sharing options...
jlhaslip Posted February 11, 2008 Share Posted February 11, 2008 jpg might be the solution unless they need the transparent capability of a png. Link to comment Share on other sites More sharing options...
kurt.santo Posted February 11, 2008 Author Share Posted February 11, 2008 jpg might be the solution unless they need the transparent capability of a png.Choose the png for transparency, but not sure what to do now...Kurt Link to comment Share on other sites More sharing options...
newseed Posted February 11, 2008 Share Posted February 11, 2008 png transparency does not work for IE6 which still has about 25-35% of the market. Provide a URL for your image. You may be able to break up the image using the primary as the body background and the other part used within the content area of your layout. Link to comment Share on other sites More sharing options...
kurt.santo Posted February 11, 2008 Author Share Posted February 11, 2008 png transparency does not work for IE6 which still has about 25-35% of the market. Provide a URL for your image. You may be able to break up the image using the primary as the body background and the other part used within the content area of your layout.newseed,Could you explain a bit more? Did not get what you meant. Thank you for the hint about the market share of IE 6.Kurt Link to comment Share on other sites More sharing options...
newseed Posted February 11, 2008 Share Posted February 11, 2008 If your image can used to repeat a background then you can just size the image down small enough and allow background-repeat to do it trick. If you have a background, let's say of a mountain view, then it becomes a bit more tricky.Provide a url so I can see what you can do to shrink down the image download time. Link to comment Share on other sites More sharing options...
kurt.santo Posted February 12, 2008 Author Share Posted February 12, 2008 If your image can used to repeat a background then you can just size the image down small enough and allow background-repeat to do it trick. If you have a background, let's say of a mountain view, then it becomes a bit more tricky.Provide a url so I can see what you can do to shrink down the image download time.The URL is http://www.jalp.co.uk/testing/bg/index.htm....Also, I would have like to have the pic to fade out to the edges (via transparency), it kind of blends in nicely with the white background. My problem here is that I would need to speciy white as backgroung colour, but then the text cannot be seen (as it is white) until the pic is downloaded. What could I do about that?Kurt Link to comment Share on other sites More sharing options...
newseed Posted February 12, 2008 Share Posted February 12, 2008 I see that this background will be a bit of a challenge but you can still break them up into pieces and place each piece into each div you are going to us (i.e. headere, left column, main content and footer). The tricky part is the stars. It will be hard to do a background repeat if the content is going to be different in height for each page. The purple stripe is not a problem however.Is this picture in it's original form or did you piece them together to achieve this look? Link to comment Share on other sites More sharing options...
kurt.santo Posted February 13, 2008 Author Share Posted February 13, 2008 I see that this background will be a bit of a challenge but you can still break them up into pieces and place each piece into each div you are going to us (i.e. headere, left column, main content and footer). The tricky part is the stars. It will be hard to do a background repeat if the content is going to be different in height for each page. The purple stripe is not a problem however.Is this picture in it's original form or did you piece them together to achieve this look?I created an Illustrator file with the pink background colour on one layer and the rest on a separate layer....Kurt Link to comment Share on other sites More sharing options...
newseed Posted February 13, 2008 Share Posted February 13, 2008 It's going to be hard with those stars in the middle but I did come up with this layout without the stars in the middle content area: Your LayoutIt works in IE6, IE7 and Firefox. You may want do your columns differently but I think by looking at the codes and the images you will find how the concept work so that you can create your own spliced images to fit the column widths/heights you desire.Here is the complete package for you to fiddle around with: Zip FilePreviously, your background image was one file which is about 127kb. By splitting them up and using background repeat for area like the content. The images to download is now only 33kb total. Link to comment Share on other sites More sharing options...
kurt.santo Posted February 13, 2008 Author Share Posted February 13, 2008 It's going to be hard with those stars in the middle but I did come up with this layout without the stars in the middle content area: Your LayoutIt works in IE6, IE7 and Firefox. You may want do your columns differently but I think by looking at the codes and the images you will find how the concept work so that you can create your own spliced images to fit the column widths/heights you desire.Here is the complete package for you to fiddle around with: Zip FilePreviously, your background image was one file which is about 127kb. By splitting them up and using background repeat for area like the content. The images to download is now only 33kb total.Cheers. Will have a go and see what I come up with...Kurt Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.