Frei Skalierende BIlder
Ulf Kadner
ob es den irgend eine JS-Freie, portable Möglichkeit gibt ein Bild
frei skalierend einzubinden.
Momentan bevorzuge ich die Möglichkeit das ich dem entsprechenden <img />
element keine feste Höhe und Breite zuweise und lediglich eine CSS klasse
zuweise die bspw. width: 80%; gesetzt bekommt.
In Browsern die mir zur verfügung stehen scheint das auch wunderbar zu
klappen. (IE8, FF3.6, Opera 10.*, Chrome)
Kennt jemand mögliche Problem damit oder ist das problemlos einsetzbar?
MfG, Ulf
--
In der Tiefe meiner Seele ist eine wärmende Dunkelheit, deren
Vollständigkeit einer undurchdringlichen Unbegreiflichkeit der
Unendlichkeit gleicht! [Andreas J. Voigt]
Matthias P. Wuerfl
> frei skalierend
Was ist das?
> Momentan bevorzuge ich die Möglichkeit das ich dem entsprechenden<img />
> element keine feste Höhe und Breite zuweise und lediglich eine CSS klasse
> zuweise die bspw. width: 80%; gesetzt bekommt.
Dann stimmt die Auflösung des Bildes nicht mehr mit der Anzeige überein
und es kommt u.U. zu unschönen Effekten bei der Skalierung. Bilder
skalieren lässt man eher ein Grafikprogramm machen, nicht den Browser, oder?
Grüße, Matthias
Ulf Kadner
> Es schrieb Ulf Kadner:
>
>> frei skalierend
>
> Was ist das?
skalierend.
>> Momentan bevorzuge ich die Möglichkeit das ich dem entsprechenden<img />
>> element keine feste Höhe und Breite zuweise und lediglich eine CSS klasse
>> zuweise die bspw. width: 80%; gesetzt bekommt.
>
> Dann stimmt die Auflösung des Bildes nicht mehr mit der Anzeige überein
> und es kommt u.U. zu unschönen Effekten bei der Skalierung. Bilder
> skalieren lässt man eher ein Grafikprogramm machen, nicht den Browser, oder?
Naja dadurch entsteht aber wiederum das Problem das sich Webbrowser zur
bis zu einem minimum verkleinern lassen, der durch die Außmaße des
Bildes festgelegt wird ohne dass Scrollbars entstehen.
Wenn ich in einer Web-Fotogalleriey ein einzelnes Bild anzeige dann würde
ich es als besucher wesentlich angenehmer empfinden wenn ich eben nicht
durch die Bildgröße da gebunden wär.
Irgenwelche Artefakte entstehen doch eigentlich nur, wenn man so skaliert
das das Bild vergrößert werden muss. Aber das kann man ja mit max-width
und minmax.js weitestgehend unterbinden.
MfG, Ulf
--
,-.
\_/
>{|||}
/ \
`-^ Sssssss…
Dietmar Hollenberg
> Irgenwelche Artefakte entstehen doch eigentlich nur, wenn man so skaliert
> das das Bild vergrößert werden muss.
Ältere Browser hatten teilweise grauenhafte Resize Engines. Verkleinerte
Bilder sahen im FF bis zur 3.0 unerträglich verpixelt aus, während man
in Opera kaum sah, daß das Bild nicht in Originalgröße gezeigt wurde.
Unter den aktuellen Browsern kenne ich keinen mehr, der Bilder beim
Verkleinern verunstaltet. Beim Vergrößern treten logischerweise
Unschärfen auf.
Tschüß
Dietmar
--
Lesbar quoten kann so einfach sein:
http://www.learn.to/quote
http://www.volker-gringmuth.de/usenet/zitier.htm
Michael Fesser
>Ich bastel gerade ein bischen an meinen Fotogalerien und frage mich gerad
>ob es den irgend eine JS-Freie, portable Möglichkeit gibt ein Bild
>frei skalierend einzubinden.
>
>Momentan bevorzuge ich die Möglichkeit das ich dem entsprechenden <img />
>element keine feste Höhe und Breite zuweise und lediglich eine CSS klasse
>zuweise die bspw. width: 80%; gesetzt bekommt.
>
>In Browsern die mir zur verfügung stehen scheint das auch wunderbar zu
>klappen. (IE8, FF3.6, Opera 10.*, Chrome)
>
>Kennt jemand mögliche Problem damit oder ist das problemlos einsetzbar?
Ich denke, es ist schmerzfrei. Moderne Browser sollten keine Probleme
haben, und in älteren Browsern ist eine leicht verminderte Darstellungs-
qualität eh nicht allzu problematisch.
Ich hab hier auch noch einen alten Testcase für eine solche Situation
(Bildgröße abhängig von Viewport-Breite, min-/max-width gesetzt):
http://temp.mfesser.de/gallery/
Möglicherweise setze ich das auch mal auf einer realen Website ein.
Micha
Ulf Kadner
> Ich denke, es ist schmerzfrei. Moderne Browser sollten keine Probleme
> haben, und in älteren Browsern ist eine leicht verminderte Darstellungs-
> qualität eh nicht allzu problematisch.
So oder ähnlich sehe ich das auch. Ich habs mir gerad noch mal auf meinem
Laptop mit dem alten IE6, FF3.0.*, Opera 9.1 und Safari angeschaut. Auch
damit sieht recht ordentlich aus.
> Ich hab hier auch noch einen alten Testcase für eine solche Situation
> (Bildgröße abhängig von Viewport-Breite, min-/max-width gesetzt):
>
> http://temp.mfesser.de/gallery/
Genau so stelle ich mir das vor. Wunderbar! Werd ich wohl nächstes WE
wenn etwas Zeit ist mal umsetzen.
Danke für Deine Antwort.
MfG, Ulf
--
Die Welt in der Ihr lebt wird immer existieren
[Pharao Ammun]
Thomas 'PointedEars' Lahn
> Michael Fesser wrote:
>> Ich denke, es ist schmerzfrei. Moderne Browser sollten keine Probleme
>> haben, und in älteren Browsern ist eine leicht verminderte Darstellungs-
>> qualität eh nicht allzu problematisch.
>
> So oder ähnlich sehe ich das auch. Ich habs mir gerad noch mal auf meinem
> Laptop mit dem alten IE6, FF3.0.*, Opera 9.1 und Safari angeschaut. Auch
> damit sieht recht ordentlich aus.
Ist Dir klar, dass so Deine Benutzer mehr Inhalt herunterladen müssen als
nötig (und dabei möglichweise trotzdem mit inadäquater Qualität konfrontiert
werden), obwohl Dir serverseitig diverse Bibliotheken (GDlib, ImageMagick,
...) für die Skalierung zur Verfügung stünden, insbesondere mit PHP?
PointedEars
--
Lass den Käse mit MS-Fromage besser sein, lerne HTML (kennen) und
designe mit einem gescheitem Editor (z.B Notepad (c;).
-- Michael 'Netzmeister Micha' Specht in
http://selfhtml.de/forum/zeigebeitrag_6_78563_78273.php3
Ulf Kadner
> Ist Dir klar, dass so Deine Benutzer mehr Inhalt herunterladen müssen als
> nötig
Du meinst es wär von irgendeiner Relevanz ob 75kb oder 60kb zur Anzeige
eines einzelnen Bildes geladen werden müssen?
> (und dabei möglichweise trotzdem mit inadäquater Qualität
> konfrontiert werden),
Beispiele?
> obwohl Dir serverseitig diverse Bibliotheken
> (GDlib, ImageMagick, ...) für die Skalierung zur Verfügung stünden,
> insbesondere mit PHP?
Thomas. Das sind zwei vollkommen unterschiedliche Dinge! Eine erzeugt
Bilder in fixen Größen (was ich extra noch nutze um auf gewünsche
Maximalgröße zu skalieren). Das ander ermöglich lediglich skalierende
Webseiten ohne mit den üblichen Problemen von Gallerien konfrontiert zu
werden. Wer will kann ja gern auf ein Ausweich-Template umschalten.
MfG, Ulf
--
__!__
_____(_)_____
! ! !
Thomas 'PointedEars' Lahn
> Thomas 'PointedEars' Lahn wrote:
>> Ist Dir klar, dass so Deine Benutzer mehr Inhalt herunterladen müssen
>> als nötig
>
> Du meinst es wär von irgendeiner Relevanz ob 75kb oder 60kb zur Anzeige
> eines einzelnen Bildes geladen werden müssen?
Ja (Du hast allerdings Deine Einheitenzeichen verbastelt). Insbesondere
ist es aber bei einer *Galerie* von Relevanz, denn bei fünf gleichzeitig
angezeigten Bildern sprächen wir schon von einer Differenz von 25 KiB, bei
zehn von 50 KiB und so weiter. Ausserdem werden über der eigenen schnellen
Internet-Verbindung gern in dieser Hinsicht weniger privilegierte Benutzer
und Benutzer mit Mobilgeräten (und entsprechend geringeren
Übertragungsgeschwindigkeiten) vergessen.
>> (und dabei möglichweise trotzdem mit inadäquater Qualität konfrontiert
>> werden),
>
> Beispiele?
Nein. Relevanz?
>> obwohl Dir serverseitig diverse Bibliotheken
>> (GDlib, ImageMagick, ...) für die Skalierung zur Verfügung stünden,
>> insbesondere mit PHP?
>
> Thomas. Das sind zwei vollkommen unterschiedliche Dinge!
Kann sein. Du hast nicht definiert, was Du mit "frei skalierend" meinst
(ausser, recht sinnfrei, "frei skalierend"), daher war ich zu Annahmen
gezwungen.
> Eine erzeugt Bilder in fixen Größen (was ich extra noch nutze um auf
> gewünsche Maximalgröße zu skalieren). Das ander ermöglich lediglich
> skalierende Webseiten ohne mit den üblichen Problemen von Gallerien
> konfrontiert zu werden.
Welche wären das Deiner Meinung nach?
> Wer will kann ja gern auf ein Ausweich-Template umschalten.
Was meinst Du damit?
PointedEars
--
Lass es mich so ausdrücken: Eigentlich werde ich keine Zeit haben, aber die
fürs Usenet übliche nehme ich mir. Nähme ich mir noch zusätzlich was vor,
würde ich womöglich das tun, um nicht das, das ich tun sollte, tun zu
müssen.
(Christoph Päper in <darw/> <avl5ul$30fp$1...@ariadne.rz.tu-clausthal.de>)
Thomas 'PointedEars' Lahn
> Ulf Kadner wrote:
>> Thomas 'PointedEars' Lahn wrote:
>>> Ist Dir klar, dass so Deine Benutzer mehr Inhalt herunterladen müssen
>>> als nötig
>>
>> Du meinst es wär von irgendeiner Relevanz ob 75kb oder 60kb zur Anzeige
>> eines einzelnen Bildes geladen werden müssen?
>
> Ja (Du hast allerdings Deine Einheitenzeichen verbastelt). Insbesondere
> ist es aber bei einer *Galerie* von Relevanz, denn bei fünf gleichzeitig
> angezeigten Bildern sprächen wir schon von einer Differenz von 25 KiB,
> bei zehn von 50 KiB und so weiter.
Sorry, verlesen. Bei 5 Bildern beträgt in Deinem Beispiel die Differenz
natürlich 75 KiB (sozusagen ein ganzes Bild!), bei 10 schon 150 KiB, und so
weiter.
Allerdings ist anzumerken, dass aus einer 20%igen Reduktion der
Bilddimensionen nicht notwendigerweise auch eine 20%ige Reduktion der
Dateigrösse resultiert.
> Ausserdem werden über der eigenen schnellen Internet-Verbindung gern in
> dieser Hinsicht weniger privilegierte Benutzer und Benutzer mit
> Mobilgeräten (und entsprechend geringeren Übertragungsgeschwindigkeiten)
> vergessen.
Und das sieht hier genau so aus.
PointedEars
--
> Ich habe mir bereits mehrere Mausverfolger aus dem Netz
> heruntergeladen.
Bei uns laufen genug Katzen rum, da muß ich mir keinen Mausverfolger
runterladen... -- Georg Maaß, <b7mnk1$2iafr$2...@ID-3551.news.dfncis.de>
Michael Fesser
>Thomas 'PointedEars' Lahn wrote:
>
>> Ulf Kadner wrote:
>>> Thomas 'PointedEars' Lahn wrote:
>>>> Ist Dir klar, dass so Deine Benutzer mehr Inhalt herunterladen müssen
>>>> als nötig
>>>
>>> Du meinst es wär von irgendeiner Relevanz ob 75kb oder 60kb zur Anzeige
>>> eines einzelnen Bildes geladen werden müssen?
>>
>> Ja (Du hast allerdings Deine Einheitenzeichen verbastelt). Insbesondere
>> ist es aber bei einer *Galerie* von Relevanz, denn bei fünf gleichzeitig
>> angezeigten Bildern sprächen wir schon von einer Differenz von 25 KiB,
>> bei zehn von 50 KiB und so weiter.
>
>Sorry, verlesen. Bei 5 Bildern beträgt in Deinem Beispiel die Differenz
>natürlich 75 KiB (sozusagen ein ganzes Bild!), bei 10 schon 150 KiB, und so
>weiter.
Gerade bei einer Galerie-Seite, die prinzipbedingt ohnehin schon eine
deutlich längere Ladezeit als ein simples Textdokument hat, halte ich
das für vernachlässigbar. Zudem reden wir hier nicht über 1024px-Bilder,
die dann im Browser auf ein Viertel zusammengestaucht werden. Das wäre
in der Tat Unsinn. Aber ein wenig Flexibilität auch bei Bildern kann dem
Layout durchaus zugute kommen.
Zudem käme es auf einen realen Test mit realen Dateigrößen an. Die o.g.
60KB halte ich für zu hoch gegriffen. Selbst große Vorschaubilder kriege
ich hier locker auf 30-40KB. Mit etwas eingeplanter Skalierbarkeit nach
oben packt man halt noch 10KB drauf - das tut wirklich nicht weh.
Optimal wäre natürlich ein Grafikformat, welches je nach Anzeigegröße
die nötigen Bilddaten lädt, nur wird sowas bislang leider von keinem
Browser nativ unterstützt.
>> Ausserdem werden über der eigenen schnellen Internet-Verbindung gern in
>> dieser Hinsicht weniger privilegierte Benutzer und Benutzer mit
>> Mobilgeräten (und entsprechend geringeren Übertragungsgeschwindigkeiten)
>> vergessen.
>
>Und das sieht hier genau so aus.
Hier IMHO irrelevant, denn eine Galerie mit 20 oder mehr Vorschaubildern
ist nun wirklich nicht für Mobiluser gedacht.
Micha
Ulf Kadner
> Ulf Kadner wrote:
>
>> Thomas 'PointedEars' Lahn wrote:
>>> Ist Dir klar, dass so Deine Benutzer mehr Inhalt herunterladen müssen
>>> als nötig
>>
>> Du meinst es wär von irgendeiner Relevanz ob 75kb oder 60kb zur Anzeige
>> eines einzelnen Bildes geladen werden müssen?
>
> Ja (Du hast allerdings Deine Einheitenzeichen verbastelt).
Aber Du weist was ich meine.
> Insbesondere
> ist es aber bei einer *Galerie* von Relevanz, denn bei fünf gleichzeitig
> angezeigten Bildern sprächen wir schon von einer Differenz von 25 KiB
Nette Rechnung aber die hast Du ja bereits korrigiert. Es geht mir
um die Einzelbildanzeige (schrieb ich bereits). Natürlich
werden Thumbnails für die Übersicht generiert. (Hab ich auch bereits
angedeutet) Wär definitiv Blödsinn dazu die Originale zu nutzen.
> Internet-Verbindung gern in dieser Hinsicht weniger privilegierte Benutzer
> und Benutzer mit Mobilgeräten (und entsprechend geringeren
> Übertragungsgeschwindigkeiten) vergessen.
Nein, siehe oben.
>> Beispiele?
>
> Nein. Relevanz?
Nein/Ja, je nachdem was Du damit meinst.
>> Eine erzeugt Bilder in fixen Größen (was ich extra noch nutze um auf
>> gewünsche Maximalgröße zu skalieren). Das ander ermöglich lediglich
>> skalierende Webseiten ohne mit den üblichen Problemen von Gallerien
>> konfrontiert zu werden.
>
> Welche wären das Deiner Meinung nach?
Das kann man eigentlich bereits aus dem herleiten auf was Du antwortetest.
Ich als Besucher kann auch mal die Gallerie in Einzelbildanzeige auf bspw.
400px verkleinern ohne gleich mit nervigen Scrollbars konfrontiert zu
werden. In der Übersicht ist das ja noch nie ein Problem gewesen da dort
halt nur soviele Thumbs nebeneinander angezeigt werden wie gerade möglich.
Ich hoffe ich muß dazu jetzt nicht auch noch die Technik erklären, die
solle eigentlich bekannt sein.
>> Wer will kann ja gern auf ein Ausweich-Template umschalten.
>
> Was meinst Du damit?
Ganz einfach. Man integriere eine Schaltfläche anhand derer $Besucher,
wenn die frei skalierbare Anzeige mißfällt, einfach zu einer fixen
Bildgröße umschalten kann.
MfG, Ulf
--
o _______________
/\_ _| |
_\__`[_______________|
] [ \, ][ ][
Arno Welzel
So zu sehen z.B. in
<http://arnowelzel.de/wiki/de/computer/pics>
Die Bilder werden, wenn möglich, beim Anklicken in Originalgröße als
Popup angezeigt. Wenn das nicht geht, entsprechend auf die Größe des
Browserfensters verkleinert, aber mit der Option, das Bild auch in
Originalgröße anzeigen zu können.
Und für den Fall, daß jemand JavaScript nicht aktiviert hat, wird statt
dem Popup mit Navigation etc. einfach das Originalbild angezeigt.
Für den Ersteller solcher Seiten genügt es, die Bilder in ein
Verzeichnis hochzuladen und auf der Seite anzugeben, daß der Inhalt
dieses Verzeichnisses als Thumbnail-Ansicht erscheinen soll - die
gesamte Anzeige, serverseitige Skalierung etc. erledigt das
DokuWiki-Plugin selber ;-)