
|
1. Gebot: Ich muß leider draußen bleiben |
Ihr
Besucher benutzt nicht Ihren Lieblings-Browser? Womöglich hat er auch kein
Shockwave-Plug-in installiert oder Java deaktiviert? Pech für Sie, wenn er
dann nichts zu sehen bekommt und die Website enttäuscht verlässt. Lassen
Sie Ihrem Besucher die Wahl - bieten Sie ihm Alternativen. Testen Sie die
Seiten mit verschiedenen Browsern. Und überlegen Sie sich vorher, ob Sie
die aufwendige Animation überhaupt brauchen.
Java-Menüs und Buttons Sie sind einfach zu pflegen und bieten nette
Effekte - aber wenn Ihr Besucher Java ausgeschaltet hat, wird er nichts
sehen außer einer grauen Fläche und hat keine Möglichkeit, auf Ihrer
Website zu navigieren. Und selbst wenn er Java aktiviert hat, kann es
passieren, dass das Menü nicht sofort lädt. Animationseffekte sind auf den
ersten Blick nett, nutzen sich aber schnell ab. Ihr Besucher legt weniger
Wert darauf, als Sie vielleicht denken.
Buttons mit Hilfe von Java-Applets zu animieren, bedeutet, mit Kanonen auf
Spatzen zu schießen. Verwenden Sie hier besser Javascript, das hat den
Vorteil, dass die Buttons auch noch funktionieren, wenn der Nutzer Java
oder Javascript ausgeschaltet hat - vorausgesetzt, Ihr Skript ist sauber
programmiert! Im anderen Fall können Sie sicher sein, dass Ihr Besucher
wenigstens in einem mit Ihnen einig ist: im Fluchen über die
Fehlermeldungen beim Laden der Seite.
|
2. Gebot: Dum-didel-du |
Vor drei Jahren war es
noch hip, seine Seiten durch Midi-Musik zu untermalen. Heute ist das
nicht nur mega-out und nervt den Besucher, sondern kann auch teuer
werden, wenn Sie nicht daran gedacht haben, die fälligen Gema-Gebühren
abzuführen. Midi-Sound hört sich außerdem auf den meisten
Standard-Soundkarten sehr dürftig an, und Sie können nicht
kontrollieren, in welcher Qualität die Musik beim Besucher abgespielt
wird.
Auch bei Flash-Animationen wird gern auf Sound-Loops zurückgegriffen,
die allerdings meist den Charme einer hängenden Schallplatte
entwickeln und eher lästig als unterhaltsam sind.
Wenn Sie auf Sound nicht verzichten wollen, lassen Sie ihn nicht
automatisch beim Laden der Seite starten, sondern überlassen Sie es
dem Besucher, ob er die Sounddatei abspielen will oder nicht.
| 3. Gebot: Augenpülverchen - Schriften falsch eingesetzt |
Der Platz auf dem Bildschirm ist begrenzt.
Was liegt also näher, als möglichst kleine Schriften einzusetzen? Da
werden Fließtexte in einer 8-pt-Verdana verfasst - wenn Sie das auch tun
wollen, liefern Sie die Lupe am besten gleich mit! Texte in dieser Größe
sind nicht mehr lesbar und sollten Untertiteln vorbehalten bleiben. Das
Minimum ist eine 10-pt-Arial oder Verdana - Serifenschriften wie die Times
Roman sollten Sie erst ab 12 pt verwenden. Übrigens: die Verdana wurde
extra für den Bildschirm entworfen. Verwenden Sie nach Möglichkeit
serifenlose Schriften.
Denken Sie außerdem daran, dass nicht jeder Besucher den kompletten
Windows-Fontpack installiert hat. Formatieren Sie grundsätzlich nicht mit
nur einer Schriftart, sondern sehen Sie Alternativen vor. (<font face="Verdana,
Arial, Helvetica, MS Sans Serif"»)
|
4. Gebot: Gif es fort und bleib mir jpeg:
Falsch verwendete Grafikformate und Bildgrößen |
Die gebräuchlichsten
Grafikformate im Web sind GIF und JPEG. GIF wird vornehmlich für
Grafiken mit klaren Konturen (zum Beispiel Piktogramme, Karten, Texte
als Grafik) oder animierte Grafiken eingesetzt. Weil GIF nur 256
Farben darstellen kann, ist es nicht unbedingt für Fotos geeignet. Es
sei denn, Sie mögen Moirés und kopfschüttelnde Besucher. Wenn aber
nicht, dann nehmen Sie für Fotos JPEG. Das Format ist trickreich: Es
setzt darauf, dass das menschliche Auge Unschärfen im Detail nicht
wahrnimmt, und zeigt Umrisse um so verschwommener, je höher der
Kompressionsfaktor ist. Bei Fotos fällt das nicht weiter ins Gewicht
und führt zu einer Reduzierung der Dateigröße. Bei Grafiken mit klaren
Konturen und wenigen Farben führt die Verwendung von JPEG zu einem
"Ausbluten" der Konturen, außerdem wird die Datei größer.
Beachten Sie bei der Verwendung von Fotos auch, dass der Bildschirm
nur 72 dpi darstellen kann. Es bringt also nichts, ein Foto mit 300
oder gar 600 dpi zu scannen, damit die Qualität besser wird. Solche
hohen Auflösungen sind nur sinnvoll, wenn die Grafik gedruckt werden
soll. Wenn Sie ein mit 300 dpi gescanntes Foto in Originalgröße auf
eine Website stellen, erhalten Sie ein riesengroßes Bild mit hohen
Ladezeiten. Resize me, please! Denken Sie auch an die
Bildschirmauflösung Ihres Besuchers - immer noch ca. 33 Prozent sind
mit 800 x 600 Pixeln unterwegs. Ein Foto sollte daher nicht breiter
sein als 400 Pixel. Die meisten marktüblichen
Bildbearbeitungsprogramme bieten eine "Resize"-Option an, mit der Sie
Bilder verkleinern können.
Wenn Sie eine Bildergalerie online stellen, bieten Sie den Besuchern
kleine Vorschaugrafiken. Dazu verkleinern Sie das Originalbild mit
Ihrer Bildbearbeitung und speichern diese kleine Version als so
genannten "Thumbnail" ab. Setzen Sie dann unter die Vorschaugrafik
einen Link, der auf die Originalgrafik verweist.
Achtung: es reicht nicht, die Originalgrafik mit den Parametern HEIGHT
und WIDTH im Browser klein zu zoomen! Diese Größenangaben dienen nur
dazu, das Laden einer Seite zu beschleunigen, weil der Browser weiß,
wie viel Platz er für die zu ladende Grafik reservieren muss.
| 5. Gebot: Verweile doch, es wird so schön - der wartende Besucher |
Wissen Sie, wie viel
Zeit ein Besucher Ihrer Seite gibt, bevor er weiterklickt? Acht
Sekunden - so sagen jedenfalls die "durchschnittlichen Befragten" in
diversen Untersuchungen.
Wie lange braucht Ihre Startseite zum Laden? Zwingen Sie Ihren
Besucher durch einen Flash-Tunnel oder erschlagen Sie ihn bereits auf
der ersten Seite mit riesengroßen Bildern? Dann müssen Sie schon eine
Menge zu bieten haben, dass er Ihnen nicht abhanden kommt, bevor ihre
ganze Seite überhaupt auf seinem Bildschirm ist.
Aufwendige Intro-Seiten sind mittlerweile out. Man kommt heute gleich
zur Sache und bietet bereits auf der ersten Seite Informationen. Das
können News sein oder auch Highlights aus Ihrem Programm.
Lange Texte werden am Bildschirm nicht gern gelesen - kürzen Sie,
soweit es geht, und bieten Sie längere Texte zum Download an. Damit
der Leser weiß, was er lädt, können Sie Auszüge aus dem Text als "Teaser"
auf die Seite stellen. Wenn Sie längere Texte anbieten, bieten Sie
zusätzlich eine Druckversion.
Und, Achtung: Texte innerhalb von Tabellen brauchen länger zum Laden
als Texte außerhalb von Tabellen! Wenn Sie schon eine große Grafik auf
die erste Seite setzen müssen, arbeiten Sie mit dem Feature LOWSRC,
das Ihnen die Möglichkeit gibt, eine größenreduzierte (am besten in
Schwarzweiß gehaltene) Vorschaugrafik zu laden - leider wird das aber
nur von Netscape unterstützt. Eine andere Möglichkeit ist, größere
Bilder zu "slicen", das heißt, sie in einzelne Quadrate zu
unterteilen. Dafür gibt es eigene Tools.
| 6. Gebot: So schön bunt hier! |
Farben sind ein
wichtiges Stilmittel. Sie helfen, die Corporate Identity eines
Unternehmens auszudrücken, Akzente zu setzen und den Charakter einer
Site zu formen. Konsequent - wenn auch nicht unbedingt augenfreundlich
- umgesetzt haben das Yello und Sixt.
Bei aller Begeisterung - denken Sie bitte daran, dass der Besucher
Ihrer Site in erster Linie an Informationen interessiert ist und die
Texte lesen will! Und seien Sie konsequent in der Anwendung Ihrer
Farben - mischen Sie nicht Pastelltöne und Knallfarben.
Berücksichtigen Sie auch, dass es immer noch Grafikkarten gibt, die
nur 256 Farben darstellen können.
Rote Schrift auf blauem Grund ist beispielsweise extrem
augenunfreundlich. Wenn Sie außerdem ein farbiges Bild als Hintergrund
einsetzen, denken Sie daran, die Hintergrundfarbe der Seite auf die
gleiche Farbe zu setzen und auf keinen Fall auf die gleiche Farbe wie
der Text, sonst sieht Ihr Besucher gar nichts, bis das Hintergrundbild
geladen ist.
Sowohl schwarze als auch weiße Hintergründe sind zwar weit verbreitet,
aber nicht unbedingt die augenfreundlichste Lösung. Der Bildschirm ist
ein selbstleuchtendes Medium, und Farben erscheinen viel intensiver
als auf dem Papier. Der Kontrast schwarz auf weiß ist daher auf Dauer
anstrengend für die Augen. Besser: Pastelltöne, das Bild auflockern
durch Kästen und andersfarbige Navigationsleisten.
Blümchentapete Hintergrundgrafiken sind dann am effektivsten und
besten, wenn sie nicht auffallen. Ihre Homepage ist keine Zimmerwand,
die tapeziert oder gekachelt werden müsste. Bedenken Sie auch, dass
jede Hintergrundgrafik als "Tapete" angezeigt wird - testen Sie
unbedingt auch mit einer 1280-x-1024-Auflösung. Die Hintergrundgrafik
sollte sich hier nicht wiederholen!
| 7. Gebot: Bewegung |
Wenn Sie Bewegung in
Ihre Homepage bringen wollen, tun Sie das mit interessanten Inhalten -
aber verzichten Sie auf zappelnde GIFs! Sparsam dosiert, können
animierte GIFs ansprechend wirken, zum Beispiel eine sich gemächlich
drehende Weltkugel, aber generell sollten Sie lieber darauf
verzichten. Bedienen Sie sich auch besser nicht bei den einschlägigen
Freeware-Archiven. Zum einen langweilen Sie damit Ihren Besucher, der
den tollen aufklappenden Briefkasten schon auf hundert anderen Sites
gesehen hat, zum anderen riskieren Sie sogar eine Abmahnung von Unisys
(Inhaber des LZW-Kompressionsverfahrens, das GIF-Grafiken
zugrundeliegt), wenn Sie nicht nachweisen können, dass Sie Ihre
GIF-Grafiken mit einer Software erstellt haben, deren Hersteller
Lizenzgebühren an Unisys entrichtet hat (was bei Standardsoftware wie
zum Beispiel Photoshop oder Paint Shop Pro der Fall ist).
Auch bei Hintergrundgrafiken sollten Sie selbst kreativ werden. Das
gleiche gilt für die Verwendung von Designvorlagen.
Frontpage-Templates sind schön und gut, aber der Profi erkennt sie auf
den ersten Blick. Vor allem wenn Sie sich als Webdesigner einen Namen
machen wollen, sollten Sie mit eigenen Designs werben und nicht auf
fertige Vorlagen zurückgreifen.
Ja, wo laufen sie denn? Java- oder Javascript-Laufschriften sollten
Sie nur für wirklich wichtige Inhalte einsetzen, zum Beispiel
brandaktuelle News oder Börsenticker. Und lassen Sie dem Besucher
seine Statuszeile - Laufschriften in der Browserstatuszeile sind
mega-out und unbeliebt, weil dieser Platz für andere Informationen
reserviert ist, wie etwa die Anzeige von URLs, wenn die Maus sich über
einen Link bewegt.
Banner-Overkill: Die meisten Besucher lieben Banner nicht sonderlich.
Setzen Sie daher möglichst nicht mehr als ein Banner pro Seite ein,
und überlegen Sie sich, ob das Banner wirklich animiert sein muss.
Wenn das Banner den Besucher nicht verärgert, besteht eine größere
Chance, dass er draufklickt. Reservieren Sie einen Bereich Ihrer Seite
standardmäßig für Banner - und nur diesen.
| 8. Gebot: Framechaos |
Frames oder
Nichtframes - das ist die Frage, die die Netzgemeinde seit Jahren
bewegt, und immer noch reagieren Besucher mit verhaltener
Begeisterung, wenn sie auf Frames stoßen. Sie müssen schon gute Gründe
haben, um Frames einzusetzen. Die meisten großen Informationsanbieter
kommen ohne Frames aus. Da große Sites häufig mit Redaktionssystemen
verwaltet werden, fällt das Argument der einfachen Wartung der
Navigationsleiste dort weg.
Dennoch haben Frames ihre Berechtigung, wenn sie sinnvoll eingesetzt
werden. Informationen, die auf jeder Seite gleich sind, können so zum
Beispiel immer im Blickfeld bleiben, oder auch ein für Banner
reservierter Raum, der nicht weggescrollt werden soll. Darüber hinaus
verringern sich die Ladezeiten, weil nur noch Teile der Seite
nachgeladen werden müssen. Das ist vor allem sinnvoll, wenn Sie
größere Grafiken im Navigationsbereich haben.
Frames können außerdem benutzt werden, um sicherzustellen, dass eine
Seite immer in einer festen Größe dargestellt wird, unabhängig von der
Bildschirmauflösung des Benutzers.
Nehmen Sie dem Besucher nicht seine Scrollbalken weg. Frameborders
sehen hässlich aus und sollten nach Möglichkeit weggelassen werden.
Überlegen Sie sich gut, was in Ihre Frames hineinsoll. Packen Sie
nicht zu viele Informationen in einen Navigationsframe. Gescrollt
werden sollte nur im Hauptframe, nicht in den Navigationsframes!
Wenn Sie Frames einsetzen, achten Sie darauf, dass es im Quelltext der
Seite, die das Frameset enthält, einen "noframes"-Bereich gibt, der
Besuchern mit alten Browsern einen Link auf eine Alternativseite oder
zumindest eine Information bietet. In diesem Noframes-Bereich sollten
Sie auch unbedingt Schlüsselwörter und einen Beschreibungstext
unterbringen, sonst kann es Ihnen passieren, dass Suchmaschinen als
Beschreibungstext für Ihre Seite nur ein "Ihr Browser kann keine Frames darstellen" oder Ähnliches auswerfen.
| 9. Gebot: Wo isser denn? Die Webseite als Irrgarten |
Lassen Sie Ihren
Besucher nicht hilflos umherirren. Eine durchdachte Navigation ist das
A und O jeder erfolgreichen Website. Orientieren Sie sich an den
Bedürfnissen des Kunden, nicht an Ihrer Unternehmensstruktur. Testen
Sie die Navigation mit unbedarften Anwendern - Sie werden sich
wundern, wo Ihre Tester überall hinklicken.
Links müssen als solche erkennbar sein. Wenn Text unterstrichen ist,
wird erwartet, dass sich darunter auch ein Link verbirgt. Verwenden
Sie unterschiedliche Farben für Links und bereits besuchte Links,
damit Ihr Besucher sieht, auf welchen Seiten er bereits war.
Verstecken Sie Links nicht ausschließlich hinter
Illustrationsgrafiken.
Am weitesten verbreitet ist eine Navigation am linken Bildschirmrand -
einfach weil wir gewöhnt sind, von links nach rechts zu lesen. Als
Ergänzung bietet sich eine horizontale Navigationsleiste am oberen
oder unteren Bildschirmrand an. Immer weiter verbreitet sind auch
Aufklappmenüs, die zwar aufwendig in der Programmierung sind, aber für
einen aufgeräumten Bildschirm sorgen, der nicht überladen wirkt.
Ostereier suchen: Eine beliebte Variante des nützlichen
OnMouseOver-Events: Navigationselemente verraten erst, was hinter
ihnen steckt, wenn man mit der Maus darüber fährt. Das ist ein netter
optischer Effekt, macht es dem Besucher aber schwer, sich auf der
Seite zurechtzufinden. Legitim ist das, wenn Sie zusätzlich eine
Alternativnavigation anbieten.
Bei größeren Sites sollten eine Sitemap und eine Suchfunktion nicht
fehlen.
| 10. Gebot: Meta-Tags und Suchmaschinen |
Heißt Ihre Seite auch
"Please title this page" oder "index.htm"? Dann haben Sie Ihre
Meta-Tags nicht ordentlich gepflegt. Wenigstens "Title", "description"
und "keywords" sollten gepflegt sein, damit Ihre Seite nicht nur in
Suchmaschinen entsprechend gelistet wird, sondern auch mit einem
aussagekräftigen Seitentitel im Browserfenster des Besuchers angezeigt
wird.
Wenn Ihnen mal langweilig sein sollte, werfen Sie eine Suchmaschine an
(zum Beispiel altavista.com) und suchen Sie nach der Zeichenkette Mega
"Lorem ipsum dolor sit amet, consectetuer adipiscing elit" - Sie
werden staunen!
Dieses "Pseudo-Latein" wird von Satzprogrammen oder auch Web-Editoren
wie Frontpage dazu verwendet, Dummy-Text zu generieren. Wenn Sie also
nicht wollen, dass Ihre Baustellenseiten gefunden werden, verzichten
Sie auf diese Dummy-Texte.
| 11. Gebot: Ruhe in Frieden |
Sie haben alles
beachtet, Ihre Website ist augenfreundlich, ansprechend, übersichtlich
- aber es tut sich nichts darauf? Die letzte Änderung war vor sechs
Monaten, und Kundenanfragen werden nicht beantwortet? Dann haben Sie
verloren.
Das Internet ist ein interaktives Medium, eine Website ist mehr als
ein digitalisierter Prospekt. Bieten Sie dem Kunden die Möglichkeit,
in Dialog mit Ihnen zu treten! Das Minimum ist eine funktionierende
E-Mail Adresse auf jeder Seite des Angebots. Und "News" sind nur dann
News, wenn sich dort mehrmals im Monat etwas tut.
Weitere interaktive Möglichkeiten sind Umfragen, Newsletter, Foren,
Preisausschreiben, oder auch ein Chat. Geben Sie Ihrem Besucher einen
guten Grund, wiederzukommen!
|
Amen |
Der Text wurde mit freundlicher Genehmigung von Internet Professionell veröffentlicht.