Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

We've moved the forum!

Please use forum.silverstripe.org for any new questions (announcement).
The forum archive will stick around, but will be read only.

You can also use our Slack channel or StackOverflow to ask for help.
Check out our community overview for more options to contribute.

General Questions /

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, Ed, biapar, Willr, Ingo, swaiba

How can the quality of through SilverStripe resized images be increased?


Go to End


6 Posts   4052 Views

Avatar
MarioSommereder

Community Member, 107 Posts

2 May 2013 at 8:46pm

Hi,

I use the command

$Visual.SetRatioSize(1200, 430).Url
to ensure a pixel perfect output even when the user uploads a not perfectly cut image through the backend. Right now I noticed, that the quality my be decreased significantly - see attachments.

Can anyone help me to fix this? Thanks in advance!

Cheers, Mario

Avatar
kinglozzer

Community Member, 187 Posts

3 May 2013 at 3:17am

In your _config.php:

GD::set_default_quality(80);

I think the default is 75 if I remember correctly, so try something a little above that. Try to balance quality with filesize, simply ramping up the quality will make your image filesizes massive.

Avatar
Webdoc

Community Member, 349 Posts

3 May 2013 at 3:39am

One more possibility is using PNG files to get better color qualtity.

Arvixe Web Hosting / SilverStripe Community Liaison | Looking for quality SilverStripe Web Hosting? Look no further than Arvixe Web Hosting!

Avatar
MarioSommereder

Community Member, 107 Posts

3 May 2013 at 5:06am

Thanks kinglozzer. It can be that easy :-)

Unfortunately the quality at 100 is still not very good (see attachment).

Using .png is not an option, because it's just to large.

Avatar
Bambii7

Community Member, 254 Posts

3 May 2013 at 6:44pm

Edited: 03/05/2013 6:44pm

I think for ultimate quality, if its desired, images should be edited in your favourite image editing tool (Gimp) then uploaded.
If you have an image say 1000 px wide but your max content width is 600 px, you resize it with SS $Image.SetWidth(600) you're going to have quality issues even if your quality is set to 100
GD::set_default_quality(100);

If you had a 2px border around the original 1000 wide image thats going to translate to 1.6px in the 600 wide image. This can't accurately render onto pixels so it gets blurred which is normal behaviour.

The blurring that occurs isn't so important for jpegs of people or scenery, as these images are already blurry and it's not as noticeable when the quality drops on resize. However in the example of SetRatioSize1200430-Legal-Situation-de.jpg it's Plain text on a white background. In these cases the quality drop will be most apparent. As you can now see, by the naked eye, the subtle blurring around the crisp outline of the text.

My rule of thumb, if its an image of text, logo, or flat colour like an icon. Use PNG format and don't dynamically resize. Export them at the right size and use them as is on the site. For images basically of anything taken by a normal camera, use jpeg and resize the hell out of em. Clients notoriously upload 3000px wide images straight from their camera and wonder why their site is slow.

Avatar
MarioSommereder

Community Member, 107 Posts

3 May 2013 at 7:11pm

Yes, I know all of that, but I'm not the one editing content through the CMS in the end. And as a developer, I want to ensure, that all the data the site outputs, does not crash the layout. The resize is not because of the image size in KB, it's because of it's dimensions.

But true, I didn't recognize the quality loss in regular photos without typo. So it's up to the client to pay attention to what they're doing.

Thanks everyone for the feedback.

Cheers, Mario