Skip to main content

Der Unterschied zwischen Pixelgrafiken und Vektorgrafiken

Von 3. November 2015 Oktober 26th, 2022 Know-how
Der Unterschied zwischen Pixelgrafiken und Vektorgrafiken

Wer sich schon einmal eingehender mit verschiedenen Bildformaten beschäftigt hat, ist dabei sicherlich auch über die Begriffe Pixel und Vektor gestolpert. Beides sind Elemente, aus denen ein Bild bestehen kann. Doch was unterscheidet Pixelgrafiken von Vektorgrafiken, welche Vor- und Nachteile haben sie? Und für welche grafischen Arbeiten benutzt man sie jeweils am besten? Wir haben die beiden gegenübergestellt und ein wenig näher beleuchtet.

Pixelgrafiken

Der Name Pixel ist eine Kombination der beiden englischen Begriffe „picture“ und „element“, zu Deutsch so viel wie Bildelement oder Bildpunkt. Als Pixel werden einzelne quadratische Punkte bezeichnet, aus denen sich ein Bild zusammensetzt. Jeder dieser Punkte hat eine Farbe und aus ihrer Kombination ergibt sich schließlich das Bild. Im Normalfall sind diese Punkte sehr klein, damit möglichst viele Farbinformationen widergegeben werden können und das Ergebnis scharf ist. Erst bei starker Vergrößerung erkennt man die einzelnen Bestandteile. Dabei ändern sich die Abmessungen des Bildes, seine Auflösung bleibt aber gleich. Diese wird in dpi, also dots per inch (engl. für Punkte pro Zoll) angegeben. Wird ein Bild zum Beispiel auf das Doppelte vergrößert, wird jedes Pixel doppelt so groß. Auf einem Inch sind also nur noch halb so viele Bildpunkte. Je stärker die Vergrößerung, desto grobkörniger, pixeliger wird das Bild.

Damit wird auch schon der deutlichste Nachteil einer Pixelgrafik klar. Das Ändern der Größe bei gleichbleibender Qualität ist nicht möglich. Und je größer und schärfer das Bild, desto größer die Datei. Gerade beim Versenden per Mail ein (im wahrsten Sinne des Wortes) großes Problem. Dafür ist eine sehr genaue Darstellung von Details möglich – je nachdem, wie hoch die Auflösung ist. Komplexe Farbabstufungen und Verläufe sind hier kein Problem. Jeder einzelne Punkt kann bearbeitet werden. Es gibt viele verschiedene Dateiformate für unterschiedliche Einsatzbereiche, jeweils auf diese zugeschnitten. Diese Dateiformate sind nicht an ein bestimmtes Programm gebunden, sondern können in den meisten Bildbearbeitungsprogrammen angezeigt und bearbeitet werden.

Formate: TIF, JPG, BMP, PNG, PSD, GIF, uvm.
Bearbeitungsprogramme: z. B. Adobe Photoshop, Fireworks, Corel PaintShop Pro

Vektorgrafiken

Den Begriff Vektor kennen die meisten wahrscheinlich noch aus dem Mathe-Unterricht. Und tatsächlich ist eine Vektorgrafik eine Art mathematische Formelsammlung. Aus den Informationen von geometrischen Figuren wie Linien, Kurven, Kreisen oder Polygonen entstehen Grafiken, die zu einem komplexeren Bild zusammengefügt sind. Dabei werden keine Pixel, sondern Pfade gespeichert, die zum Beispiel die Informationen zu Größe und Farbe enthalten. Diese Pfade können verändert werden, ohne dass ein Qualitätsverlust entsteht. Vor allem bei einer Vergrößerung wird hier der Unterschied zu Pixelgrafiken deutlich. Eine Vektorgrafik kann beliebig vergrößert werden, ohne an Schärfe einzubüßen. Die gespeicherten Angaben werden auf die neue Größe umgerechnet und die Figuren entsprechend gezeichnet. So eignen sich Vektorgrafiken besonders für Logos oder Icons, die oft in verschiedenen Größen gebraucht werden. Weil das Bild dadurch nicht mehr, sondern nur geänderte Informationen enthält, wird auch die Datei nicht größer.

Im Gegensatz zu einer Pixelgrafik lassen sich in einer Vektorgrafik komplexe Details nur sehr schwer darstellen. Effekte wie Schatten oder Reflektionen zum Beispiel müssen aufwändig mit zusätzlichen Elementen in den entsprechenden Farbabstufungen per Hand angelegt werden. Die Dateiformate, als die Vektorgrafiken abgespeichert werden, erfordern meist spezielle Programme, mit denen sie kompatibel sind. Eine Ansicht und Bearbeitung ist dann nur in diesem Programm möglich. Eine .ai-Datei kann zum Beispiel nur mit Adobe Illustrator geöffnet werden.

Formate: z. B. EPS, AI, CDR, WMF, PDF
Bearbeitungsprogramme: z. B. Adobe Illustrator, Corel Draw, Macromedia FreeHand

Doreen

Über Doreen

Doreen ist eine echte Vollblut-Texterin, die schon so manche Tastatur an ihre Grenzen brachte. Sie ist vielseitig interessiert und beruflich schon immer im Marketing zu Hause. Am liebsten bringt sie nützliches Druckwissen und kreative Werbeideen auf den Punkt.

