Bildauflösung vollständige Größe schlechter als groß

  • Hallo,

    wieso ist die vollständige Auflösung von 2500 x 1432 px schlechter als die große Darstellung von 1024 x 587 px. Ich benötige die volle Auflösung, da der Text der Infografik sonst unscharf ist. Kann mir da jemand helfen?



    vs

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren


  • wieso ist die vollständige Auflösung von 2500 x 1432 px]

    Diese Auflösung ist ja schlicht größer als Dein Bildschirm bzw. der Bildschirm des Users. So wird alles gestaucht, also auch die Schrift. Besser ist es, das Bild zuerst auf eine vernünftige Bildschirmgröße zu bringen und dann die Schrift einzufügen, dann wird sie klar dargestellt.

  • @phil21oo
    Also anhand dieser Screenshots kann ich nicht wirklich erkennen, wo das Problem liegt. Ein echter Link zu den Bildern wäre hilfreicher.

    @Kurt Singer
    Die Auflösung von 2500px ist schon sinnvoll, damit die Texte auf einem Retinabildschirm gut dargestellt werden. Selbst ein kleines 14Zoll MacBook hat schon über 3000px Auflösung.


  • wieso ist die vollständige Auflösung von 2500 x 1432 px schlechter als die große Darstellung von 1024 x 587 px. Ich benötige die volle Auflösung, da der Text der Infografik sonst unscharf ist. Kann mir da jemand helfen?

    1- Theme auf volle Auflösung einstellen
    2- ein modernes Dateiformat verwenden, dass auch Texte gut darstellen kann. PNG ist veraltet.
    3- für die Bildbearbeitung in WordPress nicht die gd-lib verwenden (der Provider sollte das richtige Modul zur Verfügung stellen).
    4- je nach verwendeten Verfahren würde ich das Bild nachschärfen. wie man Bilder mit PHP schärfen kann, steht vermutlich im PHP Handbuch...

    Mit offenen Augen träumen

  • Also mit dem Bild ist im Frontend alles in Ordnung. Selbst hier auf einem Retina sieht es nahezu hundertprozentig aus. Hast du dich vielleicht einfach nur von der Darstellung im Backend irritieren lassen?

    Einzig die Dateigröße solltest du noch verringern. Das Bild ist mit über 1 MB zu groß. Entweder konvertierst du es noch ins WebP Format oder wenn du bei PNG bleiben möchtest nutze TinyPNG. Danach sollte dein Bild nur noch 200-300 KB groß sein.

  • p.s.: da du es auf der Seite ja gar nicht bildschirmfüllend darstellst (da war ich von ausgegangen), kannst du die Auflösung natürlich auch verringern! Es hat ja nur 800 px Breite auf deiner Seite!

  • @phil21oo
    Die Auflösung von 2500px ist schon sinnvoll,

    1920x1080 px ist schon Full HD und reicht für Monitore bis 27 " voll aus. Und die Bildgröße sollte man schon mit einem Bildbearbeitungsprogramm auf die richtige Größe bringen. Für mich gilt: meine Fotos sind maximal 1200 px in der Breite, die Höhe richtet sich nach dem Format,

  • 1920x1080 px ist schon Full HD und reicht für Monitore bis 27 " voll aus.

    Ja, für den normalen Hausgebrauch von durchschnittlichen Bildern auf herkömmlichen Büromonitoren reicht das aus. Die haben idR nicht mehr als FullHD bei irgendwas von 72-96 ppi.

    Wenn du aber eine Pixel-Schrift oder eine Pixel-Strichgrafik auf einem modernen hochauflösenden Displays (Retina, HiDPI, UltraHD) wirklich scharf darstellen möchtest, reicht das nicht. Ein modernes Retina-Display hat eine 4x höhere Pixeldichte. Aktuelle Smartphones haben mit 325-360 ppi eine höhere Auflösung als ein Hochglanzmagazin (300 dpi). Eine Grafik für 72 ppi sieht auf solchen Bildschirmen entsprechend "matschig" aus.

    Auf der Website von Apple werden daher bspw. Strichgrafiken für Vollbild in 2.880 px dargestellt, bzw. relevante Grafiken werden mit doppelter Auflösung eingesetzt und dann skaliert.

    Beispiel 1: Display
    Beispiel 2: Strichgrafik

    Quelle der Beispiele auf der Seite: iPhone13

    Auf Kulturbanause wird das Thema recht gut erläutert.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!