Gestaltung statischer Medien

Aus Fachkompetenzen zu E-Learning in Mecklenburg-Vorpommern

Dr. Sybille Hambach (Fraunhofer IGD Rostock)

So wie es keine einheitliche Definition für Multimedia gibt, gibt es auch keine umfassende und fundierte Theorie zu Multimedia. Viele verschiedene Disziplinen waren und sind an der Entstehung und Entwicklung von Multimedia als eigenem Fachgebiet beteiligt: Psychologie und Soziologie, Pädagogik und Didaktik, Kunst, Informatik und Informationstechnik, etc.

Die Gestaltung von Multimedia-Dokumenten und Anwendungen ist erfahrungsbezogen und interdisziplinär: neben Grundkenntnissen auf den verschiedenen Fachgebieten braucht man für besondere Aufgaben meist auch Spezialisten: Grafiker, Programmierer, Fachwissenschaftler.

Doch keine Angst auch mit einfachen Mitteln lässt sich schon einiges erreichen. Viele gute Multimedia-Anwendungen, gerade im World Wide Web, sind von Laien gemacht. Mit pfiffigen Ideen und ein wenig Gespür kann man oft mehr erreichen als mit teurer Technik und großen Teams.

Die folgenden Gestaltungsaussagen basieren weitgehend auf empirischen Befunden und Heuristiken. Dabei werden die statischen Medien (also die zeitunabhängigen Informationsarten) zunächst einzeln und jeweils unter Berücksichtigung von technischen und gestalterischen Parametern betrachtet.

Inhaltsverzeichnis 1 Gestaltung von Text 1.1 Text - Gestalterische Parameter 1.2 Text - Technische Parameter 1.3 Text - Dateiformate 2 Gestaltung von Abbildungen 2.1 Gestaltung von Bildern 2.2 Gestaltung von Grafik 2.3 Abbildungen - Technische Parameter 2.4 Abbildungen - Dateiformate

[bearbeiten] Gestaltung von Text

Text ist eine inhaltlich zusammenhängende Folge von Wörtern, Sätzen und Aussagen und damit die sichtbare Wiedergabe gesprochener Worte. In verschiedenen Ländern werden unterschiedliche Repräsentationen für Text verwendet: lateinische Buchstaben, kyrillische Buchstaben, das chinesische Zeichensystem, etc.

Text ist ein sehr verbreitetes und ein sehr »billiges« Medium. Die meisten Menschen sind es gewöhnt, Informationen mit Hilfe von Texten aufzunehmen. Texte lassen sich im Vergleich zu anderen Informationsarten einfach und schnell erstellen. Es ist keine spezialisierte Software erforderlich, um Text zu schreiben, zu speichern und darzustellen. Deshalb ist Text, gerade in Multimedia-Anwendungen für das Lernen und Lehren und zur Informationsvermittlung eine sehr verbreitete Informationsart.

Trotzdem gibt es bei der Gestaltung von Text einiges zu beachten.

[bearbeiten] Text - Gestalterische Parameter

Text am Bildschirm wird langsamer gelesen als Text auf Papier. Deshalb hört man häufig die Empfehlung, die Darstellung längerer Texte auf dem Bildschirm zu vermeiden. Aber: Viele Leute sind es gewöhnt, Informationen aus Texten aufzunehmen und oft nicht bereit, sich von dieser Gewohnheit zu lösen. Aufgrund der ständig steigenden Menge elektronisch verfügbarer Informationen wird es nicht ausbleiben, in Zukunft auch längere Texte am Bildschirm zu lesen.

Die geschickte und durchdachte Gestaltung von Texten sowohl inhaltlich als auch in der Darstellung erleichtert den Lesern die Aufnahme von Informationen aus elektronischen Texten. Ein eigenes Fachgebiet »Schreiben für elektronische Medien« ist bereits in der Entstehung begriffen. Im folgenden werden einige Gestaltungsempfehlungen gegeben; mehr Informationen dazu finden sich in Puscher 2001.

Der Charakter der Schrift sollte die inhaltlichen Aussagen des Textes unterstützen

Jede Schrift hat ihre eigene Anmutung und enthält durch Satz und Anordnung eine eigene Aussage. Diese Aussage sollte dem Inhalt eines Textes und seiner Funktion entsprechen.

