Verschil in weergave tussen breedbeeld en 4:3-scherm

[Anoniem: 258724]

Op mijn laptop zie ik een kromme lijn op een website erg mooi.
Maar op de computer met een 1400x900 scherm zie ik die kromme lijn niet mooi.
Zal dit met de breedte van de beeldscherm te maken hebben? (heb dit al geprobeerd te veranderen doormiddel van de menu knop maar op 100% is de lijn steeds niet goed.)
Ik heb een Packard Bell beeldscherm 191W met Vista.

[Yippie]

dat komt door het resolutie verschil tussen je monitor en laptop neem ik aan.
Dit site is waarschijnlijk ook geoptimaliseerd voor de resolutie van je laptop.

Welke resolutie gebruik je op je laptop ?
Je zou kunnen proberen je monitor op de zelfde resolutie te kunnen laten draaien als je laptop.

[ Voor 2% gewijzigd door Yippie op 13-04-2008 16:14 . Reden: typo ]

[Avalaxy]

Anoniem: 258724 schreef op zondag 13 april 2008 @ 16:07:
Op mijn laptop zie ik een kromme lijn op een website erg mooi.
Maar op de computer met een 1400x900 scherm zie ik die kromme lijn niet mooi.
Zal dit met de breedte van de beeldscherm te maken hebben? (heb dit al geprobeerd te veranderen doormiddel van de menu knop maar op 100% is de lijn steeds niet goed.)
Ik heb een Packard Bell beeldscherm 191W met Vista.

Ten eerste is het breedte en niet wijdte (zoals je topictitel zegt ), ten tweede ligt dat waarschijnlijk aan je resolutie (mits je met 'niet mooi' vervorming bedoelt). Gewoon de native resolutie instellen van je monitor zou dat moeten verhelpen (de hoogste resolutie die je kunt kiezen als het goed is).

[Anoniem: 258724]

De resolutie van de laptop is 1024x768
En de hoogste resolutie op de normale computer kan niet groter. (1440x900 is het hoogst, en daar is deze beeldscherm voor gemaakt)

En trouwens, vroeger was het wel allemaal goed

[ Voor 12% gewijzigd door Anoniem: 258724 op 13-04-2008 16:23 ]

[GoldenBatt]

Als je de desktop op 1024X768 zet, ziet het der dan wel zo uit als op de laptop?

[Anoniem: 258724]

Nee, dan zit het er nog steeds anders uit

[darkpluisje]

komt omdat je scherm breedbeeld is, en 1024 is een 3:4 resolutie

[Ruudjah]

DIT BERICHT IS PREVENTIEF VERWIJDERD DOOR DE GEBRUIKER

[ Voor 136% gewijzigd door Ruudjah op 01-12-2009 22:54 ]

[sanzut]

Als je op beide monitoren dezelfde resolutie instelt, en de optie om het beeld te 'strechen' zodat het beeldvullend wordt uitzet zou het er exact hetzelfde uit moeten zien.

[TERW_DAN]

Kloppen de verhoudingen wel als je de schermen vergelijkt (als ze op de native reso draaien). Als dat zo is dan moet je verder zoeken (kleurdiepte wellicht)

[fleppuhstein]

Ruudjah schreef op zondag 13 april 2008 @ 17:07:
[...]

Nee.

[...]

Ook niet.

[...]

Bijna.

Het heeft niets met de resolutie an sich te maken. Echter, de beeldverhouding is de bepalende factor. Er zijn een aantal verschillende verhoudingen, zoals 4:3 (bijvoorbeeld 1024 bij 768), 5:4 (bijvoorbeeld 1280 bij 1024), 16:9 , 16:10 (bijvoorbeeld 1440 bij 900). Als je een cirkel tekent op een 4:3 verhouding scherm, zal het een ovaal zijn op een 5:4 verhouding scherm.

Tuurlijk niet, een cirkel is een cirkel. Dit treedt alleen op als je een 3:4 resolutie kiest op een 16:9 verhouding beeld. Een foto van een bal zal op beide monitoren een ronde bal zijn. De bal heeft gewoon een radius van een x aantal pixels. Draai je alleen een verkeerde resolutie op een monitor zal de monitor gaan interleaven. Hierdoor is een pixel niet meer 1 pixel. Ook gaan hierbij de verhoudingen van hoogte en breedte verloren.

De website heeft waarschijnlijk een image die gestrest wordt met css. De CSS is gewoon alleen bedacht/geschreven voor 3:4 resoluties. Hierdoor treedt vervorming op.

[Anoniem: 258724]

Het probleem is wel zo dat het wel goed was.

Trouwens, de website gebruikt frontpage, (eigen website) en in het ontwerpen is het wel goed maar bij voorbeeld en dus op internet zelf is het verkeerd.

[ Voor 63% gewijzigd door Anoniem: 258724 op 14-04-2008 16:04 ]

[TERW_DAN]

Anoniem: 258724 schreef op maandag 14 april 2008 @ 16:03:
Het probleem is wel zo dat het wel goed was.

Trouwens, de website gebruikt frontpage, (eigen website) en in het ontwerpen is het wel goed maar bij voorbeeld en dus op internet zelf is het verkeerd.

Kun je het wellicht illustreren met wat screenshots. Want er bestaat een grote kans dat je dingesn gewoon lelijk aan het resizen bent of wat dan ook (dit gevaar heb je snel met WYSIWYG-editors).

[Anoniem: 258724]

Hier is een plaatje van hoe het is, en hoe het moet zijn.

[MediQ]

Is dit niet gewoon een anti-aliasing probleem?

[AntonH]

Ik gok dat het met je ClearType instellingen in Vista heeft te maken. Waarschijnlijk draai je XP of ouder op je laptop.

[Gizz]

Je weet zeker dat je een 1400x900 scherm hebt? Deze schermen zijn namelijk niet zo heel veel voorkomend.

[Hahn]

1440x900 is heel normaal voor 19" widescreen

[Avalaxy]

anton121 schreef op woensdag 16 april 2008 @ 18:02:
Ik gok dat het met je ClearType instellingen in Vista heeft te maken. Waarschijnlijk draai je XP of ouder op je laptop.

Ik meende dat ClearType alleen is om lettertypen te anti-alliasen, maar geen randjes in afbeeldingen

[TERW_DAN]

Hahn schreef op woensdag 16 april 2008 @ 18:06:
1440x900 is heel normaal voor 19" widescreen

1440 wel, 1400 niet

@TS, staat die website ook ergens online? Dan kan ik zien hoe het er op m'n eigen pc uitziet

leonpwner1 schreef op woensdag 16 april 2008 @ 18:07:
[...]


Ik meende dat ClearType alleen is om lettertypen te anti-alliasen, maar geen randjes in afbeeldingen

klopt. Wat wel kan is dat het een afbeelding is die geresized is, sommige browsers doen dat netter dan anderen.

[ Voor 38% gewijzigd door TERW_DAN op 16-04-2008 18:08 ]

[Anoniem: 258724]

Oke, ik bedoel dus inderdaad 1440x900, maar dat ClearType, waar zet ik dat uit, zal het eens proberen dan. En verder nog andere opties?

[Avalaxy]

Anoniem: 258724 schreef op woensdag 16 april 2008 @ 18:33:
Oke, ik bedoel dus inderdaad 1440x900, maar dat ClearType, waar zet ik dat uit, zal het eens proberen dan. En verder nog andere opties?

Like I said, ClearType verandert niets aan je afbeelding hoor.

[TERW_DAN]

Anoniem: 258724 schreef op woensdag 16 april 2008 @ 18:33:
Oke, ik bedoel dus inderdaad 1440x900, maar dat ClearType, waar zet ik dat uit, zal het eens proberen dan. En verder nog andere opties?

Wat ik vroeg, heb je een werkend voorbeeld van die site online staan? Want ik denk niet dat cleartype er wat mee te maken heeft.

[Anoniem: 258724]

Het probleem is op deze website. http://www.hc-esselink.nl/voetbal.htm

[Avalaxy]

Onder Vista X64 ziet het er prima uit onder IE7, maar kartellig in FireFox 3.

Ik denk dat je het in je code moet zoeken, ik weet niet hoe je de website hebt gemaakt, maar ik zie dat je extreem met coördinaten hebt lopen werken

[ Voor 50% gewijzigd door Avalaxy op 17-04-2008 14:55 ]

[Anoniem: 258724]

Ik heb Vista 32-bit en IE7, misschien zal ik ergens in de optie van de browser kijken dan?

[TERW_DAN]

Dit ligt gewoon aan het feit dat de site niet echt jofel in elkaar zit, waardoor de interpretatie bij verschillende browsers anders is, doordat er geresized wordt kan het er op de ene pc iets anders uitzien als op de andere. Dit ligt dus niet aan jouw pc, maar aan de persoon die deze website in elkaar gedraaid heeft.

[Anoniem: 258724]

Oke, toevallig heeft mijn vader dit gemaakt met Frontpage 2003, weet je misschien ook hij dit kan oplossen?

[alex3305]

Hier hetzelfde (ook Vista x64). Echter ligt het volgens mij wel aan een cleartype achtige setting. Het plaatje is namelijk helemaal niet mooi afgetekend IMHO.

[Avalaxy]

