Dirk Ruchatz: Grafik - «IMG (...) WIDTH=x%»

Moin moin!

In SELFHTML <../../tcgb.htm> steht, daß die Angabe einer Prozentzahl bei width / height im IMG-Tag eine relative Vergrößerung bzw. Verkleinerung der Grafik bewirkt (zumindest verstehe ich es so):

eine Angabe von width=120% bedeutet so viel wie sechs Fünftel der eigentlichen Grafikbreite

Beim Durchstöbern der Internetseiten der Stadt Bochum stieß ich auf: http://www.bochum.de/blaue-linie/rund7.htm und stellte mit IE4 fest, daß sich die Grafik relativ zur Fenstergröße (nicht zur Originalgröße) veränderte. Mit NN3 geht es auch!

Nun meine Frage: Wie verhalten sich andere Browser bei einer Prozentangabe für width / height?

Wenn die Angaben genau so interpretiert werden, könnte es ja plötzlich Sinn machen, Prozentwerte an dieser Stelle zu benutzen...

Gruß
Dirk

  1. Hallo Dirk,

    Wenn die Angaben genau so interpretiert werden, >>könnte es ja plötzlich Sinn machen, Prozentwerte an >>dieser Stelle zu benutzen...

    da Prozentwerte immer relativ, d.h. abhaengig von
    den Einstellungen des Betrachters sind, kannst Du das Ergebnis deiner Bemuehungen (Layout der Site) nicht mehr vorhersagen (nicht zu empfehlen).

    Zweitens bedeutet eine Angabe in Prozent immer "Rechenaufwand" fuer deinen Browser was sich auf den
    Aufbau (Geschwindigkeit) deiner Site auswirken wird (bei Bildern noch schlimmer als bei Tabellen).

    MfG
    Heiko A. Reuter

    1. Hi!

      da Prozentwerte immer relativ, d.h. abhaengig von
      den Einstellungen des Betrachters sind, kannst Du das Ergebnis deiner Bemuehungen (Layout der Site) nicht mehr vorhersagen (nicht zu empfehlen).

      Ich denke, Dirk meint gerade die Moeglichkeit, ein Bild abhaengig von der verfuegbaren Fenstergroesse zu zoomen. Das waere ja ganz nett, dann koennte man vielleicht ein relativ grosses Logo darstellen, muesste aber nur ein ganz kleines Bild uebertragen.

      Zweitens bedeutet eine Angabe in Prozent immer "Rechenaufwand" fuer deinen Browser was sich auf den
      Aufbau (Geschwindigkeit) deiner Site auswirken wird (bei Bildern noch schlimmer als bei Tabellen).

      Fuer den oben genannten Fall wuerde aber das Uebertragen des dann groesseren Bildes noch viel laenger dauern.

      Ein paar Probleme fallen mir da noch ein:
      1. <wie Christine schon angemerkt hat> Relativ *wozu* wird gezoomt. Zum naechst-uebergeordneten Element oder zur Fenstergroesse? Wie ich unseren Browser-Park kenne, wird es wiedermal unmoeglich sein, sich auf eine gemeinsame Vorgehensweise zu einigen.
      2. Wenn man ein Bild schon zoomt, dann will man es sicher in Breite und Hoehe in gleichem Masze tun. Wenn es also 3x so breit wird, soll es auch 3x so hoch werden, denn sonst wuerde es ziemlich verzerrt aussehen. Da aber die Zoom-Faktoren fuer Breite und Hoehe vollig unabhaengig voneinander angegeben werden, funktioniert das nur so lange, wie das Verhaeltnis von
      Fenster-Breite : Hoehe == Bild-Breite : Hoehe. (Das ist wieder die Aspect-Ratio-Geschichte, die wir schon mal beim Thema "GIFs mit Perl erstellen" hatten.) Und dieser Fall duerfte aeusserst selten gegeben sein.
      3. Und schliesslich wird ein in die Groesse gezoomtes Bild verdammt pixelig aussehen. Und kleiner zoomen wird man ein Bild wohl eher selten.

      Fazit: Schoen dass es sowas gibt, aber in der Praxis wird man's wohl eher selten verwenden.

      Calocybe

      1. Moin moin!

        Ich denke, Dirk meint gerade die Moeglichkeit, ein Bild abhaengig von der verfuegbaren Fenstergroesse zu zoomen. Das waere ja ganz nett, dann koennte man vielleicht ein relativ grosses Logo darstellen, muesste aber nur ein ganz kleines Bild uebertragen.

        Genau!

        1. Wenn man ein Bild schon zoomt, dann will man es sicher in Breite und Hoehe in gleichem Masze tun. Wenn es also 3x so breit wird, soll es auch 3x so hoch werden, denn sonst wuerde es ziemlich verzerrt aussehen. Da aber die Zoom-Faktoren fuer Breite und Hoehe vollig unabhaengig voneinander angegeben werden, funktioniert das nur so lange, wie das Verhaeltnis von
          Fenster-Breite : Hoehe == Bild-Breite : Hoehe. (Das ist wieder die Aspect-Ratio-Geschichte, die wir schon mal beim Thema "GIFs mit Perl erstellen" hatten.) Und dieser Fall duerfte aeusserst selten gegeben sein.

        Auf http://www.bochum.de/blaue-linie/rund7.htm wird nur "width=30%" benutzt, "height" wird nicht angesprochen. Dadurch verändert sich die Grafik proportional zur Fensterbreite, die Höhe wird im gleichen Verhältnis mit geändert!

        1. Und schliesslich wird ein in die Groesse gezoomtes Bild verdammt pixelig aussehen. Und kleiner zoomen wird man ein Bild wohl eher selten.

        Genau so eine Verkleinerung wird hier gemacht. Da Text um die Grafiken fließt, finde ich das gar nicht mal schlecht, denn in einem kleinen Fenster sieht eine riesige Grafik mit jeweils ein oder zwei Worten Text daneben doch ziemlich bescheuert aus...

        Fazit: Schoen dass es sowas gibt, aber in der Praxis wird man's wohl eher selten verwenden.

        Fazit: Es könnte in manchen Bereichen eine Lösung sein für das leidige Thema "Anpassung an verschiedene Bildschirmauflösungen"! Der Nachteil ist natürlich, daß anders als bei Pixel-Angaben, die Seite nicht schneller aufgebaut wird.

        Gruß
        Dirk

        PS: entschuldigt, falls es durch iframe:... zu längeren Ladezeiten kommt, aber ich wollts einfach mal probieren!

        1. Moin moin!

          Auf http://www.bochum.de/blaue-linie/rund7.htm wird nur "width=30%" benutzt, "height" wird nicht angesprochen. Dadurch verändert sich die Grafik proportional zur Fensterbreite, die Höhe wird im gleichen Verhältnis mit geändert!

          Na eben (mit NS403)! Das ist ja cool. Leider sieht die Anordnung der Bilder bei einer 1024-Aufloesung nicht so besonders aus, wurde wohl fuer 800x600 gemacht.

          1. Und schliesslich wird ein in die Groesse gezoomtes Bild verdammt pixelig aussehen. Und kleiner zoomen wird man ein Bild wohl eher selten.

          Genau so eine Verkleinerung wird hier gemacht.

          Da hatte ich wohl gerade einen Kurzschluss im Gehirn als ich das geschrieben habe. Ich bin naemlich an dieser Stelle davon ausgegangen, dass relativ zur Bild-Breite gezoomt wird, und wer wuerde 100-Kilobyte-weise Bilddaten uebertragen, um dann ein kleines Thumbnail darzustellen (ausser vielleicht um irgend so eine Preload-Geschichte zu machen).

          Fazit: Es könnte in manchen Bereichen eine Lösung sein für das leidige Thema "Anpassung an verschiedene Bildschirmauflösungen"!

          Ist wahr.

          Calocybe

          PS: entschuldigt, falls es durch iframe:... zu längeren Ladezeiten kommt, aber ich wollts einfach mal probieren!

          Kein Problem, der Mister Netscape stellt es sowieso einfach als Link dar. <g>

          1. Hallo!

            PS: entschuldigt, falls es durch iframe:... zu längeren Ladezeiten kommt, aber ich wollts einfach mal probieren!

            Kein Problem, der Mister Netscape stellt es sowieso einfach als Link dar. <g>

            Aber nur hier im Forum, weil Stefan es hier so definiert hat, damit NS-User wenigstens die Möglichkeit haben, den Verweis anzuklicken und sich die Seite anzuschauen.

            Wenn man ansonsten zwischen <iframe> und </iframe> nichts angibt, kriegen NS-User....
            NICHTS zu sehen.

            Ich habe aber auch eine kleine Anmerkung zum Thema "Zoomen": irgendwo (bitte fragt nicht woher, ich weiß es nicht mehr, womöglich war es auf http://www.freeware.de) habe ich mich seinerzeit die IE-Powertoys heruntergeladen. Nach deren Installation wird der IE um einige Funktionen erweitert, die über den Kontextmenü beim Klicken mit der rechten Maustaste aufzurufen sind. Dort ist auch "Zoom in" und "Zoom Out".

            Dabei habe ich festgestellt, daß das Zoomen nur in eine Richtung geht.... es ist nicht möglich, daß WIDTH und HEIGHT der Grafik im gleichen Verhältnis geändert werden. Meistens wird die Breite mehr gestreckt als die Höhe, nach einem Zoom Out und anschliessendem neuen Zoom In, kann es gerade das Gegenteil sein.

            Bis danndann

            PAF (patrickausfrankfurt, nur echt mit tbgg)

      2. Hi!

        Die Entschuldigung nehme ich zurück, denn so konnte ich (und jeder andere, den es interessiert) sehen, daß der Effekt sogar im <iframe> funktioniert! <g>

        Dirk

  2. Hallo,

    In SELFHTML <../../tcgb.htm> steht, daß die Angabe einer Prozentzahl bei width / height im IMG-Tag eine relative Vergrößerung bzw. Verkleinerung der Grafik bewirkt (zumindest verstehe ich es so):

    eine Angabe von width=120% bedeutet so viel wie sechs Fünftel der eigentlichen Grafikbreite

    Beim Durchstöbern der Internetseiten der Stadt Bochum stieß ich auf: http://www.bochum.de/blaue-linie/rund7.htm und stellte mit IE4 fest, daß sich die Grafik relativ zur Fenstergröße (nicht zur Originalgröße) veränderte. Mit NN3 geht es auch!

    Ich habe gerade mal W3C konsultiert.
    Fuer HTML4 steht dort unter
       13.7.1 Width and height:
            Attribute definitions
            width = length [CN]
            Image and object width override.
    und dazu unter
       6.6 Length
            Length: The value ( %Length; in the DTD) may be either a %Pixel;
            or a percentage of the available horizontal or vertical space. Thus,
            the value "50%" means half of the available space.

    Ich lese daraus, dass sich die Prozentangabe auf die insgesamt verfuegbare Breite des uebergeordneten Elements bezieht (kann Fenster sein, muesste aber auch bei Tabellenzelle so sein).

    Was die Browser ganz praktisch da tun, weiss ich nicht sicher. Ich habe  es nie benutzt, verzerre halt hat keine Bilder.
    Aber es gab doch mal zu Netscape3-Zeiten dieses JavaScript, mit dem genau auf die Art die Fenstergroesse ermittelt hat. Ich habe das nicht mehr so genau im Kopf, aber das Prinzip war, eine Grafik mit 100% x 100% darzustellen und daraus dann Rueckschlusse auf die Fentergroesse zu ziehen.
    Waere jemand auf die Idee gekommen, wenn 100% nicht volle Fensterbreite waeren?

    Christine

    1. Hallo,

      Ich lese daraus, dass sich die Prozentangabe auf die insgesamt verfuegbare Breite des uebergeordneten Elements bezieht (kann Fenster sein, muesste aber auch bei Tabellenzelle so sein).

      Was die Browser ganz praktisch da tun, weiss ich nicht sicher. Ich habe  es nie benutzt, verzerre halt hat keine Bilder.
      Christine

      Sinn macht so etwas m.E. z.B. bei der Verwendung von Trennbars (siehe </Selfhtml/tic.htm>), die dann unabhängig von der Bildschirmauflösung dargestellt werden.

      Johannes