Juiste maten van een afbeelding
Thanks voor de toelichting. Er is in jouw geval dus inderdaad sprake van zoom. Dat is dus inderdaad geen standaardgedrag zoals ik eerder al vermoedde.
Ad Fundum op 26/10/2022 18:59:48:
Ja dat snappen we. Als je die kettinkjes in je menu laat staan, blijven de verhoudingen gehandhaafd. De "px" is een dropdownmenu, waarin je ook "cm" kan kiezen. Verder naar onderen in het scherm geef je de korrelgrootte aan in beeldpunten/inch, bijvoorbeeld 150.
De fysieke grootte wordt als het kan ook in de metadata van de afbeelding opgeslagen.
Mohamed nvt op 26/10/2022 10:39:15:
Doe ik dat bij resolutie of waar anders? Het gaat mij om dat wanneer een plaatje verklein, dat de verhoudingen kloppen, snap je mij?
Ja dat snappen we. Als je die kettinkjes in je menu laat staan, blijven de verhoudingen gehandhaafd. De "px" is een dropdownmenu, waarin je ook "cm" kan kiezen. Verder naar onderen in het scherm geef je de korrelgrootte aan in beeldpunten/inch, bijvoorbeeld 150.
De fysieke grootte wordt als het kan ook in de metadata van de afbeelding opgeslagen.
Oke, dus als ik je goed begrijp, hetgeen wat de klant van mij verwacht, bestaat niet of kan niet. Althans, ik heb geen idee hoe ik dat kan doen.
En wat de klant van mij verwacht; er wordt aangegeven dat het plaatje 100cm x 110cm is en wanneer ik het verklein naar bijv 250px x 250px, dan wordt er aangegeven dat verhoudingen niet kloppen. Maw ik denk en vind dat de klant precies moet aangeven hoeveel de breedte en hoogte is van een plaatje? Zien jullie het anders?
Lees eens goed terug wat er wordt geschreven. Ja natuurlijk kan dat wel. Het is al 3 of 4 keer uitgelegd hoe.
Toevoeging op 26/10/2022 23:26:00:
Geef even aan wat je niet begrijpt aan de uitleg die is gegeven.
Ozzie PHP op 26/10/2022 20:40:51:
@Ad Fundum
Thanks voor de toelichting. Er is in jouw geval dus inderdaad sprake van zoom. Dat is dus inderdaad geen standaardgedrag zoals ik eerder al vermoedde.
Thanks voor de toelichting. Er is in jouw geval dus inderdaad sprake van zoom. Dat is dus inderdaad geen standaardgedrag zoals ik eerder al vermoedde.
Over wat standaard is kan je discussieren (tenzij je genoegen neemt met twee keer de standaarddeviatie). Feit is dat het artikel dat ik linkte uit 2010, Ward en ik proberen duidelijk te maken dat zoom vrij standaard is. Op die Windows doos heb ik zoom op 125% staan, vanwege dat die laptop ook al best een hoge resolutie heeft. Pixels worden op allerlei apparaten gewoon geschaald. Dus nogmaals, een pixel in CSS is conceptueel iets anders dan een pixel op je scherm.
Ik heb het gevoel dat we elkaar niet begrijpen en hieronder zal ik het nogmaals uitleggen:
Ik krijg een plaatje waarvan de originele afmetingen 100cm x 110cm zijn en vervolgens maak ik het plaatje klein naar 250px x 250px en ik plaats het op de website. Vervolgens is de klant niet blij, want er wordt aangegeven dat de verhoudingen van het plaatje niet kloppen. Er wordt mij verteld dat het mogelijk moet zijn om de originele afmetingen 100cm x 110cm ergens moet opgeven en wanneer ik het plaatje verklein, dan zou het programma hier rekening moet mee houden.
Mijn concrete vragen:
Bestaat er een mogelijkheid om dit te doen in Gimp? Zo, ja? Hoe dan? Ik zou het op prijs stellen als het wordt uitgelegd!
Is het correct dat van mij verwacht wordt dat ik het plaatje verklein en dat de verhoudingen kloppen, daar ik geen fotospecialist ben?
Maar bij 100% zoom zijn 100 pixels toch gewoon 100 pixels op het beeldscherm? Dat jij je beeld ingezoomd hebt staan, betekent dat er op jouw beeldscherm meer pixels gebruikt zullen worden. Maar wat is daar, vanuit het oogpunt van webdesign, relevant aan? Jij ziet dan toch alles in verhouding groter?
@Mohamed
>> Vervolgens is de klant niet blij, want er wordt aangegeven dat de verhoudingen van het plaatje niet kloppen.
Dat klopt. daar zou ik ook niet blij mee zijn.
>> Bestaat er een mogelijkheid om dit te doen in Gimp? Zo, ja? Hoe dan?
Lees mijn reactie op de vorige pagina. Daar leg ik het gewoon uit. Als je niet snapt wat ik bedoel, leg dan uit welk deel je niet snapt.
je moet er eerst een vierkant van maken.
dus iets van 100x110 wordt dan 100x100, waarbij je een strook van het plaatje af knipt,
of je maakt er 110x110 van waarbij je een strook wit/zwart/doorzichtig toevoegt.
En dat (bijsnijde / uitbreiden) kun je dan doen aan 1 kant van het plaatje of aan beide zijden die van toepassing zijn.
Is het vierkant, dan kun je het herschalen naar 250x250
Ozzie PHP op 26/10/2022 23:44:15:
Maar bij 100% zoom zijn 100 pixels toch gewoon 100 pixels op het beeldscherm? Dat jij je beeld ingezoomd hebt staan, betekent dat er op jouw beeldscherm meer pixels gebruikt zullen worden. Maar wat is daar, vanuit het oogpunt van webdesign, relevant aan? Jij ziet dan toch alles in verhouding groter?
Op mijn scherm zijn alle pixels enorm klein. Een beetje zoals met een retina scherm. Waar 100 * 100 px bij jou misschien 2 * 2cm is, is dat bij mij 0,8 * 0,8 cm. Dat is voor webdesigners, die ook aan UX doen wel relevant om rekening mee te houden. Met de 1px CSS = 1px op-het-scherm instelling kan ik de letters alleen met een vergrootglas lezen. Dus geef ik mijn hele desktop vanuit de window manager (dus niet alleen de browser) een zoomlevel van minimaal 200%. Er zijn allerlei apparaten waarop dat op die manier gaat.
Stel, je geeft in CSS aan dat een plaatje een afmeting heeft van 100 * 100 px. Vanuit het zoomlevel wordt dat vertaald naar 200 * 200px, en het plaatje wordt geïnterpoleerd weergegeven waardoor het minder scherp is dan de rest van de website. Dat kan je verbeteren door de afbeelding (van het "src" attribuut) een dimensie te geven van 200 * 200 px. De browser zal via interpolatie dan de afbeelding scherp tonen, met 200 * 200 schermpixels. En dan hebben mensen met een scherp scherm daar voordeel bij. 4k is een heel verschil met de oude 4:3 CRT-monitor met 1024 * 768 pixels, op een 4k scherm zitten 3840 * 2160 pixels in een 16:9 verhouding. Maar ook 4k schermen komen in verschillende afmetingen, dus weet je nog steeds niet hoe fysiek groot het aan de websitebezoeker wordt getoond. En dan is de CSS-eenheid van cm of mm weer handig, voor het scherm en op papier. Als het dan niet goed wordt getoond ligt het niet aan de website.
Ah, nu snap ik beter wat je bedoelt. Je klaagt dus eigenlijk over het gegeven dat je afbeeldingen te onscherp ziet, omdat je bent ingezoomd. Dat is eigenlijk ook wel logisch, want als je een foto inzoomt ga je ook pixels zien. Dus die grotere resolutie zou je graag zien om de onscherpte te compenseren. Ergens snap ik je wel. Maar tegelijkertijd is dat ook weer niet iets wat je kunt 'afdwingen'. Als ik dus een afbeelding zou tonen van 1000 x 500 px, zou ik om aan jouw situatie tegemoet te komen dus eigenlijk een afbeelding van 2000 x 1000 px moeten tonen en die laten weergeven als een afbeelding van 1000 x 500 px. Ik zeg niet dat dat niet kan, maar lijkt me lastig om overal dit soort 'uitzonderingen' voor te gaan maken. Het gebeurt ook vaak dat je afbeeldingen krijgt aangeleverd en daar is dan geen groter exemplaar van. Dus ja ik snap je punt, maar de situatie ontstaat wel omdat jij in dit geval gekozen hebt om een zoomlevel in te stellen. Ik heb zelf toen ik een nieuwe monitor kocht bewust gekozen voor QHD in plaats van UHD om dit soort problemen te voorkomen. Ik hoef niet in te zoomen. Als ik wel had moeten inzoomen, dan maakt dat mijn designwerk lastiger, omdat ik dan zelf een uitzonderlijke situatie heb gecreëerd qua zoomlevel. Nu is het gewoon 100%.
@Ivo P:
>> Een rechthook krijg je nooit geschaald naar een vierkant:
Dat wil hij ook niet. Hij wil gewoon in verhouding kunnen schalen. Hoe dat werkt is hem meerdere keren uitgelegd. Het kwartje moet denk ik nog even vallen :-)
Quote:
Ik krijg een plaatje waarvan de originele afmetingen 100cm x 110cm zijn en vervolgens maak ik het plaatje klein naar 250px x 250px
Ah oké. Een rechthoek kun je overigens wel degelijk schalen naar een vierkant, alleen wordt de afbeelding dan 'in elkaar gedrukt' en kloppen de verhoudingen niet meer.
Ozzie PHP op 26/10/2022 23:44:15:
@Mohamed
>> Vervolgens is de klant niet blij, want er wordt aangegeven dat de verhoudingen van het plaatje niet kloppen.
Dat klopt. daar zou ik ook niet blij mee zijn.
>> Bestaat er een mogelijkheid om dit te doen in Gimp? Zo, ja? Hoe dan?
Lees mijn reactie op de vorige pagina. Daar leg ik het gewoon uit. Als je niet snapt wat ik bedoel, leg dan uit welk deel je niet snapt.
>> Vervolgens is de klant niet blij, want er wordt aangegeven dat de verhoudingen van het plaatje niet kloppen.
Dat klopt. daar zou ik ook niet blij mee zijn.
>> Bestaat er een mogelijkheid om dit te doen in Gimp? Zo, ja? Hoe dan?
Lees mijn reactie op de vorige pagina. Daar leg ik het gewoon uit. Als je niet snapt wat ik bedoel, leg dan uit welk deel je niet snapt.
Jouw reacties op de vorige pagina heb ik gelezen en daarin bevestig je min of meer dat het niet mogelijk is om ergens in Gimp de originele afmeting, zoals 100cm x 110cm, in te vullen en dat je het plaatje vervolgens verkleint. En hier ben ik dus opzoek naar, omdat klant dat van mij verwacht en ik ben geen fotobewerkspecialist.
Nee, dat is niet wat ik zeg.
Laatste poging. Je hoeft helemaal nergens die 100cm x 110cm in te vullen. Ik herhaal: je hoeft helemaal nergens die 100cm x 110cm in te vullen. En nog één keer voor de zekerheid: je hoeft helemaal nergens die 100cm x 110cm in te vullen.
Open je foto in Gimp, ga naar schalen en vul daar bij afbeeldingsgrootte alleen de nieuwe breedte in pixels in, bijvoorbeeld 250 pixels. Ik herhaal: vul alleen de nieuwe breedte in. Verder dus helemaal niks.
Druk op de knop Schalen.
Ozzie PHP op 27/10/2022 13:07:51:
@Ad Fundum
Ah, nu snap ik beter wat je bedoelt. Je klaagt dus eigenlijk over het gegeven dat je afbeeldingen te onscherp ziet, omdat je bent ingezoomd. Dat is eigenlijk ook wel logisch, want als je een foto inzoomt ga je ook pixels zien. Dus die grotere resolutie zou je graag zien om de onscherpte te compenseren. Ergens snap ik je wel. Maar tegelijkertijd is dat ook weer niet iets wat je kunt 'afdwingen'. Als ik dus een afbeelding zou tonen van 1000 x 500 px, zou ik om aan jouw situatie tegemoet te komen dus eigenlijk een afbeelding van 2000 x 1000 px moeten tonen en die laten weergeven als een afbeelding van 1000 x 500 px. Ik zeg niet dat dat niet kan, maar lijkt me lastig om overal dit soort 'uitzonderingen' voor te gaan maken. Het gebeurt ook vaak dat je afbeeldingen krijgt aangeleverd en daar is dan geen groter exemplaar van. Dus ja ik snap je punt, maar de situatie ontstaat wel omdat jij in dit geval gekozen hebt om een zoomlevel in te stellen. Ik heb zelf toen ik een nieuwe monitor kocht bewust gekozen voor QHD in plaats van UHD om dit soort problemen te voorkomen. Ik hoef niet in te zoomen. Als ik wel had moeten inzoomen, dan maakt dat mijn designwerk lastiger, omdat ik dan zelf een uitzonderlijke situatie heb gecreëerd qua zoomlevel. Nu is het gewoon 100%.
Ah, nu snap ik beter wat je bedoelt. Je klaagt dus eigenlijk over het gegeven dat je afbeeldingen te onscherp ziet, omdat je bent ingezoomd. Dat is eigenlijk ook wel logisch, want als je een foto inzoomt ga je ook pixels zien. Dus die grotere resolutie zou je graag zien om de onscherpte te compenseren. Ergens snap ik je wel. Maar tegelijkertijd is dat ook weer niet iets wat je kunt 'afdwingen'. Als ik dus een afbeelding zou tonen van 1000 x 500 px, zou ik om aan jouw situatie tegemoet te komen dus eigenlijk een afbeelding van 2000 x 1000 px moeten tonen en die laten weergeven als een afbeelding van 1000 x 500 px. Ik zeg niet dat dat niet kan, maar lijkt me lastig om overal dit soort 'uitzonderingen' voor te gaan maken. Het gebeurt ook vaak dat je afbeeldingen krijgt aangeleverd en daar is dan geen groter exemplaar van. Dus ja ik snap je punt, maar de situatie ontstaat wel omdat jij in dit geval gekozen hebt om een zoomlevel in te stellen. Ik heb zelf toen ik een nieuwe monitor kocht bewust gekozen voor QHD in plaats van UHD om dit soort problemen te voorkomen. Ik hoef niet in te zoomen. Als ik wel had moeten inzoomen, dan maakt dat mijn designwerk lastiger, omdat ik dan zelf een uitzonderlijke situatie heb gecreëerd qua zoomlevel. Nu is het gewoon 100%.
Ik merk dat we er nog niet helemaal zijn.
Om te beginnen klaag ik niet, ik probeer je alleen aan de hand van een voorbeeld duidelijk te maken dat een CSS pixel iets anders is dan een schermpixel.
Daarbij probeer ik je duidelijk te maken dat er niet echt sprake is van een keuze aangaande zoomlevel als je anders de letters niet kan lezen omdat ze anders maar een paar millimeter groot zijn. Dat zoomlevel is domweg een absolute noodzaak.
Dan nog dat het voorbeeld 'uitzonderlijk' zou zijn. Ik ben niet de enige met een UHD monitor. Smartphones liggen al tijden te hannesen op websites op een klein schermpje gepropt te krijgen, retina of niet. Lees vooral ook dat artikel van Peter Koch. Zoom is echt geen uitzondering, eerder een standaard omdat het merendeel tegenwoordig geen PC meer gebruikt maar een smartphone. Daarbij gaf ik al aan dat mijn standaard HP laptopje met 14" scherm ook QHD heeft, met een zoomlevel van 125% omdat het anders niet lekker leesbaar is. Een zoomlevel kan je gewoon standaard instellen via Windows, er zijn meer mensen die dat doen.
Hoezo is zoomen uitzonderlijk? Als ik mijn zoomlevel reset naar de standaard (via menu of CTRL-0) dan heb ik nog steeds het zoomlevel van het OS.
En afdwingen van scherpe plaatjes hoeft niet. Je kunt met CSS media queries kijken wat de resolutie is, en wat je dan goed kan overwegen is of je een afbeelding in hoge resolutie aanbiedt. Je begint dan met een plaatje van 50x50, en afhankelijk van de schermresolutie kan je via een XHR-call besluiten welke resolutie van een plaatje je gaat ophalen op de server, en pas als het plaatje daadwerkelijk in de browser in zicht is.
>> Om te beginnen klaag ik niet ...
Ah, mijn excuses. Het was niet echt letterlijk bedoeld, maar eerder een interpretatie mijnerzijds ;-)
Ik heb (nog) nooit met alternatieve afbeeldingen gewerkt, maar ook nooit vreemde dingen gezien. Ook niet op mobiel.
Kun je eens een code voorbeeld geven van een stukje css met meerdere afbeeldingen in combinatie met media queries? Dan begrijp ik wellicht wat beter welke kant het opgaat.
Ozzie PHP op 28/10/2022 09:46:24:
Kun je eens een code voorbeeld geven van een stukje css met meerdere afbeeldingen in combinatie met media queries?
https://css-tricks.com/a-guide-to-the-responsive-images-syntax-in-html/