Anoniem: 258724 schreef op donderdag 17 april 2008 @ 14:57:
Oke, toevallig heeft mijn vader dit gemaakt met Frontpage 2003, weet je misschien ook hij dit kan oplossen?

Zoals Terw_Dan zegt, en zoals ik op de vorige pagina schreef, ligt het aan de manier waarop de website is opgebouwd.

Wat er nu gebeurd is (zoals ik al dacht met behulp van Office...) is dat alle afbeeldingen met behulp van een enorme lap ingewikkelde code met behulp van coördinaten worden ingericht. Dit is absoluut -niet- de manier om een website op te bouwen.

Ik raad je aan gewoon overnieuw te beginnen en je code zelf te schrijven. Netjes beginnen met xhtml/css en gebruik maken van div's in plaats van coördinaten of tabellen.

Desnoods met behulp van Frontpage, is al stukken beter dan Word oid

[ Voor 4% gewijzigd door Avalaxy op 17-04-2008 15:02 ]

[TERW_DAN]

Anoniem: 258724 schreef op donderdag 17 april 2008 @ 14:57:
Oke, toevallig heeft mijn vader dit gemaakt met Frontpage 2003, weet je misschien ook hij dit kan oplossen?

Beginnen door de website op een nette manier in elkaar te zetten
Dus geen frames gebruiken als het niet nodig is, valide html gebruiken en resizing niet door de browser af te laten handelen.

[KneoK]

Anoniem: 258724 schreef op woensdag 16 april 2008 @ 17:48:
Hier is een plaatje van hoe het is, en hoe het moet zijn.
[afbeelding]

Voor zover ik kan inschatten eindigt in de bovenste afbeelding de lijn helemaal bovenaan en in de onderste afbeelding zit er een blauwe balk als top waar de lijn tegen eindigt. De lijn in de onderste afbeelding is dus iets minder hoog maar wel even breed waardoor de verhouding klopt.

Gebruik je toevallig verschillende browsers op beide computers ? Heb het idee dat het iets met marges en anders interpreteren van je CSS te maken heeft.

[Ramon]

het plaatje is gewoon slecht gemaakt, probeer eens met fireworks of photoshop in plaats van frontpage

[Jiffy]

Alex3305 schreef op donderdag 17 april 2008 @ 14:57:
Hier hetzelfde (ook Vista x64). Echter ligt het volgens mij wel aan een cleartype achtige setting. Het plaatje is namelijk helemaal niet mooi afgetekend IMHO.

Nee hoor. Het ligt aan de pagina zelf icm de gebruikte browser: op de computer waar ik nu bij zit, wordt de curve op die site in IE6 onder Win2K prima weergegeven, maar op dezelfde computer onder Firefox 2.0 is hij idd kartelig. De site zit dus niet optimaal in elkaar, wat nu met name blijkt uit dat plaatje van die curve...

[ Voor 8% gewijzigd door Jiffy op 17-04-2008 15:22 ]

[TERW_DAN]

Nog een tip, duw dit ding eens door browsershots.org heen, dan kun je de verschillen tussen de OSen en browsers goed zien.

[Anoniem: 95136]

Onder Vista X64 op 1280*1024 ziet de lijn er inderdaad korrelig uit. Ik denk niet dat dit komt door het OS, resolutie of verhouding, maar puur door het plaatje. Het plaatje is een GIF zie ik. Gifjes hebben niet de kwaliteit van bijvoorbeeld een JPEG. Sla het bestand eens op als JPEG en je zult al verschil zien.

Als je trouwens transparantie nodig hebt, zul je het moeten opslaan als PNG, maar het nadeel hieraan is dat het niet werkt met IE6 of eerder. Je zou hem dan nog als GIF kunnen opslaan met de optie Save For Web in Photoshop. Meestal kun je hier de GIF zo mee tweaken dat je geen tot weinig verlies van kwaliteit hebt.

[KneoK]

Er zit overigens nog wel meer verschil tussen de browserweergave:

Links IE7, rechts Firefox 2.0.0.13, Vista x86


In Firefox lijkt je bovenste frame iets minder hoog dan in Internet Explorer waardoor het plaatje in Firefox lelijk ingedrukt wordt.

Verder lijkt in Firefox alles veel meer aliased, alles is veel karteliger in je top frame, helpt ook niet mee voor de lijn. Ook het lettertype linksboven verschilt enorm.

[Ramon]

Jiffy schreef op donderdag 17 april 2008 @ 15:22:
[...]

Nee hoor. Het ligt aan de pagina zelf icm de gebruikte browser: op de computer waar ik nu bij zit, wordt de curve op die site in IE6 onder Win2K prima weergegeven, maar op dezelfde computer onder Firefox 2.0 is hij idd kartelig. De site zit dus niet optimaal in elkaar, wat nu met name blijkt uit dat plaatje van die curve...

