Angabe der Bildgröße

[Kevin]

Hi,
ich habe mehrere Fragen zur angabe von width/height für Bilder.
1. Angabe sinnvoll wenn Original-Bildgröße angezeigt werden soll
2. Wenn Bild kleiner angezeigt werden soll als das Original, ist es sinnvoll eine Kopie des Bildes mit der anzuzeigenden Größe zu machen?

[hotti]

Hi,

ich habe mehrere Fragen zur angabe von width/height für Bilder.

1. Angabe sinnvoll wenn Original-Bildgröße angezeigt werden soll

Auf jeden Fall. Der Browser reserviert so den Platz für die Bilder, die meist später kommen als der Text und somit "steht" die Seite.

2. Wenn Bild kleiner angezeigt werden soll als das Original, ist es sinnvoll eine Kopie des Bildes mit der anzuzeigenden Größe zu machen?

Jow, wenn die Kopie dateimäßig kleiner ist, wird sie schneller geladen. Ladezeiten spielen auch in Zeiten der Breitbandanschlüsse immer noch eine große Rolle.

Hotti

[Kevin]

Hallo,
danke für die schnelle Antwort.
Jetzt habe ich aber dazu eine Nachfrage.

width/height für Bilder.

1. Angabe sinnvoll wenn Original-Bildgröße angezeigt werden soll

Auf jeden Fall. Der Browser reserviert so den Platz für die Bilder, die meist später kommen als der Text und somit "steht" die Seite.

Man soll ja diese (Style-) Angaben möglichst immer in CSS-Dateien auslagern,.
Wenn aber praktisch jedes Bild andere Größen haben kann, wäre die Angabe in CSS wohl nicht sinnvoll - oder?

[Matthias Apsel]

Om nah hoo pez nyeetz, Kevin!

Wenn aber praktisch jedes Bild andere Größen haben kann, wäre die Angabe in CSS wohl nicht sinnvoll - oder?

Für das Design einer Seite wäre es sicher sinnvoll, wenn die Bilder nicht sehr viele verschiedene Formate haben. Bearbeite die Bilder vorher so, dass du dich auf einige Formate beschränken kannst. So könntest du dann den Bildern Klassen verpassen. Zum Beispiel <img class="format_1">. Aber theoretisch kannst du auch darauf verzichten, mit dem von hotti beschriebenen Nachteil.

Matthias

[bleicher]

Grüße,
css hin oder her - aber ich war bisher fester Überzeugung die Bilder tragen ihren Kreuz der Maße zur Golgota der Darstellung selbständig?
MFG
bleicher

[Matthias Apsel]

Om nah hoo pez nyeetz, bleicher!

tun sie.

folgende Szenarien sind denkbar:

#1# Bildgrößen im CSS definiert, Grafiken erlaubt Bereits während des Ladens der Seite wird der Platz für die Bilder bereitgestellt, noch bevor die Bilder geladen werden. Das bedeutet, die Seite ist stabil, man kann den Text schon lesen, bevor sich ein Bild dazwischen schiebt.

#2# Bildgrößen im CSS definiert, Grafiken nicht erlaubt Das Layout der Seite stimmt mit dem Layout der Seite mit Bildern überein, weil die Platzhalter der Grafiken genauso groß wie die Grafiken selbst sind.

#3# Bildgrößen nicht im CSS, Grafiken erlaubt Die Darstellung der Seite verändert sich während des Ladens. Man kann zum Beispiel Texte noch nicht lesen, weil Grafiken ihren Platz beanspruchen und den Text "wegschieben"

#4# Bildgrößen nicht im CSS, Grafiken nicht erlaubt Das Layout der Seite unterscheidet sich ggf. vom gewünschten, weil die Platzhalter der Grafiken deutlich kleiner sind

#5# CSS aus, Grafiken erlaubt Wenn die tatsächliche Grafikgröße mit der im CSS angegebenen übereinstimmt, sollte es keine Unteschiede geben.

#6# CSS aus, Grafiken nicht erlaubt siehe #4#

Matthias

[bleicher]

Grüße,

