Jump to content

Assistance compressing images for display on the web

Recommended Posts

Hello,I’m wondering what the ideal method would be to compress my jpeg files, without losing quality. I’m an illustrator who created my illustrations 30x24 inches on Apple’s Procreate software. I wanted to ensure they wouldn’t lose quality once printed to this large size. However, they’re now 7200x9000 px (65MP) and 172 MB. Much greater than the recommended size of under 60MP and between 500KB-20MB, for Squarespace image uploading requirements.I’ve tried photoshop (following suggested steps, listed under my signature), but could only compress an image to 6.2MB. Smaller but still larger than recommended, given I plan to display multiple images per website page, and the recommended total MB per page is under 5MB (ideally under 1MB), to ensure efficient loading times. The pixel dimensions were also still unchanged (7200x9000px/65MP). Is there another method, aside from photoshop, I should be using, or did I use photoshop incorrectly?Hoping I can find a solution to decrease both my MB and MP, and still preserve my image quality. I’d like to avoid having to re-illustrate every single one of my files, just to share online...

Please let me know if you require any further information/attachments to better assist.

Many thanks for your help!

Photoshop steps I used:-save file as a jpeg (click “save for web” under “file” menu)-compress the file to between 60-80%-click save

Link to comment
  • Replies 15
  • Created
  • Last Reply

Can you provide an example?

About: Squarespace Circle Leader since 2017. I value honesty, transparency, diversity and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. 
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Catch up on all the release notes and announcements 2023 [for Circle members only]. There's a public version here too!
If I helped, you can thank me by clicking one of the emojis below. If you prefer, you can buy me a coffee.
Improve your online store with our extensions.

Link to comment

It is difficult to help you when we cannot see the file. Where can we find one of these files?

About: Squarespace Circle Leader since 2017. I value honesty, transparency, diversity and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. 
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Catch up on all the release notes and announcements 2023 [for Circle members only]. There's a public version here too!
If I helped, you can thank me by clicking one of the emojis below. If you prefer, you can buy me a coffee.
Improve your online store with our extensions.

Link to comment

My apologies @Paul2009! :) Please see the following links:

https://drive.google.com/file/d/1bhQiLWrvcVMRwxz6f9jYeyD6aPJ3AoF3/view?usp=drivesdk

https://drive.google.com/file/d/1qXhcpy9CxPpM0ziA59Rjtby6T_qH20Nd/view?usp=drivesdk

https://drive.google.com/file/d/1NColB7Xe-pq4RoXQrh-Nw7SpTjnbKTzh/view?usp=drivesdk

For some reason the MBs to these linked files are appearing smaller than the actual file on my iPad, but hopefully this will provide you with a rough example.

Thank you for your help, I so appreciate it!

Link to comment

My apologies @Paul2009! :) Please see the following links:

https://drive.google.com/file/d/1bhQiLWrvcVMRwxz6f9jYeyD6aPJ3AoF3/view?usp=drivesdk

https://drive.google.com/file/d/1qXhcpy9CxPpM0ziA59Rjtby6T_qH20Nd/view?usp=drivesdk

https://drive.google.com/file/d/1NColB7Xe-pq4RoXQrh-Nw7SpTjnbKTzh/view?usp=drivesdk

For some reason the MBs to these linked files are appearing smaller than the actual file on my iPad, but hopefully this will provide you with a rough example.

Thank you for your help, I so appreciate it!

Link to comment

The files you've linked are compressed files and are only up to 6MB. These shouldn't cause you any issues.

About: Squarespace Circle Leader since 2017. I value honesty, transparency, diversity and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. 
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Catch up on all the release notes and announcements 2023 [for Circle members only]. There's a public version here too!
If I helped, you can thank me by clicking one of the emojis below. If you prefer, you can buy me a coffee.
Improve your online store with our extensions.

Link to comment

Thank you @Paul2009. However, I just tried uploading these files (they were my Procreate files which I’d saved to my Gmail drive - which I think must have compressed their MBs...) but my squarespace website gave the error message “We were unable to process your file. Please try again.” The website also says “processing and resizing.” when I initially try to upload the image. I think the issue is my MPs (megapixels) are too big (per my note in my initial question). Any advice would be so appreciated! Thanks again!

Link to comment

Thank you @Paul2009. However, I just tried uploading these files (they were my Procreate files which I’d saved to my Gmail drive - which I think must have compressed their MBs...) but my squarespace website gave the error message “We were unable to process your file. Please try again.” The website also says “processing and resizing.” when I initially try to upload the image. I think the issue is my MPs (megapixels) are too big (per my note in my initial question). Any advice would be so appreciated! Thanks again!

Link to comment

I suggest you use a commercial compression service like tny png. They use smart compression techniques to reduce the file size and the effect is nearly invisible. When I compress your first image above (posted at 6.2MB) I can compress it to 800KB without being able to determine which is which.

About: Squarespace Circle Leader since 2017. I value honesty, transparency, diversity and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. 
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Catch up on all the release notes and announcements 2023 [for Circle members only]. There's a public version here too!
If I helped, you can thank me by clicking one of the emojis below. If you prefer, you can buy me a coffee.
Improve your online store with our extensions.

Link to comment

I suggest you use a commercial compression service like tny png. They use smart compression techniques to reduce the file size and the effect is nearly invisible. When I compress your first image above (posted at 6.2MB) I can compress it to 800KB without being able to determine which is which.

About: Squarespace Circle Leader since 2017. I value honesty, transparency, diversity and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. 
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Catch up on all the release notes and announcements 2023 [for Circle members only]. There's a public version here too!
If I helped, you can thank me by clicking one of the emojis below. If you prefer, you can buy me a coffee.
Improve your online store with our extensions.

Link to comment

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.