eigenlijk is het dus Firefox die het goed doet door het plaatje weer te geven zoals hij is (zie hierboven) en IE die het fout doet door het plaatje mooier te maken, door het in te drukken ofzo (wat ergens in de webpagina zit) als je namelijk het losse plaatje in IE opent ziet het er exact hetzelfde uit als in Firefox.

[Room42]

Nee, Ramon, die conclusie is niet volledig. Als je namelijk naar de bron kijkt, zie je allemaal "<!--[if gte vml 1]>" staan. Dat betekent dat een browser met VML ondersteuning (IE dus), deze code gebruikt om de lijn weer te geven:

HTML:

<!--[if gte vml 1]><v:shapetype
 id="_x0000_t19" coordsize="21600,21600" o:spt="19" adj="-5898240,,,21600,21600"
 path="wr-21600,,21600,43200,,,21600,21600nfewr-21600,,21600,43200,,,21600,21600l,21600nsxe"
 filled="f">
 <v:formulas>
  <v:f eqn="val #2"/>
  <v:f eqn="val #3"/>
  <v:f eqn="val #4"/>
 </v:formulas>
 <v:path arrowok="t" o:extrusionok="f" gradientshapeok="t" o:connecttype="custom"
  o:connectlocs="0,0;21600,21600;0,21600"/>
 <v:handles>
  <v:h position="@2,#0" polar="@0,@1"/>
  <v:h position="@2,#1" polar="@0,@1"/>
 </v:handles>
</v:shapetype><v:shape id="_x0000_s1026" type="#_x0000_t19" alt="" style='position:absolute;
 left:193.5pt;top:-10.5pt;width:130.5pt;height:187.5pt;rotation:-180;flip:y;
 z-index:2' coordsize="21600,21876" adj=",47977" path="wr-21600,,21600,43200,,,21598,21876nfewr-21600,,21600,43200,,,21598,21876l,21600nsxe"
 strokecolor="#f90" strokeweight="3pt">
 <v:stroke linestyle="thinThin"/>
 <v:path o:connectlocs="0,0;21598,21876;0,21600"/>
</v:shape><![endif]-->

Terwijl andere browsers deze code gebruiken om het vervangende plaatje weer te geven:

HTML:

<![if !vml]><span style='mso-ignore:vglayout;position:
absolute;z-index:2;left:256px;top:-16px;width:179px;height:254px'><img
width=179 height=254 src="top_bestanden/image002.gif" v:shapes="_x0000_s1026"></span><![endif]>

Microsoft zou echter Microsoft niet zijn als ze de concurrentie er niet belachelijk uit zouden laten zien door het plaatje op een krankzinnig slechte manier te renderen.

[gertvdijk]

@sjaakduhuuhl
Idd. Microsoft zou lekker SVG moeten uitspugen met eventueel VML ernaast voor IE browsers.

[Pollewob]

Titelchange.

En dit heeft niet veel met Videoplanken & Beeldkanonnen te maken. Move naar Graphics

[Anoniem: 258724]

Zal het misschien opgelost kunnen worden door het gebruik van een nieuw web design programma van hun. Expression Web ofzoiets?

[Avalaxy]

Anoniem: 258724 schreef op vrijdag 18 april 2008 @ 14:22:
Zal het misschien opgelost kunnen worden door het gebruik van een nieuw web design programma van hun. Expression Web ofzoiets?

Het beste lijkt mij om gewoon met photoshop een design te maken, deze te slicen en de afbeeldingen op te slaan, vervolgens in Editplus met xhtml en css een constructie maken met div's waarin je die afbeeldingen zet en horizontaal/verticaal laat repeaten en naar beneden floaten.

Dan heb je uiteraard nog een CMS nodig, wat je ook best zelf kunt schrijven (hoeft niet mega ingewikkeld te zijn volgens mij), dat doe je uiteraard met PHP en SQL.

Als dat te moeilijk is (tja, websites maken is nou eenmaal niet makkelijk... in tegenstelling tot wat een hoop mensen denken is het niet zomaar eventjes wat in elkaar flansen met producten als Word, Frontpage of Dreamweaver. Er komt heel wat meer bij kijken om een goede website op te zetten) dan kun je natuurlijk ook een opensource CMS gebruiken met ingebouwde templates. Voorbeelden zijn Joomla, Drupal, Mambo, CMS Made Simple, ToendaCMS, etc. Het enige wat je daarvoor hoeft te doen is de CMS uploaden naar je webserver, een MySQL database aan te maken en je CMS even kort te configureren waarna je pagina's en dergelijken kan maken.

Uiteraard kun je het ook laten zoals het nu is, maar dan zit je met een constructie die op z'n zachtst gezegd erg vaag is en niet lekker werkt.