Moz Q&A is closed.
After more than 13 years, and tens of thousands of questions, Moz Q&A closed on 12th December 2024. Whilst we’re not completely removing the content - many posts will still be possible to view - we have locked both new posts and new replies. More details here.
High resolution (retina) images vs load time
-
I have an ecommerce website and have a product slider with 3 images.
Currently, I serve them at the native size when viewed on a desktop browser (374x374).
I would like to serve them using retina image quality (748px).
However how will this affect my ranking due to load time?
Does Google take into account image load times even though these are done asynchronously? Also as its a slider, its only the first image which needs to load. Do the other images contribute at all to the page load time?
-
"Large pictures tend to be bad for user experience."
I disagree. I think what you mean is slower loading is bad for the user experience. Higher quality pictures are better for the user experience.
I've been looking into deferring loading of the additional slider images. That should definitely improve load time as all the bandwidth can be used to download the first slider image.
Also the first slider image if you use a progressive format should show something quickly and then improve over time.
-
You also have to keep in mind that users will access your site from mobile devices and that the larger the page the longer it takes to load fully. You may lose some people during the time it takes to load the page. My website used to have a slider with three images. i removed the slider and replaced it with one static image. Large pictures tend to be bad for user experience.
-
Hey Dwayne
They are big images but from experience I have never seen a meaningful impact from these kind of changes (in around 15 years). Maybe work on optimising the images themselves as best as possible to bring the overall size down as much as possible. Sure, if your site is a slow loading nightmare and this is just the final straw then it may be an issue but by the sounds of it you are already taking that into consideration and your site is well hosted and performs better than most of everything else out there.
But, as ever in this game, my advice would be to be aware of possible implications, weigh up the pros and cons and then test extensively. If you see an impact in your loading time and search results (and more importantly in user interaction, bounce etc) after changing this one factor then you know you can roll it back.
Hope that helps
Marcus
-
Hi,
Its not that small a change...the size of each image will quadruple from around 10kb to 40kb. As there are three images thats 90kb more data. Which is around 20% of the total page size.
That's interesting what you mention about the first byte load time. I would have thought that was overly simple and would definitely have assumed Google would actually be more concerned with how long it takes for the page "to load" (e.g. using their pagespeed metrics).
I've optimized my site extensively and have pagespeed score of 95% and I use the amazon AWS servers.
I agree with your idea about doing what's right for my users. But if Google includes the image load time then my site will rank poorly and then I won't have any users!
In summary, I think what this question really comes down to is how does Google calculate page load times and does this include image load time and does it include load time for all images (even ones which aren't being rendered in the slider).
Thanks,
Dwayne
-
Hey
I think this is such a small issue overall that you should not worry about a slight increase in image sizes damaging your SEO (assuming everything else is in place).
I would ask myself the questions:
- Is this better for my site users?
- does the seriously impact load times (and therefore usability / user experience)?
If you believe it creates a better experience and does not impact loading times in a meaningful way then go for it and don't worry about a likely negligible impact on loading times.
A few things I would do:
- test average loading times with a tool like pingdom: http://tools.pingdom.com/fpt/
- replace your images and test again
- look at other areas where you can speed up loading times
- make sure your hosting does not suck
For reference there was a post here a while back re the whole loading times / SEO angle that determined it was time to first byte (response time) rather than total loading time that had the impact - this would make total loading time academic from a pure SEO perspective but... it's really not about SEO, it's about your site users and whether this makes things better (improved images) or worse (slow loading) for them.
Seriously - don't worry about this small change too much from an SEO perspective. Use it as an excuse to improve loading time as that is a good exercise for lots of reasons but go with what is right for your users.
Hope that helps
MarcusRef
http://azwa.1clkaccess.in/blog/how-website-speed-actually-impacts-search-rankinghttp://azwa.1clkaccess.in/blog/improving-search-rank-by-optimizing-your-time-to-first-byte
Got a burning SEO question?
Subscribe to Moz Pro to gain full access to Q&A, answer questions, and ask your own.
Browse Questions
Explore more categories
-
Moz Tools
Chat with the community about the Moz tools.
-
SEO Tactics
Discuss the SEO process with fellow marketers
-
Community
Discuss industry events, jobs, and news!
-
Digital Marketing
Chat about tactics outside of SEO
-
Research & Trends
Dive into research and trends in the search industry.
-
Support
Connect on product support and feature requests.
Related Questions
-
Structured data: Product vs auto rental schema?
Hi mozzers, If you are rental company, is it useful to add both the product and auto rental schemas or auto rental schema on its own should just be enough? Finally, on the auto rental schema, you have to add an address. Could we just add a city instead of an entire address and avoid receiving a warning message on the strutured data testing tool? Thank you.
Intermediate & Advanced SEO | | Ty19860 -
Image Audit: Getting a list of *ALL* Images on a Site?
Hello! We are doing an image optimization audit, and are therefore trying to find a way to get a list of all images on a site. Screaming Frog seems like a great place to start (as per this helpful article: https://azwa.1clkaccess.in/ugc/how-to-perform-an-image-optimization-audit), but unfortunately, it doesn't include images in CSS. 😞 Does the community have any ideas for how we try to otherwise get list of images? Thanks in advance for any tips/advice.
Intermediate & Advanced SEO | | mirabile0 -
URL structure - Page Path vs No Page Path
We are currently re building our URL structure for eccomerce websites. We have seen a lot of site removing the page path on product pages e.g. https://www.theiconic.co.nz/liberty-beach-blossom-shirt-680193.html versus what would normally be https://www.theiconic.co.nz/womens-clothing-tops/liberty-beach-blossom-shirt-680193.html Should we be removing the site page path for a product page to keep the url shorter or should we keep it? I can see that we would loose the hierarchy juice to a product page but not sure what is the right thing to do.
Intermediate & Advanced SEO | | Ashcastle0 -
Lazy Loading of products on an E-Commerce Website - Options Needed
Hi Moz Fans. We are in the process of re-designing our product pages and we need to improve the page load speed. Our developers have suggested that we load the associated products on the page using Lazy Loading, While I understand this will certainly have a positive impact on the page load speed I am concerned on the SEO impact. We can have upwards of 50 associated products on a page so need a solution. So far I have found the following solution online which uses Lazy Loading and Escaped Fragments - The concern here is from serving an alternate version to search engines. The solution was developed by Google not only for lazy loading, but for indexing AJAX contents in general.
Intermediate & Advanced SEO | | JBGlobalSEO
Here's the official page: Making AJAX Applications Crawlable. The documentation is simple and clear, but in a few words the solution is to use slightly modified URL fragments.
A fragment is the last part of the URL, prefixed by #. Fragments are not propagated to the server, they are used only on the client side to tell the browser to show something, usually to move to a in-page bookmark.
If instead of using # as the prefix, you use #!, this instructs Google to ask the server for a special version of your page using an ugly URL. When the server receives this ugly request, it's your responsibility to send back a static version of the page that renders an HTML snapshot (the not indexed image in our case). It seems complicated but it is not, let's use our gallery as an example. Every gallery thumbnail has to have an hyperlink like: http://www.idea-r.it/...#!blogimage=<image-number></image-number> When the crawler will find this markup will change it to
http://www.idea-r.it/...?_escaped_fragment_=blogimage=<image-number></image-number> Let's take a look at what you have to answer on the server side to provide a valid HTML snapshot.
My implementation uses ASP.NET, but any server technology will be good. var fragment = Request.QueryString[``"_escaped_fragment_"``];``if (!String.IsNullOrEmpty(fragment))``{``var escapedParams = fragment.Split(``new``[] { ``'=' });``if (escapedParams.Length == 2)``{``var imageToDisplay = escapedParams[1];``// Render the page with the gallery showing ``// the requested image (statically!)``...``}``} What's rendered is an HTML snapshot, that is a static version of the gallery already positioned on the requested image (server side).
To make it perfect we have to give the user a chance to bookmark the current gallery image.
90% comes for free, we have only to parse the fragment on the client side and show the requested image if (window.location.hash)``{``// NOTE: remove initial #``var fragmentParams = window.location.hash.substring(1).split(``'='``);``var imageToDisplay = fragmentParams[1]``// Render the page with the gallery showing the requested image (dynamically!)``...``} The other option would be to look at a recommendation engine to show a small selection of related products instead. This would cut the total number of related products down. The concern with this one is we are removing a massive chunk of content from he existing pages, Some is not the most relevant but its content. Any advice and discussion welcome 🙂0 -
Image URLs - best practice
Hi - I'm assuming image URL best practice follows same principles as non image URLs (not too many files and so on) - I notice alot of web devs putting photos in subdomains, so wonder if I'm missing something (I usually avoid subdomains like the plague)!
Intermediate & Advanced SEO | | McTaggart1 -
508 compliance vs good SEO re: Image alt tags
I'm currently in debate with our 508 compliance team over the use of alt tags on images. For SEO, it is best practice to use alt tags so that readers can tell what the image represents. However, they are arguing that these images should NOT have alt text as it doesn't add anything to the disability screen reader as the image text would be repetitive with the text on the page. I feel they are taking the "decorative" image concept in 508 compliance too far. It's intention is for images for bullets, etc that truly are decorative in nature and add no benefit to the reader. What is the communities thoughts on this? Have you ever run into scenario where 508 is attempting to ruin SEO? Usually the 2 play nicely.
Intermediate & Advanced SEO | | jpfleiderer0 -
Images Returning 404 Error Codes. 301 Redirects?
We're working with a site that has gone through a lot of changes over the years - ownership, complete site redesigns, different platforms, etc. - and we are finding that there are both a lot of pages and individual images that are returning 404 error codes in the Moz crawls. We're doing 301 redirects for the pages, but what would the best course of action be for the images? The images obviously don't exist on the site anymore and are therefore returning the 404 error codes. Should we do a 301 redirect to another similar image that is on the site now or redirect the images to an actual page? Or is there another solution that I'm not considering (besides doing nothing)? We'll go through the site to make sure that there aren't any pages within the site that are still linking to those images, which is probably where the 404 errors are coming from. Based on feedback below it sounds like once we do that, leaving them alone is a good option.
Intermediate & Advanced SEO | | garrettkite0 -
Different Header on Home Page vs Sub pages
Hello, I am an SEO/PPC manager for a company that does a medical detox. You can see the site in question here: http://opiates.com. My question is, I've never heard of it specifically being a problem to have a different header on the home page of the site than on the subpages, but I rarely see it either. Most sites, if i'm not mistaken, use a consistent header across most of the site. However, a person i'm working for now said that she has had other SEO's look at the site (above) and they always say that it is a big SEO problem to have a different header on the homepage than on the subpages. Any thoughts on this subject? I've never heard of this before. Thanks, Jesse
Intermediate & Advanced SEO | | Waismann0