Ungewöhnliches DesignWebsite fürs Auge
Gratwanderung
Ungewöhnliches Design
Oben das Logo, links ein Menü, rechts News und in der Mitte der Content
diese Beschreibung passt auf mehr als 90 Prozent aller Websites. Und das
ist auch gut so. Denn auf diese Weise erhalten Besucher zumindest ein
gewisses Maß an Wiedererkennungseffekt, unabhängig davon, auf welcher
Seite sie landen. Der Nachteil ist, dass es zumindest fürs Auge mit der
Zeit recht dröge wird. Der Sprung zu einem etwas anderen Design ist
jedoch eine echte Gratwanderung, und schnell landet eine nicht-konforme
Seite jenseits des guten Geschmacks und aller Ästhetik.
Doch
gerade Websites, die von oder für kreative Menschen gedacht sind,
vertragen den kleinen Kick »Anders sein als die Anderen«.
Kreativ im Untergrund
Ungewöhnliches Design
Eine einfache Form, ein wenig aus der Masse hervorzustechen, zeigt im
Ansatz der Künstler Ra (www.raspage.com). Er verwendet die Design-Skizze
für den Seitenaufbau.
Ein wenig mit Retuscheprogrammen
überarbeitet und eingefärbt, wirken die hingekritzelten Menüpunkte
passend zur Stimmung seiner Bilder. Mit Hilfe von Image-Slicern,
beispielsweise dem Freeware-Tool Geohtml (www.fegi.ru/geohtml), kann die
Skizzengrafik leicht in mehrere Teile zerschnitten und über eine
HTML-Tabelle als Links zusammengesetzt werden. Alternativ bietet sich
eine einzelne Grafik und der Einsatz einer Imagemap an.
Cartoonisten, die früher auf Printmedien beschränkt waren, erhalten mit
dem Internet eine ganz neue Bandbreite der Darstellung. Dazu gehören
einerseits einfache Comics im Feuilleton-Stil, die Bild für Bild die
Geschichte erzählen. Daneben sind Animationen, die bis dahin
TV-Produktionen vorbehalten waren, ein zunehmend populärer werdendes
Betätigungsfeld.
Möglich macht es ein Werkzeug, das sich in den
vergangenen Jahren im Internet immer mehr durchgesetzt hat: Macromedia
Flash. Nach Angaben von Webhits.de, die täglich circa eine Million
Seitenaufrufe registrieren, besitzen 98,5 Prozent aller verwendeten
Webbrowser das entsprechende Plug-in.
Klassiker
Ungewöhnliches Design
Der mit seinem »Frosch im Mixer« und »Gerbil in the Microwave« wohl
bekannteste Animations-Cartoonist im Web ist Joe Cartoon
(www.joecartoon.com). Seine Website, die komplett in Flash entworfen
ist, nutzt sämtliche Funktionen von statischen Grafiken über die
Animation bis hin zu Sound. Besonders gelungen sind seine Cartoons, die
in kleinen Episoden in Fernsehern, eine Mikrowelle oder einen Mixer
eingebaut sind. Immer jedenfalls mit Knöpfen versehen, damit der
Besucher interaktiv ins Geschehen eingreifen kann.
Noch einen
Schritt weiter geht Renegade Cartoons (www.renegadecartoons.com). Hier
ist die Startseite wie eine Kino-Lounge gestaltet. Dabei haben alle
Gegenstände des Foyers die Funktion, in einen anderen Bereich der
Webseite zu führen: Das Telefon zur Kontaktaufnahme, der Mülleimer führt
zu den eben dort gelandeten und verworfenen Skizzen, und die Kasse
bringt den Besucher zu guter Letzt zum E-Commerce-Bereich.
Kunst für die Kunst
Ungewöhnliches Design
Ob man seinen Stil mag oder nicht dass Picasso ein großer Künstler war,
ist unbestritten. Natürlich darf dann auch die zugehörige offizielle
Picasso-Site www.picasso.fr nicht von der Stange sein. Ist sie auch
nicht. Statt dessen ist sie klar gestaltet und doch verspielt genug, um
aus dem Rahmen zu fallen. So ist selbst die Sitemap direkt als
interaktive Skizze abgelegt. Beim Stammbaum werden beim Klick auf die
einzelnen Personen deren Konterfeis natürlich aus der Sicht Picassos
gezeigt.
Aufgebaut ist die Picasso-Site mit Flash. Allerdings
wäre dies hier nicht unbedingt nötig. Die Skizzen nehmen als
komprimierte und farbreduzierte GIFs kaum Platz weg, und die Animation
hält sich in überschaubaren Grenzen und kann leicht auch per Javascript
umgesetzt werden.
In der Tiefe des Monitors
Ungewöhnliches Design
Mit einer ganz besonderen Form der digitalen Visitenkarte präsentiert
sich der Artdirector Jens Löfberg. Er blendet unter
www.yamsplayground.com den Browser komplett aus und zeigt so
bildschirmfüllend sich und sein Schaffen aus der Vogelperspektive.
Unterteilt in fünf Bereiche zeigt der in Frankreich lebende Schwede
seinen Lebenslauf ebenso wie seine absolvierten Projekte, seine Kunden
und seine eingesetzten Werkzeuge. Alles Themen, die auch von anderen
Websites bekannt sind. Allerdings dient hier die Präsentation als
Aushängeschild. So stecken sämtliche von ihm eingesetzten Tools von
Photoshop bis Director wie echte Pakete in einem virtuellen Setzkasten.
Beim Mauskontakt gleiten diese dann sanft nach oben und geben den Blick
auf die Originalverpackung sowie ein persönliches Statement zur Software
frei.
Noch verspielter wird es, wenn seine Klienten sich
aufmachen und gegeneinander »Schere, Stein, Papier« spielen. Auch sein
Portfolio und seine Experimente zeigen deutlich Ideenreichtum,
Professionalität und Kreativität.
Auch hier kommt Macromedia
Flash zum Einsatz. Eine andere Variante ist bei einer derart aufwendigen
Seite nicht denkbar insbesondere in Hinblick auf die interaktiven
Bereiche bis hin zum Online-Spiel.
IT unkonventionell
Ungewöhnliches Design
Alles nichts für meinen Bereich, mag der IT-orientierte
Website-Betreiber sagen. Im Bereich Software- und Internet-Entwicklung
wird gern ein konventionelles Design gewählt. Der Vorteil ist, dass mit
hierarchischen Menüstrukturen große Mengen an Informationen und viele
einzelne Webseiten dargestellt und verwaltet werden können, ohne die
Übersicht verlieren.
Dass es auch anders geht, zeigt
beispielsweise Roock Software (www.roocksoftware.de). Ähnlich wie bei
Jens Löfberg dient der Internet-Auftritt auch hier primär als besondere
Art der Visitenkarte. Die eigentliche Website stellt ein Laboratorium
mit verschiedenen Apparaten, Einrichtungsgegenständen und Geräten dar.
Beim Überfahren mit der Maus werden aktive Elemente animiert und mit
Sound hinterlegt. Zusätzlich erscheint eine Comic-Sprechblase mit der
Beschreibung der Funktion. So macht bereits die Suche nach den
verschiedenen, zum Teil versteckten Features und Bereichen der Site Spaß.
Auch diese Website arbeitet mit einer hierarchischen Menüstruktur, die nur
nicht so offensichtlich ist wie beim konventionellen Design. Stattdessen
erscheinen beim Klick auf Hauptmenüpunkte wie Software-Entwicklung,
Webpräsenzen oder Printmedien im unteren Bereich jeweils weiterführende
Verweise und Informationen. Auf diese Weise werden mehr als 60
Informationsseiten übersichtlich dargestellt. Technisch gesehen basiert
auch dieser Internet-Auftritt auf Macromedia Flash. Prinzipiell ist
jedoch dieser Auftritt ebenfalls mit Hilfe animierter GIFs machbar. Der
Vorteil der Flash-Lösung ist, dass sich das Layout ohne Qualitätsverlust
an die Größe des Browserfensters anpasst. Zudem fällt die Ladezeit der
knapp 350 KByte großen Flash-Datei kurzweiliger aus als bei entsprechend
großen GIFs, weil SWF-Dateien nach dem Streaming-Prinzip arbeiten und
Inhalte bereits beim Laden und nicht erst nach der vollständigen
Übertragung angezeigt werden können.
Thema Suchmaschinen
Ungewöhnliches Design
Es wird die schönste Website ein einsames Dasein fristen, wenn sie in
keiner Suchmaschine gefunden wird. Und die Problematik bei grafik- und
animations-orientierten Sites ist, dass sie in der Regel wenig Text
enthalten, der von Suchmaschinen-Spidern indiziert werden kann.
An dieser Stelle Doorway-Pages anzumelden, die von derselben Domain
kommend mit einer Keyword-Schwemme aufwarten und auf die Animationsseite
weiterleiten, ringt modernen Suchmaschinen-Robotern nur ein müdes
Grinsen ab.
Wenn aber eine Seite selbst keine Text-Inhalte
vorweisen kann, kann sie über ihre Wichtigkeit trotzdem Einzug bei
Google & Co. halten. Bei Google heißt die Messgröße Pagerank. Dies
bezeichnet die Anzahl und Wichtigkeit jener Referenzseiten, von denen
ein Link ausgeht. Je höher der Pagerank der Verweisseite, desto mehr
nimmt das Ansehen der Grafikseite zu.
Wer eine unkonventionelle
Seite mit wenig Text, dafür aber mit viel Grafik und Animation plant,
sollte parallel dazu textlastige Seiten auf einer anderen Domain
konzipieren, bei denen in der Form
auf das Grafikprojekt verlinkt wird.
Suchmaschinen-Roboter nehmen in diesem Fall an, dass die referenzierte
Seite etwas mit Software und mit Kindern zu tun hat. Wer es dann noch
schafft, von Yahoo & Co. begeistert genannt zu werden, wird auch von
Google gefunden wenn auch nicht so gut wie textorientierte Seiten.
Nicht für jedermann geeignet
Ungewöhnliches Design
Die Verwendung animierter Grafik beziehungsweise der Einsatz von
Flash-Oberflächen ist sicher nicht für jeden Web-Auftritt geeignet.
Allen vorstellten Webseiten ist gemeinsam, dass ihr Ziel die
Präsentation des Schaffens ist. Hier geht es nicht um tagesaktuelle News
oder Produkte, es dreht sich noch nicht einmal um beschreibende
Informationen.
Es geht lediglich darum, dem Besucher einen
Einblick in das Schaffen (Picasso), die Fähigkeiten (Artdirector J.
Löfberg) und das Portfolio (Roock Software) zu gewähren. Dadurch ergibt
sich für den Kreativen die Möglichkeit, künftigen Auftraggebern seine
Fähigkeiten nicht nur mit Worten wie in einer schriftlichen Bewerbung zu
beschreiben.
Fehl am Platz ist eine solche Seite immer dann, wenn
die Inhalte dynamisch erzeugt werden. Der Aufwand, das Ganze weiterhin
grafisch verspielt zu präsentieren, ist unverhältnismäßig höher als bei
Template-gesteuerten HTML-Seiten.
Oberflächen mit Flash
Ungewöhnliches Design
Der grundlegende Vorteil einer mit Macromedia Flash gesteuerten Website
liegt klar auf der Hand: Gestalterische Möglichkeiten werden nur von der
Fantasie des Webmasters eingeschränkt.
Im Gegensatz zu
konventionellem HTML ist die Verwendung von Grafik, Video und Sound ohne
Programmierkenntnisse möglich. Da es sich bei Grafik und Animation um
Vektordaten handelt, sind die resultierenden SWF-Dateien verhältnismäßig
klein. Darüber hinaus passt sich die Vektorgrafik der Fenstergröße
dynamisch an, weshalb nur eine Version für sämtliche
Bildschirmauflösungen benötigt wird. Da eine Flash-Animation zudem beim
Erzeugen kompiliert wird, ist es für Dritte nicht so leicht, die
grafische Arbeit zu stehlen, wie dies beispielsweise bei animierten GIFs
der Fall ist. Da das Plug-in mittlerweile bei den großen Browsern zur
Standardinstallation gehört, liegt die Durchdringung bei über 97
Prozent, was bedeutet, dass nahezu jeder Besucher die Animation auch
solche sieht. Der Nachteil ist jedoch, dass Suchmaschinen-Roboter die
Inhalte nicht erfassen können und deshalb Flash-animierte-Seiten nur
über Umwege Aufnahme in die Suchmaschinen-Datenbanken finden. Noch ist
der Preis des Entwicklungswerkzeugs Flash mit knapp 980 Euro recht hoch.
Wer auf die Skript-Unterstützung verzichten mag, kann auf preiswertere
Tools ausweichen, zum Beispiel auf Corel Rave.
Vorteile:
– komplexe Interaktivität bis hin zur Anwendung
– winzige Dateigrößen
–
Urheberrechtsschutz durch codierte SWF-Dateien
Nachteile:
– teure Software erforderlich
– komplizierter im Handling
Oberflächen mit GIF und Javascript
Ungewöhnliches Design
Um mit reinem HTML eine nicht statische, grafische Oberfläche zu
erstellen, wird Javascript eingesetzt. Auch animierte GIFs taugen in
vielen Fällen als einfacher Ersatz für aufwendige Flash-Spielereien.
Mit Hilfe der kostenlosen Javascript Utility Suite (www.dark-street.com)
benötigt der Designer nicht einmal programmiertechnisches Know-how,
sondern lässt Rollover-Effekte automatisch erzeugen. Größere Grafiken
können dabei etwa mit dem Freeware-Tool Geohtml (www.fegi.ru/geohtml) in
eine HTML-Tabellenform zerschnitten werden, um die einzelnen Segmente zu
animieren. Auch für animierte GIFs braucht es kein teures
Grafikprogramm. Mit Animake (www.rms.to/kostenlos.htm) sind die
digitalen Daumenkinos schnell erstellt.
Der Nachteil sind die
fast im Quadrat zunehmenden Dateigrößen der GIF-Dateien.
Vorteile:
– kostenlose Animationssoftware
– Steuerung per
Javascript
Nachteile:
– keine komplexen Anwendungen
– Dateigröße nimmt schnell zu