[PHP] Afb. verkleinen in hoge kwaliteit (GD2/ImageMagick)

[Jitse H]

Ik heb een vreemd probleem. Ik ben bezig voor een website met veel foto's.
Deze foto's moeten in fijne kwaliteit worden getoond.

De bronbestanden van de foto's zijn gemiddeld:
Bestandsgroote: 7 MB
Resolutie: 4272 x 2848
DPI: 240

Deze afbeeldingen moeten natuurlijk worden verkleind zodat ze snel laden en niet veel webruimte innemen.

In eerste instantie heb ik gebruik gemaakt van GD2 ( vrij standaard, met imagecopyresampled() ).
Dit werkt goed alleen de kwaliteit van de afbeeldingen gaat erg achteruit, ondanks dat ik alles op 100% kwaliteit heb gezet.
Als test heb ik ook met ImageMagick afbeeldingen verkleind.

Na het verkleinen met ImageMagick is de kwaliteit wel goed.
Alleen, het vreemde is dat deze hoge kwaliteit alleen in de volgende browsers te zien is:
- FireFox 9.0.1
- Safari 5.0.2

In de volgende browsers is de foto in dezelfde slechte kwaliteit als GD2 te zien:
- Opera 11.61
- Internet Explorer 8
- Internet Explorer 9
- Google Chrome 16.0.912.77

Een verschil wat ik heb opgemerkt is dat ImageMagick de EXIF data laat staan.
Als ik deze door ImageMagick laat strippen, dan zakt de kwaliteit ook in Firefox en Safari naar het niveau van GD2.

Wie weet hoe ik alle browsers de hoogste kwaliteit laat tonen?

Voorbeeld foto GD2: klik hier
Voorbeeld foto ImageMagick: klik hier

Het verschil zit hem voornamelijk in de duidelijkheid van de foto. Bij GD is het wazig. Het verschil is het grootst te zien in het gras. Dat is bij de ImageMagick versie veel donkerder.

Alvast bedankt voor jullie meedenken!

[--MeAngry--]

De EXIF-informatie bevat onder andere het kleurprofiel waarmee de foto is opgeslagen en als browser daar niet mee om kan gaan, gebruikt deze gewoon het standaard kleurprofiel van het OS. Hetzelfde effect dus als de EXIF informatie verwijderen. (Wat GD2 dus doet.)

Het enige wat mogelijk is, is de foto's zelf met een meer standaard kleurprofiel opslaan en op dit kleurprofiel de weergave afstemmen.

Overigens heeft dit niets met de verdere "kwaliteit" van het resizen te maken. Daar is ImageMagick wel beter in, maar ik vind de verschillen amper zichtbaar.

[ Voor 21% gewijzigd door --MeAngry-- op 30-01-2012 23:19 ]

[Jitse H]

--MeAngry-- schreef op maandag 30 januari 2012 @ 23:18:
De EXIF-informatie bevat onder andere het kleurprofiel waarmee de foto is opgeslagen en als browser daar niet mee om kan gaan, gebruikt deze gewoon het standaard kleurprofiel van het OS. Hetzelfde effect dus als de EXIF informatie verwijderen. (Wat GD2 dus doet.)

Het enige wat mogelijk is, is de foto's zelf met een meer standaard kleurprofiel opslaan en op dit kleurprofiel de weergave afstemmen.

Overigens heeft dit niets met de verdere "kwaliteit" van het resizen te maken. Daar is ImageMagick wel beter in, maar ik vind de verschillen amper zichtbaar.

Bedankt voor je snelle reactie.
Zou je mij kunnen aangeven hoe ik de afbeeldingen met "een meer standaard kleurprofiel" kan opslaan? (het is niet mogelijk om de foto vooraf te bewerken, het moet allemaal met PHP o.i.d. behandeld worden).

[ Voor 5% gewijzigd door Jitse H op 30-01-2012 23:29 ]

[RobIII]

Jitse H schreef op maandag 30 januari 2012 @ 23:26:

Zou je mij kunnen aangeven hoe ik de afbeeldingen met "een meer standaard kleurprofiel" kan opslaan?

Wat heb je zelf al gezocht/geprobeerd? (Zie onze Quickstart en scriptrequests). Je maakt me niet wijs dat je in die 8 minuten een serieuze poging ondernomen hebt en [google=imagemagick color profile] lijkt me toch voldoende zinnige informatie te geven om eens mee aan de slag te gaan

[ Voor 10% gewijzigd door RobIII op 30-01-2012 23:37 ]

[Jitse H]

RobIII schreef op maandag 30 januari 2012 @ 23:36:
[...]

Wat heb je zelf al gezocht/geprobeerd? (Zie onze Quickstart en scriptrequests). Je maakt me niet wijs dat je in die 8 minuten een serieuze poging ondernomen hebt en [google=imagemagick color profile] lijkt me toch voldoende zinnige informatie te geven om eens mee aan de slag te gaan

Sorry hoor Ik kon met mijn gebruikte zoektermen niet de juiste informatie vinden.
Zoals je ook in mijn activiteit kunt zien, heb ik uitsluitend anderen geholpen. Het is niet dat ik alles maar laat voorkouwen, ik ben hier de gehele middag al mee bezig en kwam er gewoon niet uit.
Beetje jammer om direct zo aan te vallen.

[RobIII]

Ho, ho, ik val niet aan maar geef je een subtiele hint No hard feelings (en die waren er ook niet)
En je bent nog steeds van harte welkom als je een concrete vraag hebt hoor

Mocht je er behoefte aan hebben hier toch verder op in te haken doe dat dan even in: Feedback op moderatie binnen de Devschuur