Nutze möglichst serifenlose Schriftarten

Diese Aussage gilt vor allem für den Bildschirm. Serifenschriften sind hier ungeeignet, weil das Schriftbild mit den vielen kleinen An- und Endstrichen auf dem Monitor verzerrt dargestellt wird.

Wähle eine ausreichende Schriftgröße

Die Schriftgröße sollte sich an der Wichtigkeit der Mitteilung, der Bildschirmgröße und vor allem an der Zielgruppe orientieren. Generell gilt: Soll ein Text am Bildschirm gelesen werden, so muss dieser in einem größeren Schriftgrad gesetzt werden. Je kleiner die Schrift, desto dünner die Linien der einzelnen Buchstaben, desto schwieriger ist die Schrift auf dem Bildschirm zu lesen. Verschiedene Schriftarten unterscheiden sich bei gleicher Schriftgröße in der Lesbarkeit, weil die Höhe der Kleinbuchstaben unterschiedlich ist.

Benutze Klein- und Großbuchstaben

Das Setzen eines Textes ausschließlich in Großbuchstaben vermindert die Lesegeschwindigkeit um etwa 13% und benötigt etwa 30% mehr Platz als der Einsatz von Groß- und Kleinschreibung. Der Leser erkennt Wörter und Wortgruppen an ihrer Form. Besteht ein Text nur aus Großbuchstaben, so muss jedes Wort in Silben gelesen werden. Der Leser muss mehr Konzentration aufwenden, um den Text zu verstehen.

Vermeide die Trennung von Wörtern am Zeilenende

Zu viele Worttrennungen verlangsamen die Lesegeschwindigkeit. Eine schlechte Wahl der Trennpunkte erschwert die Wiedererkennung von Einzelwörtern und Wortgruppen.

Verwende möglichst wenige verschiedene Schriftarten

Die Schriftarten und -größen von Überschriften und Text sollten sorgfältig gewählt und aufeinander abgestimmt werden. Die Unterschiede dürfen weder zu groß noch zu klein sein.

Wähle Auszeichnungen mit Bedacht

Die Beschränkung auf ein oder zwei Auszeichnungen erhöht die Lesbarkeit des Textes, weil die Wiedererkennung der Wörter erleichtert wird. Viele verschiedene Auszeichnungen bringen Unruhe in den Text.

Beschränke die Zeilenlänge auf 40 bis 60 Zeichen

Leser bevorzugen kürzere Zeilen, weil weniger Aufwand nötig ist, um das Auge von Wort zu Wort und vom Zeilenende zum nächsten Zeilenanfang zu bewegen. Text mit mehr als 60 Zeichen ist schwer zu lesen, ohne das das Auge abschweift.

Setze den Text linksbündig

Ebenmäßige Abstände zwischen den Wörtern ohne große Lücken unterstützen die Lesbarkeit von Texten. Der Blocksatz führt oft zu ungleichmäßigen Abständen zwischen den Wörtern. Rechtsbündig oder zentriert gesetzter Text verlangsamt die Lesegeschwindigkeit, weil das Auge immer wieder nach dem Anfang der Zeile suchen muss.

Durch den ausgewogenen Einsatz verschiedener Schriften und die sorgfältige Variation der Eigenschaften von einzelnen Wörtern und ganzen Texten kann die Aufnahme der zu vermittelnden Informationen durch den Leser wesentlich beeinflusst werden. Wichtig ist außerdem die Aussage des Textes, die durch die Gestaltung von Schrift und Text unterstützt, aber auch gemindert werden kann. Generell gilt, dass das Lesen von Text am Bildschirm etwa 25 bis 30% mehr Zeit in Anspruch nimmt und dabei wesentlich mehr Fehler gemacht werden. Das Auge ermüdet schneller, die Konzentration lässt schnell nach.

Es gibt viele weitere Empfehlungen für den Einsatz von Schrift. Diese sollten einerseits nicht als Dogma betrachtet werden, andererseits sollte man sehr genau wissen, wann und warum man sich gegen diese Empfehlungen richtet.

[bearbeiten] Text - Technische Parameter

Die Auswahl der Eigenschaften einer Schrift für einen Text bestimmt in wesentlichem Maße die Wahrnehmung und Erfassung des Textes durch den Betrachter. Schrift wird in der Typographie durch eine Anzahl von Parametern beschrieben. Einige (nicht alle) dieser Parameter sind im folgenden erläutert.

Schriftart

Jede Schriftart ist mit einem Namen bezeichnet. Zu den wesentlichen Unterscheidungsmerkmalen für Schriftarten gehören Serifen und Proportion. Man unterscheidet Serifenschriften, dass sind Schriften mit kleinen Ansatz-, End- oder Querstrichen bei den einzelnen Buchstaben, und serifenlose (sans serif) Schriften ohne diese Striche. Bei Proportionalschriften sind die Abstände zwischen den einzelnen Buchstaben abhängig von der Breite des Zeichens. Im Gegensatz dazu stehen Rasterschriften, wo Zeichen in einem festen Raster dargestellt werden.

Schriftschnitt

Der Schriftschnitt bestimmt die Breite der Schriftzeichen sowie die Neigung der Schriftzeichen gegenüber der Senkrechten. Man unterscheidet im wesentlichen zwischen den Schriftschnitten Standard, Fett und Kursiv.

Schriftgröße oder Schriftgrad

Der Schriftgrad wird nach DIN 1451 am Großbuchstaben H gemessen und in der Regel in Punkten angegeben. Für die Einheit Punkt gibt es wiederum verschiedene Maßsysteme (Didot, Pica), ein Punkt entspricht jedoch in etwa 0,37 mm.

Ausrichtung

Ein Text kann linksbündig, rechtsbündig, zentriert oder im Block gesetzt werden.

Laufweiten und Abstände

Einzelne Buchstaben eines Wortes, aufeinanderfolgende Wörter in einer Zeile, aufeinanderfolgende Zeilen eines Absatzes sowie aufeinanderfolgende Absätze sind durch Abstände voneinander getrennt. Im Normalfall sind die Abstände von der gewählten Schriftart, der Schriftgröße und einigen anderen Faktoren abhängig. Das Schriftbild eines Textes und damit auch seine Lesbarkeit lassen sich durch Vergrößern (gesperrter Satz) oder Verkleinern der Laufweiten und Abstände entscheidend verändern.

Spezialeffekte

Sowohl einzelne Buchstaben als auch Wörter und Absätze kann man durch verschiedene Spezialeffekte hervorheben (diese Hervorhebung wird auch Auszeichnung genannt). Man kann Text höher oder tiefer stellen, in Großbuchstaben oder Kapitälchen setzen, einfärben oder sperren. Man kann die Grundlinie des Textes drehen oder bestimmten Formen folgen lassen. Die Anzahl der Spezialeffekte ist kaum begrenzt, man sollte sie allerdings sparsam und sehr überlegt einsetzen. Sie lenken die Aufmerksamkeit des Betrachters, deshalb wirkt Text mit zu vielen Spezialeffekten überladen.

Schrift ist auf allen Computern Systemressource: Die verschiedenen Schriftarten sind auf dem Rechner installiert; Anwendungsprogramme definieren lediglich die technischen Parameter, die dann durch den Rechner in ein konkretes Schriftbild umgesetzt werden. Probleme kann es geben, wenn unterschiedlich konfigurierte Computer diese Parameter verschieden interpretieren: So kann es passieren, dass die angegebene Schriftart auf einem Rechner nicht verfügbar ist, so dass der Computer stattdessen eine alternative Schriftart aus derselben Schriftfamilie wählt. Oder eine Schriftart ist nicht in der gewählten Auszeichnung verfügbar, so dass ein eigentlich ausgezeichneter Text normal angezeigt oder anders ausgezeichnet wird.

Diese Probleme kann man umgehen, indem man technische Parameter nur sehr allgemein spezifiziert. Gibt man zum Beispiel für Schrift lediglich den Parameter sans-serif an ohne den Namen für eine konkrete Schriftart zu nennen, so wird der Text auf dem PC standardmäßig in der Schriftart Arial, auf dem Mac standardmäßig in der Schriftart Helvetica dargestellt. Auf diese Lösung wird oft im Web zurückgegriffen.