#4# Bildgrößen nicht im CSS, Grafiken nicht erlaubt
Das Layout der Seite unterscheidet sich ggf. vom gewünschten, weil die Platzhalter der Grafiken deutlich kleiner sind

ich meinte die Angabe der größen im img-tag nicht das weglassen. es fehlt also ein szenario, oder?
MFG
bleicher

[Matthias Apsel]

Om nah hoo pez nyeetz, bleicher!

Du könntest natürlich zusätzlich die Größen auch noch als Attribute angeben. IIRC, reicht in dem Fall sogar eine Angabe und die andere berechnet der Browser selbst.

Matthias

[Der Martin]

Hi,

Du könntest natürlich zusätzlich die Größen auch noch als Attribute angeben. IIRC, reicht in dem Fall sogar eine Angabe und die andere berechnet der Browser selbst.

das stimmt, es hilft aber nicht, um den Platz des Bildes zu reservieren, solange das Bild selbst (noch) nicht verfügbar ist. Dazu muss man Breite *und* Höhe angeben.

Ciao,
 Martin

[Beat]

Wenn eine Bildgrösse, egal ob als Atribnut oder mittels CSS definiert ist
   Wenn Bildanzeige unterdrückt ist
      Wenn der Alttext länger ist, als der durch die Grösse freigelassene Raum
         Dann werden Teile des Alttextes unlesbar.

Mein Fazit: Reserviere nie Platz für Bilder. Lasse den Browser selbständig den Platz für den Alttext beanspruchen.

mfg Beat

[Matthias Apsel]

Wenn eine Bildgrösse, egal ob als Atribnut oder mittels CSS definiert ist    Wenn Bildanzeige unterdrückt ist       Wenn der Alttext länger ist, als der durch die Grösse freigelassene Raum          Dann werden Teile des Alttextes unlesbar.

FF stellt bei fehlenden Bildern, die sich im normalen Fluss befinden, den Alttext vollständig dar. Die anderen Browser nicht.

Mein Fazit: Reserviere nie Platz für Bilder. Lasse den Browser selbständig den Platz für den Alttext beanspruchen.

Dennoch ist das ein interessanter Aspekt und setzt Usability vor Bequemlichkeit.

Matthias

[Beat]

Wenn eine Bildgrösse, egal ob als Attribut oder mittels CSS definiert ist
   Wenn Bildanzeige unterdrückt ist
      Wenn der Alttext länger ist, als der durch die Grösse freigelassene Raum
         Dann werden Teile des Alttextes unlesbar.

FF stellt bei fehlenden Bildern, die sich im normalen Fluss befinden, den Alttext vollständig dar.

Auch für den FX: Nicht unter den oben erwähnten Prämissen.

Die anderen Browser nicht.

mfg Beat

[Matthias Apsel]

FF stellt bei fehlenden Bildern, die sich im normalen Fluss befinden, den Alttext vollständig dar.

Auch für den FX: Nicht unter den oben erwähnten Prämissen.

Doch. FF3.6.13 unter Vista und zwar egal ob ich die Grafiken über die Developer-Bar oder über die Einstellungen deaktiviere und auch egal, ob die src-Angabe fehlerhaft ist.

Matthias

[Beat]

FF stellt bei fehlenden Bildern, die sich im normalen Fluss befinden, den Alttext vollständig dar.

Auch für den FX: Nicht unter den oben erwähnten Prämissen.

Doch. FF3.6.13 unter Vista und zwar egal ob ich die Grafiken über die Developer-Bar oder über die Einstellungen deaktiviere und auch egal, ob die src-Angabe fehlerhaft ist.

OK ich hatte bei meinem test ein inline-block noch drin.
Offensichtlich unterscheidet FX den display-typ eines inline-replaced-Elements je nach Bildstatus.

mfg Beat

[Der Martin]

Hallo,

css hin oder her - aber ich war bisher fester Überzeugung die Bilder tragen ihren Kreuz der Maße zur Golgota der Darstellung selbständig?

ja, wenn wir davon ausgehen, dass man Bilder nicht durch den Browser vergrößern oder verkleinern möchte, haben sie eine feste inhärente Größe. Also wäre eine zusätzliche Angabe, wo auch immer, eigentlich nicht nötig.

