Hi All, At my website I have more than 50 images, around 10 scripts, 1 flash banner, 4 CSS, but I feel all are important, I have compressed most of images on the page as possible, but still download time at T1 1.44 Mbps my page downloads in around 16.86 secons, which is very high But I found that Mozilla firefox browser comparatively downloads the page faster than Internet Explorer, one more good thing I observed with Firefox is that elements of page comes one by one just after hitting the URL, but at IE the whole page comes up but after 17 seconds and comes as whole, why so? Well, tell me more techniques to speeding up my website, currently I am finding speed very slow and disheartening Thanks in advance,,,looking forward for some helpful tips....
50 images sounds like quite a lot how big is the flash banner and how large is the total page including all images? Do all the images need to be on the same page or could additional pages be used to spread things out? Make sure all images are on the same location so the page doesn't have to go here there and everywhere to download things. I think you really need to slim things down or possibly see if css/images could be used for some things as they would save alot of time, otherwise you could look into maybe thumbnails and preloaders but Im not sure how could they would work. Any link to the site?
I'm sure you don't need 4 stylesheets... one or two should be enough. And about compressing images... how did you compress them? You must also resize them (I mean make two versions of images... one small resized... this one you'll put in the website and it might link to fullsize version of image) and lower quality as much as you can. Also use gif as much as possible. Use jpg only for colorful pics. Also make sure your html isn't bloated as hell (this is the major cause of today's websites sluggishness). Finally, the problem might be with your hosting...
make 4 CSS into 1 put JS to page bottom and make sure less or non-table design. and them change to a faster host.
Yes, make sure you actually re-size the images. For example, if you take a 500x500 image and use HTML/css to resize it on the screen - the user still downloads the full-size image. You need to use an image-editing program or a php script to create thumbnails to make sure you're using the smallest possible image files. Compared to 50 images, I highly doubt the HTML will have an impact. Even if the HTML is 50kb, the images are going to be several hundred kb or (more likely) several megabytes. Good hosting can't make up for uber-sized files. Cut out the images, or make sure they're shrunk to small thumbnails. Cut back on the scripts, too. What do ten different scripts do on your page? If it takes 17 seconds to load the images and the page, it's too long. Doesn't matter if you "need them," because few users are going to wait 17 seconds for it to show up. I know I won't. - Walkere
Thanks everybody for response... @getwiththeprogram : I had compressed my flash file from 210000 B to 80000B, but still it is huge. Total HTML: 19066 bytes HTML Images: 141961 bytes CSS Images: 6987 bytes Total Images: 148948 bytes JavaScript: 94625 bytes CSS: 12500 bytes Mulitimedia(flash): 80818 bytes Currently download time is 16.28 seconds. And I can't spread images on additional pages. Can you please explain as you mentioned to keep all the images in the same location so that page have not to go here and there, so does it mean that I keep all the 55 images in same location (in same folder?) You suggested that "otherwise you could look into maybe thumbnails and preloaders" can you explain how could I implement them?Thanks. @risoknop: Ok, I try to lessen 4 CSS to 2. I haven't resize them, nor smallened them, I have compressed (optimized the images using some of the website, I think I have reduced 25% of weight of images), without losing much image quality. HTML shouldn't be bloated, I think mine is not... I don't think there is problem with hosting...i think so... @EIx: Putting JS to bottom, wouldn't it affect the functioning, what will be advantage of it? What about non table design? @walkere : You said: "You need to use an image-editing program or a php script to create thumbnails to make sure you're using the smallest possible image files." I have read about PHP script implementation in such cases, but I am not sure how to do it, currently my whole website is based upon Active Server pages, can I still do it? Please tell as it could be key for speedening the site I think,,, Thanks Well 10 different scripts are for sending information to various engines, sites for anaylysis like scripts for Google Analysis, Merchant Advantage, Crazyegg(for checking clicks on site), Script for CSS menu,Liveperson application, for some other sites.... I think so many scripts are also increasing response time, as suggested by EIx to put Javascripts at the bottom of page may bring whole page and then call scripts which would be helping in bringing elements on page at least better than blank images....Thanks. - - - - - - - - - -- - - - - --- Other suggestions would be helpful thanks....
@Shashank Jain: You have been remiss in helping us to help you. You were asked for a link, but haven't addressed that request. You have a huge number of images which you say are all equally important, but you haven't said what they're about or why they're important. You have a huge bit of javascript, but you haven't said what it does or why you need it—or more importantly, how does it help your visitor? Ask that last question about the huge flash banner. It may seem cool, but it won't take long before its bells and whistles and excess loading time become annoying. How does this page relate to the rest of the site? Why can't it be broken into reasonably sized chunks? How much consideration have you given the informational architecture of the site and the individual pages? If there are 50 equally important items, the value of each is approaching zero, or in this case 1/50th. //edit: I missed your comment on the javascript. Are they all really necessary in view of them being worthless anyway if javascript is disabled? Have you got a working menu without javascript? --g cheers, gary
I clicked and the site seemed to load in about 7 seconds ADSL-- however that was with Scripts off using NoScript. Not sure what the JS is doing with the menu, as it seemed to do the same thing without scripts as with (text changes to green is all... clicked fine). You do have some text locked up in images though. Example, the Corporate, Education and Governement buttons. That should be a sinlge image, with HTML text sitting over it (it doesn't look like a special font of any kind). Meaning the CSS will reference that same single image three times. One thing that makes a difference is how many seperate files the browser must ask for. The browser opens a connection with the server and tells the server to keep the connection open while the browser then asks for each and every image, text file, etc. Any time one image can work in mulitple places, the better.
Find images that are on every page or the majority of your pages and then learn how to cache images with javascript. GOOGLE : javascript image caching