1. Herzlich willkommen bei WPDE.org, dem grössten und ältesten deutschsprachigen Community-Forum rund um das Thema WordPress. Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können.
    Information ausblenden

Bilder wie groß anlegen

Dieses Thema im Forum "Design" wurde erstellt von mbhh, 2. Oktober 2019.

  1. mbhh

    mbhh Well-Known Member

    Registriert seit:
    7. März 2014
    Beiträge:
    91
    Zustimmungen:
    1
    Hallo,

    wie legt man heutzutage Bilder an, um genug Auflösung für hochauflösende Monitore zu bieten? Ich arbeite hier auf einem 100 dpi Monitor. Wenn ich ein Bild, das auf diesem Monitor gut in ein Weblayout passt, mit doppelter Kantenlänge anlege, reicht das dann?

    Also: Bei mir sind z.B. 300 x 300 Pixel ok, ich lege das Bild dann in 600 x 600 Pixel an. Oder reicht das nicht mehr?

    Danke.

    Gruß
    Michael
     
  2. r23

    r23 Well-Known Member

    Registriert seit:
    9. Dezember 2006
    Beiträge:
    7.317
    Zustimmungen:
    582
    Die hochauflösenden Displays haben eine höhere Pixeldichte als gewöhnliche Monitore. Auf der gleichen Fläche werden etwa viermal so viele Pixel dargestellt. Der Vorteil dieser Technologie liegt darin, dass die Pixel nun so klein sind, dass das menschliche Auge sie nichtmehr auflösen kann. Das Ergebnis sind extrem scharfe Fotos.

    Ein Pixel der Grafik entspricht auch auf dem Retina-Display einem Pixel, nur das viermal so viele und dafür kleinere Pixel abgebildet werden. Damit die Grafiken nicht alle zu klein dargestellt werden, rechnen die Geräte die Grafiken um. Dadurch geht allerdings Qualität verloren. Deine 600 x 600 Grafik wird auf dem Retina-Display unscharf ausssehen... außer, du lieferst diese Grafik als alternative für deine 300 x 300 Grafik aus.

    Beispiel
    https://css-tricks.com/on-responsive-images/

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    https://github.com/scottjehl/picturefill
    https://imulus.github.io/retinajs/


    Beispiel und weitere Lösungswege bei SelfHTML
    https://wiki.selfhtml.org/wiki/HTML/Tutorials/Bilder_im_Internet/responsive_Bilder
     
  3. mbhh

    mbhh Well-Known Member

    Registriert seit:
    7. März 2014
    Beiträge:
    91
    Zustimmungen:
    1
    Danke dir. Ich bleibe erst mal beim Faktor 2, von meinem Monitor ausgehend, damit liegt man wohl immer noch richtig.

    Gruß
    Michael
     
  4. r23

    r23 Well-Known Member

    Registriert seit:
    9. Dezember 2006
    Beiträge:
    7.317
    Zustimmungen:
    582
    nicht wirklich, man benötigt mindestens bis 4x

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    https://wiki.selfhtml.org/wiki/HTML/Multimedia_und_Grafiken/Grafiken

    2x reichte bis 2014 aus...

    Ich persönlich würde mich an die aktuellen "Empfehlungen" halten
    https://html.spec.whatwg.org/multipage/images.html#images
     
  5. mbhh

    mbhh Well-Known Member

    Registriert seit:
    7. März 2014
    Beiträge:
    91
    Zustimmungen:
    1
    Warum mindestens bis 4x?

    Oben schreibst du: "Auf der gleichen Fläche werden etwa viermal so viele Pixel dargestellt."

    Da bin ich bei dir. Daraus folgt dann aber: Seitenlänge jeweils x 2 und dann passt das.
     
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden