Inhalt Rechts
Rechte optische Spalte
Kalender
heise Security
Inhalt Mitte
Hauptinhalt
Grundlagen der Bildbearbeitung
- 1.) Auflösung und Farbtiefe
- 2.) Grafikformate
- 3.) Komprimierungsarten
- 4.) Grafikarten - Beispiele und Unterschiede
- 5.) Bildformate für das Web
- 6.) Farblehre
- 7.) Einige Beispiele zum Beitrag
- 8.) Externe Links zum Thema/Quellenangaben
1.) Auflösung und Farbtiefe
Die Auflösung eines Bildes wird auch dpi (dots per Inch = Punkte pro Inch) genannt. Ein Inch ist gleich ein Zoll was wiederum 2,54cm sind. Um so größer die Auflösung eines Bildes, um so detaillierter sind die Bildinformationen und um so größer ist die Bilddatei. Ein Standard-Monitor kann 96 dpi darstellen. Hat ein Bild nun eine Auflösung von 192 dpi, so kann man es mit doppelter Originalgröße anzeigen lassen, oder es müssen sich immer zwei Bildpunkte einen Monitorpunkt teilen.
Das menschliche Auge hat etwa eine Auflösung von 300 dpi, d.h., es kann auf einen Millimeter etwa 12 Punkte erkennen. Mehr Punkte verschwimmen zu einer Fläche. Für einen Bildausdruck bedeutet dies, dass 300 dpi ausreichen, je nach Papiersorte auch weniger. Außerdem sind bei großen Bildern auch weniger dpi nötig, da diese von einer größeren Entfernung betrachtet werden.
Die Farbtiefe beschreibt die Anzahl der unterschiedlichen Farben/Schattierungen, die ein Bildpunkt besitzen kann. Bei einer Farbtiefe von 8 Bit (=1 Byte) sind schon 256 (=2^8) Farben möglich. Dies bedeutet aber auch, dass ein Bildpunkt ein Byte an Speicher benötigt.
2.) Grafikformate
- Rasterformate
Rasterformate werden auch Bitmaps genannt und enthalten punktweise Daten eines Bildes (Pixel).
- Vorteile: Einfach zu erstellen, gut geeignet für Drucker
- Nachteile: Bitmaps können sehr groß werden, Bitmapbilder lassen sich schlecht vergrößern/verkleinern (skalieren)
- Vektorformate
Mithilfe von mathematischer Beschreibung der Objekte und der Anordnung, wird das Bild beschrieben.
- Vorteile: Für Bilder mit linienartigen Objekten (Linien, Rechtecke, Kreise, Text, ...)
- Nachteile: Nicht geeignet für pixelartige Bilder (Fotos)
- Metaformat
Mischung aus Raster- und Vektorformat.
3.) Komprimierungsarten
| - Ohne Kompression | --> | hoher Speicherverbrauch |
| - Verlustbehaftete Kompression | --> | JPEG (bekannteste), Originalinformationen gehen verloren |
| - Verlustfreie Kompression | --> | Verfahren: RLE, LZW, CCITT |
4.) Grafikarten - Beispiele und Unterschiede
| Endung | Format | Kompression | Farbtiefe | Max. Größe |
|---|---|---|---|---|
| BMP | Raster | Ohne (selten RLE) | -16,7 Mio (24 Bit) | 65535x65535 |
| GIF | Raster | LZW | -256 (8 Bit) | 65535x65535 |
| JPG | Raster | JPEG | -16,7 Mio (24 Bit) | 65535x65535 |
| DXF | Vektor | Ohne | ||
| WMF | Meta | Ohne/RLE/LZW/JPEG | -16,7 Mio (24 Bit) | Keine |
| PNG | Raster | Verlustfrei | -281,5 Bil (48 Bit) |
5.) Bildformate für das Web
- Weit verbreitete Formate sind das jpg- und das gif-Format (siehe Pos. 3). Jpg eignet sich gut für Fotos, während gif mehr für einfachere Farb- und Bildstrukturen ist.
Gif-Bilder haben aber noch zwei weitere Vorteile:- sie können (teilweise) transparent sein (neuere Version)
- in einer Datei können mehrere Bilder sein, die nacheinander (animiert) angezeigt werden
- Ein weiteres Format ist das PNG-Format (gesprochen Ping). Nach dem Willen der Entwickler soll damit das Gif-Format ersetzt werden, denn die Entwickler des Gif-Formates möchten gerne Lizenzgebühren haben.
Vorteile PNG gegenüber GIF sind 16,7 Mio Farben. Nachteile sind, dass PNG nicht animierbar ist und erst von Browser ab der Version 4.0 verstanden werden. - Ein viertes Format ist JPEG2000, welches als Ersatz für das jpg-Format dienen soll. JPEG2000 soll bei gleicher Kompressionsrate verlustfrei Koprimieren und mehr Farben unterstützen, sowie Transparenz. Nachteil: Wird zurzeit von Browsern nur mit Plugins unterstützt und ist für Websites noch nicht geeignet.
- Das letzte Format ist das SVG-Format. SVG ist eigentlich eine Sprache zur Erstellung von Vektorgrafiken. Zusätzlich können in SVG auch Rastergrafiken eingebunden werden und sie kann durch Scriptsprachen animiert werden. SVG-Anweisungen können sogar durch CSS formatiert werden. Nachteil: Obwohl die SVG-Spezifikation schon im September 2001 verabschiedet wurden ist, ist zur Darstellung in den meisten Browsern noch ein Plugin nötig.
6.) Farblehre
Farbmischungen
In der Farblehre gibt es die additive und die subtraktive Farbmischung. Die additive Farbmischung kommt beim Mischen von Licht zum Tragen. Die Lichtfarben müssen gemischt/addiert werden, um Weiß zu ergeben (siehe Sonnenlicht).
Die subtraktive Farbmischung bezeichnet das Mischen von normalen Farben (Tuschkasten, Drucker). Hier müssen die Farben entfernt werden (subtrahiert) um Weiß zu ergeben.
Primär- und Sekundärfarben
Mithilfe der drei Primärfarben kann man jede andere Farbe mischen. Das Mischen von zwei Primärfarben zu gleichen teilen ergibt eine Sekundärfarbe.
In der additiven Farbmischung sind die Farben rot, grün und blau die Primärfarben.
Sekundärfarben:
Rot - Grün = Gelb
Rot - Blau = Magenta
Blau - Grün = Cyan
In der subtraktiven Farbmischung sind die Farben gelb, Cyan und Magenta die Primärfarben.
Sekundärfarben:
Cyan - Gelb = Grün
Gelb - Magenta = Orange
Magenta - Cyan = Purpur
Das Mischen einer Sekundär- und einer Primärfarbe zu gleichen Teilen ergibt eine Tertiärfarbe.
Komplementärfarben und Nachbilder
Eine Komplementärfarbe ist die gegenteilige Farbe einer vorhandenen Farbe. Am Farbkreis für sie subtraktive Farbmischung kann man leicht die Komplementärfarbe einer Farbe erkennen.
Komplementärfarben:
Grün - Magenta
Cyan - Orange
Gelb - Purpur
Schaut man sich z.B. einen Augenblick einen grünen Kreis an (siehe Beispiel) und danach auf eine weiße Fläche, so sieht man einen Moment lang ein Nachbild des grünen Kreises, aber in seiner Komplementärfarbe Magenta.
Dieses Phänomen der Nachbilder tritt nicht nur beim Blick auf eine weiße Fläche auf, sondern mehr oder weniger deutlich bei jeder Farbe. Dies hat zur Folge, dass sich zwei benachbarte Farben durch Überlagerung mit ihren Komplementärfarben gegenseitig beeinflussen. Sind benachbarte Farben Komplementärfarben voneinander, so wird der Effekt der eigenen Farbe verstärkt (z.B. rote Blumen auf einer grünen Wiese).
Am größten ist dieser Überlagerungseffekt natürlich dort, wo die beiden Farben aufeinander treffen.
Farbpsychologie
Neben den schon beschriebenen optischen Auswirkungen und Beeinflussungen von Farben haben diese auch noch einen psychologischen Effekt auf den Betrachter. So können Farben Gefühle und Stimmungen beim Betrachter auslösen, Aufmerksamkeit auf einen bestimmten Bereich lenken, oder Eigenschaften suggerieren.
Beispiele:
| Gelb | --> | Optimismus, Heiterkeit, Freundlichkeit |
| Rot | --> | Aktivität, Gefahr, Wärme, Leidenschaft |
| Blau | --> | Harmonie, Ruhe, Passivität |
| Weiß | --> | Sauberkeit, Vollkommenheit, Leichtigkeit |
| Schwarz | --> | Trauer, pessimistisch, schwer |
Helle Bildelemente werden als leichter empfunden und länger betrachtet. Dunkle Elemente werden als schwer empfunden und treten schneller in den Hintergrund.
7.) Einige Beispiele zum Beitrag
- JPEG-Komprimierungsraten (neues Fenster)
- Vergleich von JPEG- und GIF-Format (neues Fenster)
- Flagge - Nachbild (neues Fenster)
8.) Externe Links zum Thema/Quellenangaben
- Einige weitere Nachbilder
- Metacolor. Alles Über Farben!
- Grafikformate und deren Konvertierung
- Grundlagen: Grafik und Computer
- Morgan JPEG2000 Plug-in fü Mozilla/Firefox
- Rendern eines Bildes in eine Datei
- Farbempfindung und Farbpsychologie
Dieser Artikel wurde bereits 12656 mal angesehen.
