Images and pagespeed

by Darow 7 replies
I haven't been able to find a post related or a more specific section.

I have several websites, and Im worrying about technical stuff now since it's a fact pagespeed has importance into google's eyes.

What is better/faster for the page, in your opinion?

a) 2 images on a page. 1 is 500x500 and the 2nd is the same exact image/file but resized it to 20x20.

b) 2 images on a page. 1 is 500x500 and the 2nd is the same but 20x20 and uploaded as a different file.

Which one does is faster?
#search engine optimization #images #pagespeed
Avatar of Unregistered
  • Profile picture of the author yukon
    When you have an image where the original size is large (ex: 500x500px) & then scale the image down with HTML, your still loading a 500x500 size image, so it's still going to take however long it takes to load the 20x20 image that was scaled down with HTML.

    Scale your image down offline then upload as a new image (new filename).
    Signature
    Hi
    {{ DiscussionBoard.errors[9690811].message }}
    • Profile picture of the author Darow
      Originally Posted by yukon View Post

      When you have an image where the original size is large (ex: 500x500px) & then scale the image down with HTML, your still loading a 500x500 size image, so it's still going to take however long it takes to load the 20x20 image that was scaled down with HTML.

      Scale your image down offline then upload as a new image (new filename).
      Oh I see. But if the 500x500 has to load anyways... Does the 2nd image loads as a second image even though its the same? Or because the 1st has been loaded it take less?

      Thanks
      {{ DiscussionBoard.errors[9690824].message }}
      • Profile picture of the author yukon
        Originally Posted by Darow View Post

        Oh I see. But if the 500x500 has to load anyways... Does the 2nd image loads as a second image even though its the same? Or because the 1st has been loaded it take less?

        Thanks
        That's still loading the 500x500 image twice on the same page. The HTML is still setup as an individual image, it's just calling the same image twice. So it's using the same 500x500 bandwidth even If the 2nd image is scaled down to 20x20 with HTML.

        You still have some room to play with, example say your image is 500x500 but your webpage needs the image to be shown as 480x480, I wouldn't waste my time resizing something so minimal in that case. In that case I would just scale the image down with HTML, it's only 20x20px, which isn't going to slow down a browser anymore than scaling the image down to the exact size (ex: 480x480). If you had dozens of images that 20x20px could add up, but for one or two images per page it's no big deal.

        Your OP example is an extreme case, the image size is drastically reduced (500x500 vs 20x20), that image needs resized offline.
        Signature
        Hi
        {{ DiscussionBoard.errors[9690878].message }}
  • Profile picture of the author MikeFriedman
    The second one is faster.

    Browsers load full size images and then resize them according to the CSS/HTML instructions.

    Better to use the exact image size you need than to resize it.
    {{ DiscussionBoard.errors[9690836].message }}
    • Profile picture of the author Darow
      Thanks guys. That makes it clearer.

      So even though the second load is faster, is always better to make exactsized images. I thought they would load as one.. Ok, thanks!
      {{ DiscussionBoard.errors[9690841].message }}
  • Profile picture of the author Afiqfikri Daud
    Yes, I'm agree with Yukon,

    it is better to upload the right image size at the first place than resize using html
    {{ DiscussionBoard.errors[9692098].message }}
  • Profile picture of the author vdsthor
    the disadvantages of hotlinking worth bearing in mind are that the webpage normally loads slower as soon as you link to images stored on a separated web hosting server than the website is hosted on, and the owner of the image has overall control to put out of action a image hotlinking. Image Hotlinking Creates massive Bandwidth loads.

    Every search engine required providing users a most excellent user experience, just like Google, in addition to a speedy site improves generally site excellence and increases user fulfillment. Everyone deserves a high-speed online experience.
    {{ DiscussionBoard.errors[9692213].message }}
Avatar of Unregistered

Trending Topics

  • 99 {{ upvoteCount | shortNum }}

    Warriors .... Warriors.... what would you like to LEARN?

    Good Morning awesome Warriors... I'm happy to announce that The Warrior Forum is planning to create our first COURSE. Yes... Powered by Warrior Wisdom... yeah!! Made at home. But before ... [read more]

  • 2 {{ upvoteCount | shortNum }}

    Is this true? Can we sell on premium themes?

    asc in Internet Marketing

    I was looking for a particular WP theme and it costs around $100. Then an advert popped up saying I could purchase it for $4.99. Went to the site to ... [read more]

  • 66 {{ upvoteCount | shortNum }}

    How I Sold 985 Copies of an Affiliate Offer in 5 Days (Step by Step)

    When I first started online in 2002, it took me a year to sell 985 copies of anything. These days, I can typically do it in the span of a ... [read more]

  • 33 {{ upvoteCount | shortNum }}

    1 Powerful Concept that Grows Your Business

    Connect with people interested in what you have to offer. Mindfully. Versus desperately running from prospect to prospect, or from number to number. This idea sounds simple, and like common ... [read more]

  • 1 {{ upvoteCount | shortNum }}

    what video games are your currently playing that are worth checking out this weekend?

    sunnykhan345 in Off Topic

    what video games are your currently playing that are worth checking out this weekend?