Optimizing image sizes for SEO

Highlighted
Tourist
6 0 1

So my biggest loading speed comes from images. I've looked around for few hours now but just can't seem to understand how you actually optimize them. I mean simply playing with the size leaves awkward look on the. From my understanding, the images of the different collections on frontpage don't have to be as big but if you simply reduce the size then the actual product page image is small as well.

Basically what would be the most newbie friendly way to optimize the images for now? I don't have that many images at the moment, would just simply making the size of each image as small as possible without sacrificing too much quality be the way? I really have beginner understanding of code so no clue how to change the code for this one everywhere I looked they seem to explain it way too advanced just don't get it. 

"is resized in HTML or CSS from 480x480 to 177x177" Does this mean that the ideal product page size in this case is 480 but for the collections, it should be 177? How do I optimize for this the smartest way?

Thanks for anyone who has time to help

 

Highlighted
Shopify Partner
43 0 4

Hi!

 

There are a lot of apps for Shopify that help with Image resizing - also for SEO purposes - did you check them out?

https://apps.shopify.com/search?q=image+resize

 

BTW - Do you know the Google Page Speed Insights? It's often very helpful in speed-related issues?

https://developers.google.com/speed/pagespeed/insights/

 

 

--

Sales vs Weather Report - how weather-dependent are your sales?

Zombie Meter checks the quality of your traffic. Remember -  Zombies don't buy products. Customers buy products.

Want to know how many Zombies visit your store or how Weather-dependent are your sales? We got apps for that - http://appsforecommerce.com/
Highlighted
Excursionist
54 1 7

Hello Ep,

Optimizing images is very key for SEO; hence, should be taken seriously. Aside from that, it also hlsps with your page speed. This app will help with optimizing your images and other SEO issues.

Hope this helps,

Naana.

Highlighted
Shopify Expert
1208 60 359

I agree, using an app or a software to optimize the images for the web is the way to go. It's not always down to the image size, although the rule of thumb is that that the bigger images load slower. It's more about compressing the files so the images are web-friendly. Picmonkey has an option of compressing file sizes, as well as your computer's default image viewing/editing program should have it too. Apps are also a great option. 

Highlighted
Shopify Staff
Shopify Staff
1400 139 384

Hey there Ep,

Bo here from Shopify Support!

Great insight, you are absolutely correct when it comes to image size slowing down your page load time. By decreasing the size of the image files on your webpage and increase page load speed, fewer will leave your site without letting it load.

One way you can reduce image file size is by using the "Save for Web" command in Adobe Photoshop. When using this command, you will want to adjust the image to the lowest file size possible while keeping an eye out for image quality.

  • Quality: Find this in the top, right-hand corner (i.e. 70).
  • File format: Find this in the top, right-hand corner (i.e. JPEG).
  • Optimization: Find this checkbox in the top, right-hand corner (i.e. Optimized).
  • Color: Find this checkbox in the top, right-hand corner (i.e. Convert to sRBG).
  • Downsizing and sharpening: Find this in the bottom, right-hand corner (i.e. W: and H:).
  • Expected file size: Find this in the bottom, left-hand corner (i.e. 136.7K).

If you don't have photoshop, don't fret! There are numerous free alternatives that have been mentioned earlier in this thread. Adobe even has a free mobile app, Photoshop Express for mobile devices and tablets.

Other impressive online image editing tools are:

  • PicMonkey has been described by experts as a "staggeringly great photo editing tool".
  • PIXLR is super user-friendly and comes with a 100% free app for your smartphone, so you can edit on the go.
  • Canva is another fairly advanced online image editor.

For e-commerce images, a good rule of thumb is to try to keep your image file size below 70 kb. That can be difficult at times, especially for larger images.

As previously mentioned in this thread, apps are often the easiest, most pain-free way to optimize your page's images. I would recommend SEO Image Optimizer or Image Optimizer as they are the best-rated image optimization apps that can be found in our app store, the home to all of our best apps!

Let me know how this goes and if there is anything else I can help you with, I'm happy to help!

All the Best,
Bo

Bo - Social Care @ Shopify


Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution
To learn more visit the Shopify Help Center or the Shopify Blog

Highlighted

Simple --> use these  tinyjpg.com  and tinypng.com  - they shrink large files down and keep quality.  

 

You can use google page speed insights,  tools.pingdom.com or gtmetrix.com to see where your site needs help.

 

James

James Byrne, Owner, Information Architect (USMC VET)
After Dark Grafx - Since 1992
"We Work After Dark, So You Don't Have To!"
https://www.afterdarkgrafx.com

Services: Website Design, Mobile App Development (iOS, Android, Windows), Ecommerce, Magento, Shopify, Miva, BigCommerce, Search Engine Optimization, Wordpress, Hosting, Graphic Design, Merchant Accounts, Consulting and all things web related!

Certified Partner/Developer/Affiliates: Shopify, Google Integrator, Wordpress, Zoho, AuthorizeNet, Geotrust and a Member of the San Diego Regional Chamber of Commerce, Veteran Owned Businesses, Veteran's In Business Network.

I also build custom apps for Shopify!
Highlighted

If your using heavy images in your blog or article in your website, so site to be lazy to load whole page, finally i am saying to that it is the bad practice of SEO. if you want less load time, we have to be use tinypng.com for compressing images. 

Alice Technical Content Developer, Blogger, SEO at Javatpoint.com
0 Likes