Eine weitere Möglichkeit besteht darin, die Systemressourcen, also zum Beispiel spezielle Schriftarten oder Schriftschnitte, mitzuliefern. Das ist bei Multimedia auf CD-ROM problemlos möglich.

Will man ganz bestimmte Effekte erzielen, kann Text auch als Bild abgespeichert werden. Diese Lösung ist relativ speicherintensiv und sollte nur in begründeten Fällen angewandt werden. Hier wurde sie zum Beispiel zur Illustration der verschiedenen technischen Parameter genutzt, damit auch wirklich das dargestellt wird, was im Text beschrieben ist.

[bearbeiten] Text - Dateiformate

Die Dateiformate für Text in Multimedia-Anwendungen sind abhängig von der zur Erstellung der Anwendung verwendeten Software. Kommerzielle Präsentationssoftware wie MS Powerpoint, aber auch Autorensysteme wie Toolbook und Macromedia Director verwenden eigene Dateiformate. Die Texte und auch alle anderen Medien werden in diesem speziellen Dateiformat abgelegt. Multimedia- Anwendungen für das World Wide Web werden hingegen in der Dokumentenauszeichnungssprache HTML beschrieben, wobei der Text direkt im HTML Dokument steht und andere Medien mit speziellen Kommandos eingebunden sind.

HTML steht für Hypertext Markup Language. Diese Auszeichnungssprache für Hypertext-Dokumente wurde am Europäischen Kernforschungszentrum CERN speziell für das World Wide Web entwickelt, um die logische Struktur von Dokumenten, ihre hierarchische Gliederung zu beschreiben. HTML definiert die typischen Elemente eines Dokumentes, dass im World Wide Web publiziert werden soll. Es gibt Tags (Markierungen) für Überschriften, Textabsätze, Listen, Tabellen, Links etc. Mit Hilfe dieser Tags lässt sich für die verschiedenen Textelemente ein fest definierter Erstreckungsraum und mit Hilfe von Attributen auch die Formatierung festlegen. Außerdem kann man Bilder, Videos, Animationen und andere Multimedia-Elemente in HTML-Seiten einbetten und das Aussehen des Gesamtdokumentes bestimmen.

Die Erstellung von HTML-Dateien ist nicht an ein kommerzielles Softwareprodukt gebunden. Im Gegenteil, HTML-Dateien lassen sich mit jedem beliebigen Texteditor bearbeiten, der Daten als reine Textdateien abspeichern kann. Voraussetzung ist natürlich, dass man die Tags kennt und die Sprache HTML beherrscht. Ihre Benutzung ist einfach und intuitiv auch ohne Kenntnis des Englischen, auf das die Bezeichnungen für die einzelnen Tags zurückgehen. Es gibt aber auch eine Vielzahl von layoutorientierten Editoren bei denen die HTML-Sprachelemente in Formatfunktionen verborgen sind. Mit diesen Editoren, zum Beispiel MS FrontPage oder Macromedia Dreamweaver, gestaltet man den Text und braucht sich um die korrekte Auszeichnung in HTML nicht zu kümmern.

Der vorliegende Text ist ebenfalls in HTML ausgezeichnet. Die HTML-Datei wird vom Webbrowser in »lesbarer« Form angezeigt. Um zu sehen, wie der in HTML formatierte Text ursprünglich aussieht, klickt man mit der rechten Maustaste auf den Text. Es wird ein Menü geöffnet, aus dem man, je nach Browser, den Eintrag »Quelltext anzeigen« oder »View Page Source« o.ä. auswählt. In einem separaten Browserfenster wird die Datei in HTML angezeigt.

Die Sprache HTML ist durch das »World Wide Web Konsortium« standardisiert worden. Sie wurde schrittweise weiterentwickelt und existiert deshalb in verschiedenen Versionen (wobei aber mittlerweile alle Browser die Version 4.0 unterstützen). HTML ist inzwischen das am meisten verbreitete Dateiformat der Welt. Es wird nicht nur im Web sondern zum Beispiel auch für Dokumentationen, auf CD-ROM und als Austauschformat verwendet. SELFHTML von Stefan Münz ist eine sehr gute Dokumentation zu HTML und anderen Web-Technologien, die für den Autodidakten unbedingt zu empfehlen ist.

[bearbeiten] Gestaltung von Abbildungen

