Letzte Änderung: 21.10.98 von B. Tritsch
Stichworte:
Rastergraphik
Diese Enttäuschung kennt jeder Web-Designer: Mühevoll erstellte Graphiken erscheinen im Web entweder in schlechterer Qualität oder sogar völlig entstellt. Da sind weiße Flächen plötzlich mit schwarzen Flecken übersäht, Farbverläufe durch wilde Nuancen unterbrochen oder Schriftzüge völlig unscharf. Bilder die auf Papier höchsten Ansprüchen genügen ernten im WWW nur noch Hohn und Spott. Dazu sind die Ladezeiten solcher verunglückten Graphiken oftmals noch völlig unzumutbar. Daher muß einem Web-Designer zunächst einmal das 1 x 1 der Graphiken im Web nahegebracht werden.
Eine Bitmap, Pixmap oder Rastergraphik ist eine einfache Informationsmatrix, welche die kleinsten darstellbaren Elemente eines Computermonitors - die Pixels (Picture Elements) - beschreibt. Eine eindimensionale Matrix wird für eine monochrome Bitmap benötigt. Größere Tiefe (mehr Informationsbits) resultieren in einer höheren Farbauflösung bzw. Farbtiefe. Aus diesem Grund sind die wichtigsten Kenngrößen einer Graphik, die als Bitmap gespeichert oder verarbeitet wird, ihre Breite und Höhe in Pixels sowie die Farbtiefe in Bits.
Eine Bitmap in der gängigen Größe von 640 x 480 Pixels in True-Color benötigt somit schon ein knappes Megabyte an Speicherressourcen. Dateiformate für Bitmaps erlauben es diese Daten zu speichern oder weiterzuverarbeiten. Daher spielen Kompressionsverfahren von Bilddaten eine wesentliche Rolle für das Web-Design. Die einzelnen Bild- bzw. Kompressionsverfahren sind jedoch auf bestimmte Bildinhalte optimiert. Im Laufe der letzten Jahre haben sich für das WWW mehrere Standardformate herausgebildet:
Bei der Erstellung von Graphiken für das WWW sollten Web-Designer noch eine Eigenheit der gängigsten Browser für Windows und Macintosh beachten. Nur 216 Farben werden unter allen diesen Plattformen identisch dargestellt, bei anderen Farben greifen unter Umständen Mechanismen wie Farbsubstitution (Best-Match) oder Dithering (Mischfarben). Die 216 Farben ergeben sich aus dem mathematischen Modell eines Farbwürfels mit 6 x 6 x 6 Farben. Dabei werden für die Farbtöne Rot, Grün und Blau jeweils sechs verschiedenen Nuancen mit den Intensitäten 00h, 33h (=51), 66h (=102), 99 (=153), CCh (=204) und FFh (=255) gewählt. Die Kombination ergibt 63 = 216 unterschiedliche Farben. Einfarbige Farbflächen sollten daher immer aus einer dieser Grundfarben bestehen.
Ein interessanter Trick zur Optimierung von Graphiken ist ihr Zerschneiden in einen Satz von Kacheln. Diese können dann mit Hilfe einer HTML-Tabelle wieder nahtlos zusammensetzen Dieses Vorgehen kann sowohl die Dateigröße erheblich reduzieren als auch die Darstellungsqualität drastisch erhöhen, da die einzelnen Kacheln nicht dasselbe Format haben müssen.
Audio
Vibriert ein Gegenstand in der Luft (wie z.B. die Membran eines Lautsprechers), dann produziert er Druckwellen. Gelangen diese an ein menschliches Trommelfell, dann werden sie als Ton wahrgenommen. In Luft breitet sich ein solches Signal mit ca. 1200 km/h aus, das ist 1 Mach auf Meereshöhe. Tonwellen variieren in ihrer Lautstärke (gemessen in Dezibel oder dB) oder in ihrer Frequenz (Vibrationen pro Sekunde, gemessen in Hertz oder Hz, 1000 Hz = 1 kHz). Viele zusammengefaßte Tonwellen ergeben zusammen jegliche Form von akustischem Signal, angefangen von Musik über Sprache bis hin zu einem einfachem Geräusch.
Die Behandlung akustischer Signale ist innerhalb des Multimediabereichs wahrscheinlich die schwierigste Aufgabe. Dies liegt zum einen an der Bedeutsamkeit der gesprochenen Sprache und zum anderen an der großen Empfindlichkeit des menschlichen Ohrs bezüglich zeitlichem als auch energetischem Auflösungsvermögen. Geräusche sind ihrem Wesen nach Energie. Jeder Lautstärke kann eine bestimmte Energie zugeordnet werden. Da das Ohr, anders als das Auge, durch keine mechanische Vorrichtung im Gefahrenfall blitzschnell verschlossen werden kann, drohen bei zu starken Geräusch- bzw. Energiepegeln irreversible Schädigungen des feinen Apparates hinter dem Trommelfell.
Die Lautstärke einer Geräuschquelle wird in der Regel in Dezibel angegeben. Dies ist das Verhältnis zwischen einer Referenzlautstärke auf einer logarithmischen Skala und der tatsächlich gemessenen Lautstärke. Erhöht man die Ausgabeleistung eines akustischen Senders um den Faktor 4, so ergibt sich daraus ein Steigerung der Lautstärke um 6 dB. Erhöht man die Ausgabeleistung jedoch um den Faktor 100, so resultiert daraus nur eine um 20 dB erhöhte Lautstärke. Der Sinn dieser Skala läßt sich mit der Fähigkeit des menschlichen Ohrs erklären, akustische Signale über eine extreme dynamische Bandbreite hinweg wahrnehmen zu können. In einem Audiostudio hat die Stille ein Lautstärkeäquivalent von 20 dB, was einer Leistung von 10-10 Watt entspricht. Das Geräusch eines Schmiedehammers entspricht an seiner Quelle einer Lautstärke von 120 dB und einer Leistung von 1 Watt. Eine startende Rakete liegt am oberen Ende der Skala mit etwa 195 dB und 4 · 107 Watt, wobei solche Lautstärken das Ohr nachhaltig schädigen würden.
Audiowellen können in eine digitale Form gewandelt werden, dies nennt man Analog-Digital-Wandlung (ADC). Bei ADC wird ein elektrisches Signal als Eingabe verwendet und eine digitale Zahl als Ausgabe (dem Sample) generiert. Um das Signal digital zu repräsentieren, wird es in konstanten Sekundenbruchteilen aufgenommen. Ist ein Ton keine reine Sinuswelle, dann sagt das Nyquist-Theorem, daß die Aufnahmefrequenz 2f sein muß um die höchste Frequenzkomponente f aus dem Ausgangssignal zu digitalisieren. Dies bedeutet, daß bei einer Digitalisierungsrate von 8000 pro Sekunde die maximale aufgenommene Frequenz 4 kHz nicht überschreiten kann. Das (junge) menschliche Ohr kann jedoch Töne bis zu einer Frequenz von 20 kHz wahrnehmen.
Zwei sehr bekannte Audiosignal sind Telefon und Audio-CD. Die sogenannte Pulse Code Modulation (PCM) wie sie im Telefonsystem benutzt wird, verwendet 7-Bit (Nord-Amerika und Japan) oder 8-Bit (Europa) Samples bei einer Rate von 8000 Digitalisierungen pro Sekunde. Bei Audio-CD s wurde der Ton 44.100 mal pro Sekunde digitalisiert bei 16 Bit pro Sample.
Abbildung 7.1: Auswahl verschiedener Klangqualitäten beim Speichern einer Audiodatei
Die im WWW eingesetzten Audioformate sind:
Besonders kritisch wird die Ausgabe von Audiosignalen auf WWW-Browsern dann, wenn die Gesamtleistung des Rechnersystems/Netzwerks zu schwach ist, um einen kontinuierlichen und schwankungsfreien Fluß der Audiodaten zu gewährleisten. Im Gegensatz zu bildhaften Informationen wird eine schwankende, unklare oder abbrechende Audioinformation vom Benutzer als sehr störend empfunden.
Video
Es gibt eine steigende Zahl von Anwendern, die das Medium Video intensiv nutzen. Firmen wie Sun Microsystems, Silicon Graphics Inc., Apple, Microsoft und viele andere haben in den letzten Jahren aufwendige Entwicklungsarbeiten geleistet, um Video auf Computern verfügbar zu machen. Ein wesentliches Hindernis für die einfache Handhabbarkeit digitaler Videos besteht in der riesigen resultierenden Datenflut. Der Schlüssel zum digitalen Video liegt daher in der Kompression. Die wichtigsten Speicherformate im WWW sind hierbei:
Stichworte:
Im Bezug auf Formatierung hat das ursprüngliche HTML nicht viel zu bieten. Neue Tags für Tabellen, Frames usw. mußten her um erweiterte Möglichkeiten für das Design von Webseiten zu bieten. Dabei wurde der eigentliche Charakter der Sprache verändert. HTML war anfänglich eine reine Hypertextauszeichnungssprache. Unter Auszeichnung versteht man dabei die explizite Kennzeichnung der Dokumentstruktur. So zeichnen etwa die Tags <BODY> ... </BODY> im Quelltext eines HTML-Dokuments dessen Kopf aus, eine <H1> ... </H1> ist eine Überschrift der Stufe 1. Diese Struktur des Dokuments sollte nichts mit dessen Gestaltung zu tun haben. Dies sollte völlig dem Browser überlassen bleiben.
Durch neue Tags kamen jedoch immer mehr Layout-Gesichtspunkte ins Spiel. Mit Tags wie <GIF>, <I>, <FONT> oder bekam der Designer immer mehr Einfluß auf auf die Darstellung. Doch auch diese Möglichkeiten reichte den Kreativen oft nicht aus. Mit Tricks wie versteckten transparenten GIFs, verschachtelten Tabellen oder in Graphiken verpackte Texten wurden immer neue Layouteffekte erreicht.
Um nun Inhalt und Struktur, die durch das obengenannte Vorgehen oftmals wild vermischt wurden, wieder sauber zu trennen, wurde vom W3-Konsortium das Konzept der Cascading Style Sheets (CSS) entwickelt. Hiermit kann ein WWW-Designer Stilvorlagen für Web-Seiten definieren. Dies wird durch die Manipulation der Layout-Eigenschaften einzelner Strukturelemente (z.B. <H1>) erreicht. Die Eigenschaften umfassen dabei Schriften, Farben, Textausrichtungen etc. Diese Style Sheets oder Stilvorlagen bekommen einen eindeutigen Namen, über den Dokumente auf sie zugreifen.
HTML-Dokumente und Style Sheets lassen sich auf verschiedene Weise verknüpfen. Die sicherlich einfachste Möglichkeit ist es, das neue STYLE-Tag im Kopf des Quelltexts zu benutzen. Oft empfiehlt es sich jedoch, ein Style Sheet in eine eigenen Datei zu verlagern und dann mittels LINK-Tag darauf zu verweisen. Auf diese Weise lassen sich Style Sheets für mehrerer Dokumente verwenden. Darüber hinaus kann ein Style Sheet mit @import weitere Stilvorlagen importieren (kaskadieren) - die Grundlage für Modularität.
Die Umstellung einer kompletten Web Site ist sicherlich mit viel Aufwand verbunden. Doch dieser kann sich schnell lohnen. Stilvorlagen machen die Site besser wartbar und erlauben es auch, die Arbeit an einer Site sinnvoll aufzuteilen. Denn Auszeichnung ist Struktur und somit das Arbeitsgebiet von Textautoren, Layout ist Präsentation und damit das Arbeitsgebiet von Graphikern.
Noch eine großen Schritt weiter als Cascading Style Sheets geht XML, die Extensible Markup Language. XML gilt als ein Nachfolger von HTML und ist wesentlich stärker an SGML (Standard Generalized Markup Language) orientiert. Hierfür bedient sich XML einer formalen Grammatik und ist daher schwieriger zu erlernen als HTML. Jedoch ergeben sich einige Vorteile bezüglich der Flexibilität:
XML erlaubt es Entwicklern auf verschiedene Weise einem Dokument Struktur zuzuweisen. So kann der Entwickler einen Text einfach mit eigenen Tags ähnlich wie in HTML auszeichnen oder auf eine Dokumentenstruktur (ähnlich einem formalen Dokumenten Style Sheet) verweisen.
Stichworte:
Eine neue Entwicklung für das WWW in Richtung flexiblerer Systemkomponenten stellt die Java-Initiative der Firma Sun Microsystems dar. Originalerweise für die Realisierung verteilter Anwendungen konzipiert, erlaubt Java das Laden und Ausführen von plattformunabhängigen Applikationen oder Applikationskomponenten (Java Applets) auf der Clientseite, d.h. beim Browser. Der Browser erhält damit von einem Java-Server eine höhere und bedarfsabhängige Funktionalität, die für die verschiedensten Zwecke eingesetzt werden kann.
Die Einbindung von Java Applets in WWW-Seiten geschieht über die Spracherweiterung von HTML durch das Elemente <applet>. Die objektorientierte, an C++ angelehnte Java-Sprache bleibt konzeptionell jedoch völlig getrennt von HTML. Beide werden beim Laden einer WWW-Seite auf der Browserseite interpretiert und führen zu entsprechenden Ausgaben. Java Applets werden im Gegensatz zu HTML-Seiten beim Erstellen durch den Entwickler in einen systemunabhängigen Bytecode kompiliert. Dieser kann mit Hilfe des entsprechenden Browsers bzw. der Java Virtual Machine auf der Zielplattform ausgeführt werden.
Abbildung 7.2: Die JAVA-Architektur
Das von der Firma Netscape entwickelte JavaScript kennt dagegen nur nur feste Objekte, die der Benutzer nicht ändern kann. Die Einbindung von JavaScript geschieht über die Spracherweiterung von HTML durch das Element <script>. Die Objekthierarchie leitet sich aus dem Top-Level-Objekt Window ab, das einen Bereich für die Darstellung von Text umfaßt. Die darunterliegenden Objekte sind Location (URL der aktuellen Seite), History (Zugriff auf URLs der bisher besuchten Seiten) sowie Document. Dem Document-Objekt stehen Methoden zur Darstellung von Forms (Eingabeformulare, Dialogelemente), Links und Anchors (Referenz auf andere Elemente), Plug-Ins (Schnittstelle zur Darstellung von Fremdformaten) sowie für den Behandlung von Applets zur Verfügung.
Abbildung 7.3: Das Java-Schalenmodell
Kaum hatte man sich an das Konzept von Java gewöhnt, wurden die Java Beans eingeführt. Diese sind dabei im Grunde nichts anderes als Komponenten aus denen Java Applets oder kleinere Anwendungen zusammengesetzt werden können. Die offenen, plattformunabhängige Architektur der Java Beans definiert dabei die Schnittstellen zwischen den Komponenten.
Java Beans wurde als ein lokales Komponentenmodell entworfen. Das heißt, daß die Kommunikation zwischen Komponenten auf einer Maschine stattfindet. Diese Einschränkung erfolgte aus gutem Grund: die Entwicklung von im Netzwerk verteilten Komponenten erfordert ein ganz anderes Design als lokale Komponenten. Dennoch sieht inzwischen auch das Java-Beans-Modell die Nutzung entfernter Ressourcen vor. Die Anbindung erfolgt über eine Reihe von APIs (Application Programming Interface), so z.B.:
Stichworte:
Die Virtual Reality Modeling Language (VRML) bringt 3D und künstliche Realität ins Web. Sie wurde auf der WWW-Konferenz 1994 in Genf mit diesem Ziel ins Leben gerufen. Im Mai 1995 wurde die Spezifikation von VRML 1.0 als ASCII-Beschreibungssprache für 3D-Welten fertiggestellt. Damit lassen sich bereits komplexe virtuelle 3D-Szenarien modellieren. Diesen fehlen jedoch noch eine Reihe von Merkmalen, wie z.B. die Bewegung der Objekte. Bewegungen sind jedoch sehr wichtig wenn man die Interaktion des Benutzers nicht beschränken möchte. Die frei Wahl des Standpunkts, Durchfahren/-fliegen der Szene oder das Anklicken von Ankern die über Links zu Folgeszenen führen sind dabei die angestrebten Szenarien.
Diese Möglichkeiten werden nun durch VRML 2.0 geboten. Diese Version besitzt zudem neue Knotentypen, die zeitsynchrones Audio/Video, Filmtexturen sowie Animation integrieren. Weiterhin gibt es spezielle Knotentypen für Geometriedaten und Aussehen (Materialeigenschaften) von Objekten. Dazu kommen Nebeleffekte, Geländeformen und Hintergründe wie sie auch in Virtual-Reality-Systemen eingesetzt werden.
In ihrer Standardausstattung können WWW-Browser kein VRML interpretieren und darstellen. Daher müssen zuerst sogenannte Plug-ins installiert werden, die dem Browser die benötigten Zusatzfunktionalität verleihen.