6 Kommentare

  • Tony sagt:

    Wenn ich bei euch im Online-Designer ein Faltblatt erstelle, kann ich natürlich nur Pixelgrafiken einfügen.
    Diese sehen verkleinert in der Vorschau etwas verpixelt aus (keine “glatten” Linien). Wenn man auf 400 % hineinzoomt, werden sie annähernd korrekt angezeigt.
    Werden diese Bilder dann im Druck richtig dargestellt?
    Das grüne Smilie-Symbol zeigt mir an, dass die Qualität stimmt …

    • Doreen sagt:

      Hallo Tony,
      ganz recht. Der Online-Designer prüft Ihre Bilder beim Hochladen ab und teilt Ihnen mit, wenn etwas nicht oder in zu schlechter Qualität gedruckt werden kann. Dass Ihre Pixelbilder im Online-Designer unscharf dargestellt werden, ist lediglich ein kleiner Darstellungsfehler und hat keine Auswirkungen auf den Druck. Wird das grüne Smilie-Symbol angezeigt, ist mit Ihren Bilddaten alles in Ordnung und Sie können Ihren Auftrag getrost abschicken.

      Viele Grüße
      Doreen

      • Tony sagt:

        Vielen Dank! Das ist sehr hilfreich …
        eine Frage hätte ich noch bevor ich den Auftrag absende: Ich habe mit eurem Online-Desiner ein Faltblatt erstellt.
        Als es fertig war, habe ich bemerkt, dass das Foto auf der Vorderseite sehr unscharf dargestellt wird (das grüne Smilie-Symbol wird angezeigt aber auch beim Reinzoomen bleibt es völlig unscharf). Es liegt nicht am Foto, das ist 300dpi und hochauflösend. Wenn ich das Foto manuell ein zweites mal daneben einfüge, ist es nämlich auch scharf (nur passt es nicht in die Wellen-Form der Vorlage).
        Nun habe ich herausgefunden, dass dies bei ziemlich all euren Design-Vorlagen auftritt, wo das Foto in der Vorlage nicht rechteckig sondern beliebig zugeschnitten ist (z.B. sternförmig, kreisförmig, wellenförmig).
        Überall dort wird das Foto (wenn man auf “Bild ersetzen” geht und die Vorlage ersetzt) sehr unscharf angezeigt. In Design-Vorlagen wo das Foto rechteckig ist, wird es scharf angezeigt.
        Ist dieses “Problem” ebenfalls nur in der Anzeige im Designer so und im Druck wird es dann scharf?
        (Habe bereits euren Kundenservice kontaktiert, dieser konnte nicht weiterhelfen.)
        Leider kann man die Vorlage nicht einfach so ändern, müsste es komplett neu machen was mehrere Stunden dauern würde.
        Viele Grüße

        • Doreen sagt:

          Hallo Tony,
          vielen Dank für diesen Hinweis. Es handelt sich hier tatsächlich um einen Darstellungsfehler, der keine Auswirkungen auf Ihren Druck hat. Sie können den Auftrag also getrost abschicken. Wir konnten das Problem rekonstruieren und haben die entsprechenden Kolleginnen und Kollegen direkt dazu informiert.

          Sollten Sie zum Online-Designer noch weitere spezifische Fragen haben, wenden Sie sich gerne an die E-Mail-Adresse: info@flyeralarm.com (Betreff: Online gestalten) oder rufen Sie unsere Hotline an unter 0931-465840-3, um direkt mit unserem Druckdaten-Team zu sprechen.

          Viele Grüße
          Doreen

  • Michael sagt:

    Das sind gut gemachte Erläuterung – die manchmal im Kundengespräch hilfreich wären bzw. sind :-).

    Aber woher kommt eigentlich diese seltsame Schreibweise hier:

    “Das Könnte Sie Auch Interessieren:”
    statt
    “Das könnte Sie auch interessieren:”

    Seltsam dabei ist die Tatsache, dass die Schreibweise mithilfe von Copy ‘n Paste korrekt erscheint – nur die Darstellung erfolgt (hier) falsch. Warum?

    Das interessiert mich jetzt – auch wenn OT 🙂

    • Kai sagt:

      Hallo Michael,

      erst einmal vielen Dank für das Lob. Wir versuchen stets Blogbeiträge zu verfassen, die nah an den Fragen und Problemen der Community sind. Feedback wie Ihres zeigt uns, dass wir auf dem richtigen Weg sind. Nun zu Ihrem zweiten Punkt: der seltsamen Schreibweise.

      Wir sind der Sache auf den Grund gegangen und tatsächlich: Hier und da werden in Blog-Überschriften fälschlicherweise Großbuchstaben verwendet. Wenn wir den Text rauskopieren und in Word einfügen, korrigiert sich der Fehler selbst. Wir haben das Problem gleich unserer IT-Abteilung gemeldet. Danke für Ihr aufmerksames Lesen. Auf die guten Augen unserer Blog-Community ist Verlass.

      Mit besten Grüßen aus Würzburg
      Kai

Hinterlassen Sie einen Kommentar