Man ist landläufig der Meinung, dass sich die durchschnittliche Verstehens- und Behaltensleistung um ein Drittel verbessert, wenn Texten Abbildungen (sowohl Grafik als auch Bilder) hinzugefügt werden. Allerdings gibt es für diese Annahme wohl keine wissenschaftlichen Belege. Trotzdem kann man Sachverhalte mit Hilfe von Abbildungen oft anschaulicher darstellen als wenn sie nur durch Text beschrieben sind.

Deshalb soll die Gestaltung von Abbildungen ebenfalls ausführlich diskutiert werden. Dabei wird zwischen Grafik und Bildern unterschieden.

[bearbeiten] Gestaltung von Bildern

Bild ist ein Gestaltungselement, das Informationen in fotorealistischer Form visuell darstellt. Mit der Digitalkamera oder einer anderen Kamera wird ein Ausschnitt der Wirklichkeit zu einem ganz bestimmten Zeitpunkt eingefangen und konserviert.

Obwohl es sich um ein Abbild der Wirklichkeit handelt, sind Fotos nicht objektiv - der Bildausschnitt, die Wahl des Motivs und des Blickwinkels, die Beleuchtung, zusätzliche Filter etc. werden vom Fotografen ausgewählt und bestimmen den Bildeindruck nicht unerheblich. Eine strenge Abgrenzung zwischen Bild und Grafik ist nicht möglich. So bewegen sich computererzeugte Darstellungen, zum Beispiel mit dem Computer erzeugte Collagen von Fotos, im Grenzbereich zwischen den beiden Medientypen.

Bilder - Gestalterische Parameter Die Gestaltung von Bildern ist abhängig von der Funktion die sie wahrnehmen sollen. Wie beim Gestaltungselement Grafik unterscheidet man auch für Bilder allgemein die folgenden Bildfunktionen:

• Dekoration

Lenkung der Aufmerksamkeit, Erhöhung der Attraktivität

• Darstellung

Veranschaulichung von im Text beschriebenen Sachverhalten

• Organisation

Sichtbarmachung der Textstruktur

• Interpretation

Verdeutlichung abstrakter Sachverhalte

Eine bewusste Entscheidung für die Funktion eines Bildes erleichtert dessen Gestaltung.

Bilder bestehen meist aus drei verschiedenen Ebenen: Vordergrund, Bildmitte und Hintergrund. Handlungstragende Ereignisse oder Objekte befinden sich in der Regel in der Bildmitte. Vorder- und Hintergrund bilden den Kontext und tragen zum Bildverständnis und zur Bildwirkung bei. Interessante Effekte können entstehen durch Schärfeverlagerung, durch ungewöhnliche oder farbig hervorstechende Objekte (Eyecatcher), durch ungewöhnliche Perspektiven etc.

Die Gestaltung von Fotos erfolgt zum einen bei der Bildaufnahme durch die Wahl von Ausschnitt, Motiv, Blickwinkel, Beleuchtung etc. Aber es ist auch eine nachträgliche Gestaltung des Bildes durch eine Bild(nach)bearbeitung möglich. So lässt sich zum Beispiel die Bildgröße verändern durch:

• Verkleinerung des gesamten Bildes (scaling)

Dabei kommt es in der Regel zum Verlust von Darstellungsdetails und damit zum Verlust von Informationen.

• Verwendung eines Ausschnittes (cropping)

Hier geht der Bildkontext verloren; auch dadurch kommt es zum Verlust von Informationen.

Dieser Informationsverlust kann erwünscht sein wenn man sich beim Einsatz der Bilder auf das Wesentliche konzentrieren will. So werden große Bilder skaliert, wenn der Zusammenhang zwischen verschiedenen Objekten dargestellt werden soll. Will man den Blick des Betrachters auf das Wesentliche lenken, verwendet man nur einen Ausschnitt aus einem größeren Bild. Allerdings ist sicherzustellen, das das Bild trotz des Informationsverlusts durch Verkleinerung im richtigen Kontext verwendet wird. Ansonsten gelten auch für Bilder die gestalterischen Empfehlungen, die bereits für das Darstellungselement Grafik gegeben wurden.

[bearbeiten] Gestaltung von Grafik

Grafik ist eine diskrete Informationsart, die Informationen in schematischer Form visuell darstellt. Balken- und Tortendiagramme dürften jedem bekannt sein, aber auch Landkarten, Karikaturen und Verkehrsschilder gehören zum Darstellungselement Grafik. Auf Bilder als fotorealistische Darstellung von Sachverhalten wird im folgenden Abschnitt genauer eingegangen.

Man unterscheidet für Grafik zwei verschiedene Darstellungsvarianten - Diagramme und Analogiebilder:

• Ein Diagramm ist eine grafische Darstellung, die keine Ähnlichkeit mit dem dargestellten Gegenstand besitzt und zum Teil auch Sachverhalte repräsentiert, die gar nicht wahrnehmbar sind. Zu den Diagrammen zählen zum Beispiel Säulendiagramme, Kreisdiagramme, Ablaufdiagramme etc. Für die Gestaltung von Diagrammen gibt es eine große Anzahl von Konventionen und Normen (DIN 66001). Diese müssen eingehalten werden, damit die Diagrammdarstellung durch den Betrachter richtig dekodiert werden kann.

• Analogiebilder zeigen schematisch, wie etwas aussieht. Sie sind realistischer als Diagramme aber noch keine fotorealistischen Darstellungen. Zu den Analogiebildern zählen Landkarten, Schemazeichnungen, Karikaturen, Cliparts, Symbole (Icons, Verkehrszeichen) etc.

Grafik - Gestalterische Parameter

Gestaltung unterliegt dem Zeitgeist und dem kulturellen Raum. So lässt sich den meisten Gemälden oder Gebrauchsartikeln auch ohne spezielle Kenntnisse eine bestimmte Entstehungszeit zuordnen.

Hier sei zunächst wieder auf die Gestaltgesetze als Grundlage für die visuelle Wahrnehmung räumlicher Beziehungen zwischen Objekten verwiesen. Darüber hinaus ist der gestalterische Freiraum bei der Erstellung von Diagrammen gering. Aussagen zur Eignung einzelner Diagrammtypen für bestimmte Aussagen findet man bei Jarz 1996 auf Seite 215ff und in vielen anderen Veröffentlichungen zu Aufbau, Gestaltung und Einsatz von Diagrammen.

Die Gestaltung von Analogiebildern ist abhängig von der Funktion die sie wahrnehmen sollen. Man unterscheidet für Abbildungen allgemein die folgenden Bildfunktionen:

• Dekoration

Lenkung der Aufmerksamkeit, Erhöhung der Attraktivität

• Darstellung

Veranschaulichung von im Text beschriebenen Sachverhalten

• Organisation

Sichtbarmachung der Textstruktur

• Interpretation

Verdeutlichung abstrakter Sachverhalte

Eine bewusste Entscheidung für die Funktion eines Bildes erleichtert dessen Gestaltung. Einige allgemeine Gestaltungsempfehlungen kann man sowohl für Diagramme als auch für Analogiebilder geben. Auch hier gilt wieder: Die geschickte und durchdachte Gestaltung von Grafik erleichtert den Lesern die Aufnahme von Informationen und erhöht damit sowohl die Motivation als auch die Behaltensleistung.

Verwende ein angemessenes Maß an Komplexität.

Die Komplexität einer grafischen Darstellung sollte immer dem Anlass und der Funktion entsprechen. Im Zweifelsfall entscheidet man sich für ein mittleres Maß an Komplexität.

Lenke die Aufmerksamkeit des Betrachters durch Größe und Farbe.

Hervorhebungen von einzelnen Objekten oder Teilen einer Grafik erreicht man durch vergrößerte Darstellung, dicke Linien, auffällige Farben. Allerdings ist Vorsicht geboten: Grafiken mit zu viel Hervorhebungen wirken überladen und werden schnell unübersichtlich.

Verwende konkrete verbale Erläuterungen.

Das gilt vor allem für Beschriftungen in Diagrammen, aber auch für Texte in Analogiebildern. Bestes Beispiel ist das Stoppschild, das mit der zwar freundlichen aber auch umständlichen Aufforderung »bitte hier anhalten« kaum ein so eindringliches Verkehrszeichen wäre.

Stelle Abfolgen von links nach rechts dar.

Aufgrund der Leserichtung für Texte werden auch Grafiken in dieser Richtung betrachtet. Allerdings gilt die Empfehlung nicht für alle Kulturkreise.

Achte auf Übereinstimmung von Text und Bild.

Das gilt wieder vor allem für Beschriftungen in Diagrammen, aber auch für Texte in Analogiebildern. Durch ungenaue oder fehlerhafte Beschriftungen kann die gesamte Bildaussage gestört werden. Auch diese Empfehlungen für die Gestaltung von Grafik sollten zwar einerseits nicht als Dogma betrachtet werden, andererseits sollte man sehr genau wissen, wann und warum man sich gegen die Empfehlungen wendet.

[bearbeiten] Abbildungen - Technische Parameter

Bei der Verwendung von Abbildungen in Multimedia-Anwendungen spielen zwei technische Parameter eine zentrale Rolle :

• die Dateigröße
• die Darstellungsqualität, die wiederum von der Auflösung und der Farbtiefe bestimmt wird.

Dateigröße

Die Dateigröße gibt an, wieviel Speicherplatz zum Abspeichern einer Datei benötigt wird. Die Dateigröße für Bilder kann einige kByte oder auch mehrere MByte (1 MByte = 1024 kByte, 1 kByte = 1024 Byte, 1 Byte = 8 Bit) betragen. Gerade bei internetbasierten multimedialen Anwendungen steigt mit zunehmender Dateigröße immer auch die Ladezeit für eine Datei oder ein Bild. Es ist deshalb wichtig, sehr sorgfältig zu überlegen, wo man welche Bilder einsetzt und diese im am besten geeigneten Bildformat abzuspeichern.

Auflösung

Die Auflösung gibt die Anzahl der Pixel an, die auf einer bestimmten Fläche zur Verfügung stehen. Sie wird in ppi bzw. dpi (pixel/ dots per Inch, Pixel/ Punkte pro Zoll) gemessen und ist von Ausgabegerät zu Ausgabegerät verschieden. Monitore haben eine Auflösung von 72 dpi, Scanner können mit 300 oder auch mit 600 dpi aufnehmen, für den Druck verwendet man mindestens 600 dpi, um ein sauberes Schriftbild zu erreichen.

Farbtiefe

Die Farbtiefe gibt an, wie viele Bit pro Pixel eines Bildes für die Kodierung der Farbinformationen zur Verfügung stehen. Mit einem Bit Farbtiefe kann man zwei Farben, mit zwei Bit vier Farben, etc. kodieren. Mit einer Farbtiefe von 24 Bit lassen sich theoretisch 16,7 Millionen verschiedene Farben darstellen. In der Praxis sind allerdings 16 Bit Farbtiefe mit 32.768 darstellbaren Farben ausreichend, weil sie der Farbwahrnehmung des Menschen sehr nahe kommen und für eine realistische Farbdarstellung völlig genügen.

Weitere Parameter

für Grafik, wie Strichdicke, Strichtyp (durchgezogen, gestrichelt, strichpunktiert, etc.), Füllung (gefüllt, schraffiert, gemustert, Farbverlauf, etc.) werden hier nicht weiter erläutert, weil sie allgemein bekannt sind. Für eine ausführliche Darstellung wird auf Jarz 1996 verwiesen.

Diese Parameter gelten für Bilder analog. Dabei ist allerdings die Farbtiefe von besonderer Bedeutung, weil Bilder meist viele Farben enthalten. Eine intelligente Verringerung der Anzahl der Farben und die geschickte Speicherung der Bilddaten (Kompression) erlauben die Reduktion der Dateigröße bei guter Darstellungsqualität. Das ist vor allem im Web wichtig, wo jedes Byte zusätzlich eine Erhöhung der Übertragungszeit für das Bild bedeutet.

[bearbeiten] Abbildungen - Dateiformate

Das Bildformat (Dateiformat für Grafiken und Bilder) bestimmt die Art und Weise der Abspeicherung von Bildinformationen wobei die verschiedenen Formate für unterschiedliche Bildtypen jeweils besonders geeignet sind. Das Ziel bei der Auswahl des geeigneten Formates besteht darin, bei hoher Darstellungsqualität eine möglichst kleine Bilddatei (minimale Dateigröße) zu erhalten.

