How to speed up page with 1000+ images on it?

Discussion in 'HTML & Website Design' started by andyleem, Sep 9, 2010.

  1. #1
    Hi
    On my site I have got around 2000 small icon size images being shown (each about 2kb). The page loading is very slow.
    I was wondering if there is anything that can be done to speed this up. Im aware I could use a script to reduce the quality of the images but still I think it will load slow.
    It is reading 6MB of images before whole page is loaded, this is the problem.

    any suggestions appreciated.
    Thanks
     
    andyleem, Sep 9, 2010 IP
  2. extremephp

    extremephp Peon

    Messages:
    1,290
    Likes Received:
    32
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Compress Your Site Using Gzip! Use a High Efficient Host! And Make use Of Cache!!

    And, For the site to Load fast, Reduce the Number of Images :p

    ~ExP~
     
    extremephp, Sep 9, 2010 IP
  3. andyleem

    andyleem Active Member

    Messages:
    490
    Likes Received:
    27
    Best Answers:
    0
    Trophy Points:
    83
    #3
    Okay Il work on these. Unfortunately amount of pics has to remain the same :(
    Can anyone recommend any SUPER FAST Server hosters?
     
    andyleem, Sep 10, 2010 IP
  4. infoman66

    infoman66 Peon

    Messages:
    58
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #4
    I think that you can make sprites for your images and use css to navigate to him.
    Basicly it is way where you create several optimized images for many of your icons, and edit positions of them within css. On this way you reduce number of http requests and time to load of your images...
    And of course, 1000 icons is pretty big number...
     
    infoman66, Sep 11, 2010 IP
  5. sakto

    sakto Active Member

    Messages:
    1,517
    Likes Received:
    42
    Best Answers:
    0
    Trophy Points:
    90
    #5
    You may try off loading your images. Some sites offer this kind of service for free to a certain bandwidth and one of them is http://www.steadyoffload.com/ .
     
    sakto, Sep 11, 2010 IP
  6. wounded1987

    wounded1987 Well-Known Member

    Messages:
    2,914
    Likes Received:
    60
    Best Answers:
    0
    Trophy Points:
    150
    #6
    just like he said + use gzip for that single image. but then u will need to create bunch of css code as well.
     
    wounded1987, Sep 11, 2010 IP
  7. Auxin

    Auxin Peon

    Messages:
    52
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #7
    Try using a nice host to host the images, it does effect the website loading speed.
     
    Auxin, Sep 11, 2010 IP
  8. zuchrivious

    zuchrivious Active Member

    Messages:
    45
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    56
    #8
    the key besides compressing is to minimize HTTP request, CSS sprite technique will be effective to solve your problem, you can also try having a CDN, but CSS Sprite should be your top priority
     
    zuchrivious, Sep 14, 2010 IP
  9. EGG Online

    EGG Online Peon

    Messages:
    59
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #9
    Well, this is oldschool, but still works. A lot of people host their vids and pics on their own site..which, in case of free or low cost webhosting just isn't good for speed.

    If you're using free or low cost host, then upload your pics to flickr, and let their server share the load. Flickr is designed to be an image server, so use it.
    Youtube is designed to be a video server, so use that for vids if you're having speed issues.
     
    EGG Online, Sep 14, 2010 IP
  10. temp2

    temp2 Well-Known Member

    Messages:
    1,231
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    150
    Digital Goods:
    2
    #10
    load 2k images each time? why do include that amount in a page?
     
    temp2, Sep 14, 2010 IP
  11. RoyalTouchDesigns

    RoyalTouchDesigns Active Member

    Messages:
    146
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    75
    #11
    Hello !
    Like others said. Get a competent hosting service. That really matters. And secondly when you export your PSD file to html , adjust the quality which suits you. Sometimes it happens that the quality number decreases then even the pics donot change alot. Adjust the quality bar to the point where images look good.
    Do one thing. When the optimed menu opens. Collectively select all the images slices and then work on the quality. And keep your eye on the loading time below. It would be easier to understand.

    Best of Luck. :)
     
    RoyalTouchDesigns, Sep 15, 2010 IP