[ Voor 57% gewijzigd door RobIII op 30-01-2012 23:48 ]

[--MeAngry--]

Daarnaast is het ook meer de taak aan de fotograaf om foto's 'web-ready' aan te leveren. Zo kan hij zelf bepalen hoe de foto er uiteindelijk uit moet komen te zien.

Maar vergis je sowieso niet. Iedereen heeft een andere monitor, en 99% daarvan is gewoon slecht gekalibreerd. Die mensen zien niet eens dat vlak met een paarse kleur eigenlijk blauw hoort te zijn bijvoorbeeld. Laat staan dat het gras er wat lichter uit ziet. Dat soort problemen houd je toch, hoe goed je de kleuren ook in de foto zelf afstemt.

[ Voor 5% gewijzigd door --MeAngry-- op 30-01-2012 23:52 ]

[Johannes77]

Ik denk dat als je de foto's goed wil bewerken je de eigelijke RAW of TIFF file bewerken, corrigeren en naar een bepaalde maat converteren. Dat je met bestanden van rond de 7 mb werkt wil zeggen dat je met jpg van lage kwaliteit werkt(sorry). Als je met RAW of Tiff werkt, met meer kleurdiepte krijg je vanzelf ook betere foto's

[Jitse H]

--MeAngry-- schreef op maandag 30 januari 2012 @ 23:51:
Daarnaast is het ook meer de taak aan de fotograaf om foto's 'web-ready' aan te leveren. Zo kan hij zelf bepalen hoe de foto er uiteindelijk uit moet komen te zien.

Maar vergis je sowieso niet. Iedereen heeft een andere monitor, en 99% daarvan is gewoon slecht gekalibreerd. Die mensen zien niet eens dat vlak met een paarse kleur eigenlijk blauw hoort te zijn bijvoorbeeld. Laat staan dat het gras er wat lichter uit ziet. Dat soort problemen houd je toch, hoe goed je de kleuren ook in de foto zelf afstemt.

Daar ben ik mij van bewust, maar wat slechter is kan alleen maar slechter worden
Deze foto's komen op een website te staan voor autoliefhebbers, ik krijg klachten dat de foto's er minder mooi uitzien dan op andere websites (waar ze ook staan).

Ik heb onderstaande pagina gevonden die eigenlijk hetzelfde probleem heeft: http://blog.rodneyrehm.de...sers-And-ImageMagick.html
Yeah, I'm not alone!

Hierbij converteren ze het kleurenprofiel. Maar als ik onderstaande code gebruik, zie ik geen verschil

$picture = new Imagick('foto.jpg');
$icc_rgb = file_get_contents('AdobeRGB1998.icc');
$picture->profileImage('icc', $icc_rgb);
$picture->setImageColorspace(IMagick::COLORSPACE_RGB);
$picture->writeImage('test2.jpg');

Klopt het dat ik van ICC naar RGB moet gaan? Ik ben niet bekend met kleurenprofielen...

Johannes77 schreef op dinsdag 31 januari 2012 @ 00:08:
Ik denk dat als je de foto's goed wil bewerken je de eigelijke RAW of TIFF file bewerken, corrigeren en naar een bepaalde maat converteren. Dat je met bestanden van rond de 7 mb werkt wil zeggen dat je met jpg van lage kwaliteit werkt(sorry). Als je met RAW of Tiff werkt, met meer kleurdiepte krijg je vanzelf ook betere foto's

Bedankt voor je reactie. Ik maak de foto's zelf niet, ik moet er alleen voor zorgen dat ze in de hoogste kwaliteit op internet komen te staan. De kwaliteit van de foto's zoals ze zijn ( in 7MB ) is prima, alleen ik merk dat na het verkleinen de foto minder scherp wordt.

[Verwijderd]

Je moet naar sRGB omdat dat de web-standaard is, windows gebruikt ook sRGB.

aRGB, ofwel adobeRGB, omvat een bijna 50% groter spectrum. Dat levert gegarandeerd problemen op met verschillende browsers. Wat er met RGB wordt bedoeld weet ik overigens niet, afaik bestaat er geen 'RGB' kleurruimte.

[Jitse H]

Ik heb i.p.v. de aangegeven AdobeRGB1998.icc van die website, nu de ColorMatchRGB.icc gekozen en nu is het resultaat te zien.

Hij ziet er bij mij nu (op het oog) in elke browser hetzelfde uit
Bedankt voor jullie bijdrage.

[TheNephilim]

Jitse H schreef op dinsdag 31 januari 2012 @ 00:30:
Ik heb i.p.v. de aangegeven AdobeRGB1998.icc van die website, nu de ColorMatchRGB.icc gekozen en nu is het resultaat te zien.

Hij ziet er bij mij nu (op het oog) in elke browser hetzelfde uit
Bedankt voor jullie bijdrage.

Ik zou die rand om je afbeeldingen weghalen en iets met CSS doen, mooier en zo hoef je niet al je foto's weer opnieuw te uploaden als je de stijl van de website veranderd oid.

[Jitse H]

TheNephilim schreef op dinsdag 31 januari 2012 @ 13:45:
[...]


Ik zou die rand om je afbeeldingen weghalen en iets met CSS doen, mooier en zo hoef je niet al je foto's weer opnieuw te uploaden als je de stijl van de website veranderd oid.

Bedankt voor je tip, maar hier is bewust voor gekozen. Er komt nog een afbeelding rechtsonder als watermerk over de afbeelding. Die rand moet op de afbeelding staan, omdat er ook (met toestemming) gelinkt wordt vanaf andere websites.