Das Bildformat GIF wurde von der Firma CompuServ speziell für den Online Einsatz entwickelt und patentiert. Es bietet im Vergleich zu anderen Bildformaten eine sehr hohe Komprimierungsdichte. Die Bilder werden mit 256 Farben pro Bild verlustfrei komprimiert, allerdings können bei der Reduktion auf 256 Farben Darstellungsverluste auftreten. Zudem bietet das Bildformat GIF einige interessante Besonderheiten:

Bilder lassen sich »interlaced«, das heißt schichtweise abspeichern. Bei der Übertragung der Bilder erscheint im Browser zunächst die Grundstruktur der Abbildung, die dann schrittweise so wie die Daten übertragen werden verfeinert wird. Der Betrachter erkennt sehr schnell, was das Bild beinhaltet. Er muss nicht warten bis alle Daten übertragen sind und das Bild als ganzes angezeigt werden kann. Es lassen sich mehrere Abbildungen in einer einzigen Datei abspeichern. Die Bilder werden nacheinander geladen und einmal oder mehrmals hintereinander angezeigt. Solche Mini-Filme (Animated GIF) kann man vielfältig einsetzen, zu den weniger angenehmen Anwendungen gehören Werbebanner.

Mit Hilfe des Bildformates GIF kann man einen transparenten Farbwert definieren. Dieser Farbwert wird dann bei Darstellung des Bildes im Browser nicht angezeigt, so dass der Seitenhintergrund durchscheint. Man erhält frei stehende Objekte oder Figuren was bei sorgfältiger Bearbeitung des Ausgangsbildes interessante Effekte erlaubt.

Für Fotos oder fein strukturierte Grafiken ist das Bildformat GIF weniger gut geeignet, weil eine Reduktion auf 256 Farben das Ursprungsbild meist stark verändert. Hohe Kompressionsraten bei guter Bildqualität erhält man dagegen bei einfachen Grafiken, da hier die Anzahl der Bildfarben von vornherein unter 256 liegt. Generell gilt: Je weniger Farben, desto besser die Kompression, desto geringer die Dateigröße.

+ =

Für Bilder im Web sind die Dateiformate JPG und PNG interessant. JPG (oder JPEG) steht für Joint Photographic Expert Group, eine gemeinsame Arbeitsgruppe von ISO, CCITT (Comité Consultatif International Télégraphique et Téléphonique) und IEC (International Electrotechnical Commission), die das Bildformat entwickelte und 1992 standardisierte. Für Grafiken mit feinen Farbverläufen und für Fotos ist JPG besonders geeignet. Es lassen sich bis zu 16,7 Millionen Farben abspeichern, allerdings wird mit Verlust komprimiert: Je höher der Kompressionsfaktor, desto schlechter die Bildqualität.

Das Bildformat PNG (Portable Network Graphic, Sprich »ping«) wurde speziell für das World Wide Web konzipiert und vom World Wide Web Konsortium 1996 als Empfehlung verabschiedet. Es soll die Vorteile von verschiedenen Bildformaten in sich vereinen:

• PNG komprimiert verlustfrei wie das GIF-Format.
• PNG unterstützt bis zu 16,7 Millionen Farben wie das TIFF- und das JPEG-Format.
• PNG ist wie GIF und JPEG plattformunabhängig.
• PNG unterstützt Transparenz wie das TIFF-Format.
• PNG unterstützt Farbpaletten unterschiedlicher Größe.
• PNG erlaubt das Abspeichern zusätzlicher Information, z.B. von Autor- und Copyrighthinweisen, in der Grafikdatei.

Die Unterstützung, sprich die korrekte Implementierung führender Browserhersteller vorausgesetzt wird sich PNG als ein Bildformat für das World Wide Web und als Ersatz für GIF weiter durchsetzen. Es gibt weitere Dateiformate für pixelorientierte Bilder: Man verwendet zum Beispiel zusätzlich zu den bereits genannten Formaten GIF, JPG und PNG die Dateiformate TIFF (Tagged Image File Format), BMP (Bitmap) und WMF (Windows Meta File). Diese werden unter anderem in Holzinger/Technik 2000 detailliert beschrieben.