#1
  1. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Dec 2000
    Location
    Australia
    Posts
    5
    Rep Power
    0

    Question


    I am a newbie and I have a genral question here:

    Is it better to have many small images loading (1-2KB) or larger (cut) sections of the same image (total 130KB). I am primarily asking about loading speed, do the smaller images, even though they equal the total download size, load faster then say the same image only cut into 5 x 25KB sections???

    Also I have designed a page that incorporates a scrolling marquee, can I force the images to load before the marquee (as it seems to slow the total download quite effectively)
    ????

    appreciation for any help in advance
  2. #2
  3. No Profile Picture
    Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2001
    Location
    Salt Lake City, Utah
    Posts
    48
    Rep Power
    14
    Dogman,

    okay, heres the poop...technically, the one large image will actually load faster than many smaller images because your computer doesn't have to talk to the server a bunch of times to get the info for a bunch of pics. however, if you do load it as a bunch of smaller pics, the user will see that something is happening (pieces loading), and are less likely to jump off your site because they think that nothing is happening...plus the download time isn't really that much more. and i would actually warn against using such large file sizes on the net so that users won't get bored waiting for your site to load...unless it's an art site and you're willing to chance it.

    and i would also strongly suggest not using a scrolling marquee for the same reason...and they tend to be pretty tacky. ;) but again, if it's done tastefully and/or artsy, then go for it...just try to keep your users in mind. just my two cents...

    hope this helps...

    jason ;)
    --there's a madness to my method.--
    www.theartofsynapse.com
  4. #3
  5. No Profile Picture
    Resident Moron
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2001
    Location
    Tuscaloosa, AL
    Posts
    26
    Rep Power
    0
    A little more to add on...

    There's actually a happy medium between one big image and a zillion little images... keep in mind that the more images there are on the page, the longer it takes to actually RENDER in the browser. This can actually make more of a difference than the added server-browser connections on slower machines.

    I will say that there are a large number of ways that Java-based scrolling marquee-type-things can be useful and "untacky", but a much larger number that just look gaudy. Nevertheless, I'm not aware of any way to set the download precedence with HTML. There may be some way to maniuplate where stuff is located in the page.

    You may be able to preload all of the images with Javascript, but that could cause the same issues as having one big image.

    Just some thoughts.
  6. #4
  7. No Profile Picture
    Nobody knows
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2001
    Location
    Dallas
    Posts
    69
    Rep Power
    14
    Get rid of the scrolling marquee as Netscape 6 users wont be able to see it anyway. While if you listen to pete with finding a better Java applet to handle that very thing it will be seen that way you meant it to by all visitors and it is a lot more visually pleasing then the microsoft scrolling marquee.

    TD_Paladin
  8. #5
  9. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2001
    Posts
    17
    Rep Power
    0

    Post


    Iīve always tried to use graphics in a way so that every page doesnīt have more than 100k to load, this of course only works on regular pages, not art or graphically built pages, have you tried increasing the compression of the image, or reduced the jpeg-quality. This must of course be done with caution, since it can mess up your image.

    I also agree concerning the java-applet, try finding an optimized applet, there are many to choose from, and a tip is trying the loadtime locally first, if your browser hesitates, and shows a grey area, donīt use that applet, try another.


  10. #6
  11. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2000
    Posts
    11
    Rep Power
    0

    Lightbulb


    If we're talking about site layout graphics here (a header or menubar, and not a photo), I would tend to cut it up into smaller pieces. With a header not every bit of it will be the same, so you can apply different rates of compression to each cut to achieve the best speed/ quality compromise. You do have to experiment a bit to find where its best to cut and where you can lose quality without affecting the joins. You also have the choice of saving as GIF or JPG on each bit.


    Graham
  12. #7
  13. No Profile Picture
    Junior Memberette:)
    Devshed Newbie (0 - 499 posts)

    Join Date
    Mar 2001
    Posts
    10
    Rep Power
    0

    Comment from the peanut gallery :) Ss


    I just want to say I think your all very informative and I enjoy reading your comments I think I like this site! If any of you get a moment and can view my comment I'd love to get your input. Doggy I agree with Id -Machine If you see the smaller images loading you are more likely to wait then if you only see one huge outline of an image. That would make my mouse finger twitchy too ss
  14. #8
  15. No Profile Picture
    Senior Meddler
    Devshed Newbie (0 - 499 posts)

    Join Date
    Dec 2000
    Location
    NY NY USA
    Posts
    142
    Rep Power
    15
    If you want to preload the images, you can certainly just use the "preload" portion of a JS rollover ... something like:

    Code:
    if (document.images) {
       pic1 = new Image (); pic1.src = "firstpicture.gif";
       pic2 = new Image (); pic2.src = "secondpicture.gif";
       ...
    }
    That'll cache the images -- and no one says you have to use them as rollover graphics


    As for some source code on JS scrolling images, if any of y'all want to take a peek at a couple of examples you can see them posted at http://homepage.newschool.edu/~rober...l/imagescroll/. The code for any of the four pages there is pretty heavily commented. Enjoy!

    cheers,
    bob
    --
    Bob Boyle
    boyleb@rappdigital.com
    www.rappdigital.com
  16. #9
  17. No Profile Picture
    Seņor Member
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Aug 2000
    Posts
    1,157
    Rep Power
    38

    One more tip


    If you know the dimensions, it would be a good idea to put them inside the parentheses of new Image(), seperated by a comma (x, y). This will help your browser in building the page and should speed up the page.
    Michael
  18. #10
  19. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2001
    Location
    England
    Posts
    15
    Rep Power
    0

    Arrow Image(x,y)..


    Now, THAT I didn't know ... !

    Tell you what, it's all good stuff in here today

    Keep up the good communication everyone!

IMN logo majestic logo threadwatch logo seochat tools logo