Macht man diese Angabe trotzdem, dann möchte man damit erreichen, dass der Platz für das Bild reserviert bleibt, auch wenn das Bild selbst fehlt; auch der Seitenaufbau ist dann ruhiger.

Da aber -wie im ersten Satz festgestellt- die Größe eigentlich eine feste Eigenschaft des Bildes ist, und nicht ein gestalterischer Parameter, den man nach Belieben variieren möchte, würde ich diese Information lieber als Attribut im Markup unterbringen, als im CSS.

So long,
 Martin

[Beat]

ich habe mehrere Fragen zur angabe von width/height für Bilder.

1. Angabe sinnvoll wenn Original-Bildgröße angezeigt werden soll.

Wenn das Bild nicht geladen werden kann, ist die Grösse durch die Angabe dennoch definiert. Das kann oder kann nicht ein Vorteil sein.

2. Wenn Bild kleiner angezeigt werden soll als das Original, ist es sinnvoll eine Kopie des Bildes mit der anzuzeigenden Größe zu machen?

Es ist immer gut, ein Bild in der optimalen Grösse darzustellen. Alles andere erzeugt Artefakte.

mfg Beat

[Kevin]

... und bin so klug als wie zuvor!

[Matthias Apsel]

Om nah hoo pez nyeetz, Kevin!

... und bin so klug als wie zuvor!

Du musst jetzt einfach den Thread aufmerksam lesen und entscheiden, was für dich wichtiger ist:

• Bei nicht erlaubter Grafikdarstellung sollen die ALT-Texte unter allen Umständen lesbar sein, dann vergib keine Größenangaben.

• Du möchtest, dass die Text-Inhalte deiner Seite schon während des Seitenaufbaus lesbar sind, dann vergib Größenangaben. Reduziere dabei die Anzahl der verschiedenen Formate auf ein Minimum und mach die Größenangaben im CSS.

• Wenn deine Bilder so groß sind, dass der ALT-Text in jedem Fall in den reservierten Platz passt, vergib Größenangaben.

Matthias

[Kevin]

Hallo!
Danke für die Quintessenz!

* Wenn deine Bilder so groß sind, dass der ALT-Text in jedem Fall in den reservierten Platz passt, vergib Größenangaben.

Der ALT-Text dürfte aber doch nie angezeigt werden, wenn sauber gearbeitet wird?

[Matthias Apsel]

Om nah hoo pez nyeetz, Kevin!

Der ALT-Text dürfte aber doch nie angezeigt werden, wenn sauber gearbeitet wird?

Der ALT-Text wird angezeigt, wenn aus irgendwelchen Gründen, auch aus welchen, die du nicht verantworten kannst, die Grafik nicht angezeigt werden kann.

• falsche src-Angabe (dafür kannst du was)
• der Server kann das Bild nicht liefern (meist kannst du nichts dafür)
• der User will keine Grafiken sehen

Matthias

[Kevin]

Der ALT-Text wird angezeigt, wenn aus irgendwelchen Gründen, auch aus welchen, die du nicht verantworten kannst, die Grafik nicht angezeigt werden kann.

* falsche src-Angabe (dafür kannst du was)
* der Server kann das Bild nicht liefern (meist kannst du nichts dafür)
* der User _will_ keine Grafiken sehen

Wieder etwas gelernt, Danke!

[Gunnar Bittersmann]

@@Matthias Apsel:

nuqneH

* falsche src-Angabe (dafür kannst du was)
* der Server kann das Bild nicht liefern (meist kannst du nichts dafür)
* der User _will_ keine Grafiken sehen

+  * der User _kann_ keine Grafiken sehen

Dann ist ihm allerdings egal, ob width und height angegeben sind.

Qapla'

[Gunnar Bittersmann]

@@Kevin:

nuqneH

... und bin so klug als wie zuvor!

Oh, jemand, der Kevin heißt und Goethe zitiert. So schlimm kann’s ja mit unserer Jugend nicht sein! ;-)

Qapla'