Unterschiede beim Gestalten für Internet und Papier

Worauf Sie beim Gestalten von Printprodukten und Onlinepräsenzen achten müssen

Wenn Sie statt Printprodukten wie Postern, Broschüren oder Zeitschriften eine Website gestalten, müssen Sie einige Faktoren beachten. Der Erfolgsfaktor der Website hängt in großen Teilen davon ab, ob die Nutzung der Website und die technischen Voraussetzungen bei der Gestaltung berücksichtigt wurden.

Nutzerbasierte Darstellung der Website

Bücher, Zeitschriften und andere Printprodukte zeichnen sich dadurch aus, dass Satz und Design ausschließlich den Wünschen des Verlegers bzw. dessen Grafikers und Illustrators unterliegen. Sie verändern ihr Design nie.

Bei Websites hingegen gibt es einige Möglichkeiten, wie das Design ausgegeben wird:

  • Je nach Browserumgebung des Nutzers wird die Website unterschiedlich dargestellt.
  • Der Nutzer kann mit den Dokumenten der Website interagieren.

Beim Gestalten der Website müssen Sie also einen großen Teil des Designs dem Betrachter und dessen technischen Gegebenheiten überlassen. Durch seine Soft- und Hardware bestimmt der Nutzer die Regeln für Aussehen und Strukturierung der Seite. Diese Regeln werden in einer standardisierten Programmiersprache hinterlegt und der Seitenbetreiber kann nur darauf hoffen, dass das Endgerät diese Sprache beherrscht.

responsiv webdesignDie Browserumgebung

Zahlreiche Faktoren sorgen dafür, dass die Website am Ende doch anders dargestellt wird, als angedacht. Zum einen sind die Browser selbst daran beteiligt, wenn sie Regeln fehlerhaft interpretieren. Zum anderen hat nicht jeder Nutzer alle verfügbaren Fonts installiert, oder nutzt die gleiche Bildschirmauflösung. Mobile Geräte und Notebooks arbeiten mit kleineren Bildschirmen und anderen Formaten.

Der Nutzer selbst kann das Design beeinflussen, indem er die Website vergrößert, verkleinert, hineinzoomt oder in den generellen Einstellungen seines Browsers Schriftgröße, Schriftfarbe und Hintergründe festlegt, Überschriften per Script automatisch nummieren lässt, oder sich entscheidet, Grafiken auszublenden.

Der Webdesigner hat darauf weder Einfluss, noch lassen sich diese Faktoren irgendwie umgehen. Viel mehr muss die Seite so klar strukturiert und flexibel angelegt sein, dass sie sich dem Nutzer ideal anpasst.

interaktionMit der Website interagieren

Neben den individuellen Möglichkeiten, die der Nutzer bei der Anzeige der Website hat, können Sie als Designer ihm Optionen bieten, die Inhalte der Seite über vorangelegte Felder aktiv zu nutzen und zu verändern.

Über ein Suchfeld kann der Nutzer beim Laden der Website einen Suchbegriff festlegen, um den herum sich der Inhalt aufbaut. Die Suchergebnisse werden ihm dann statt des eigentlichen Inhaltes ausgegeben. Dem Nutzer kann allerdings auch die Möglichkeit gegeben werden, selbst Änderungen am Dokument vorzunehmen. Möchten Sie eine solche Möglichkeit der Veränderung bieten, sollten Sie sicherstellen, dass die Regeln im Dokument es zulassen, dass die Website trotz variabler Inhalte immer korrekt dargestellt wird.


Print und Web im tabellarischen Überblick

Im folgenden bekommen Sie einen Überblick über die bedeutenden Unterschiede, die Printprodukte und Websites definieren und beim Design zu beachten sind.

Tabelle

#PrintWeb
1 Idee wird auf dem finalen Druck exakt so umgesetzt wie entworfen Idee wird durch Regeln in Struktur und möglicher Darstellung definiert, Browser setzt die Regeln individuell um
2 Fonts können beliebig gewählt und gestaltet werden Vordefinierte geringe Auswahl aus bestehenden Fonts, keine Möglichkeit, Font fest zu definieren
3 Format wird durch den Druck festgelegt Bildschirmauflösung und Größe hängen von Endgeräten ab
4 Festes Design und Layout, auf Millimeter genau Flexible Ausgabe von Layout und Design, Schriftgrößen variabel
5 Optimierte Druckfarben, CMYK Bildschirmfarben und -kalibrierung bestimmen Farbgebung, RGB
6 Kontrast und Schärfe auf Papier deutlich optimiert Bildschirm gibt Schärfe und Kontrast schlechter wieder
7 Bei zu kleinem Druck mechanische Vergrößerung nötig Einfach in der Größe skalierbar, mögliche Sprachausgabe
8 Für mehr Inhalte stets größere Fläche nötig Durch Scrollen mehr möglicher Inhalt, Textsuche wird ermöglicht
9 Verweise als Fußnoten, Quellverzeichnis zu hinterlegen Verweise können auf Hyperlinks verlegt werden
10 Illustration durch Grafik und Foto möglich Illustration durch bewegte Bilder, Videos, Ton, Grafik und Fotos möglich
11 Inhalte unveränderlich, abgeschlossen bis Neudruck Inhalte jederzeit änderbar und dynamisch
12 Keinerlei Interagieren möglich Interagieren, Anpassen, Ausgabe optimieren möglich
13 Digitalisierung nachträglich nur mühsam möglich Ausgabe als Print jederzeit nachträglich möglich, auch in optimiertem Layout

Vektor- und Rastergrafiken

Grafiken werden in zwei Kategorien eingeteilt, die ihre Weiterverarbeitung und Verwendung definieren. Von Rastergrafiken spricht man bei Bildern, die aus gerasterten Punkten, den Pixeln, bestehen. Fotos, die von Digitalkameras ausgegeben werden, sind zum Beispiel solche Rastergrafiken. Die Kamera verfügt über einen Sensor einer bestimmten Auflösung, durch den das Motiv festgehalten und als Datei ausgegeben wird. Sie eignen sich außerdem für Printprodukte, die in der Größe ihrer jeweiligen Abmessung entsprechen.

Grafiken, die von Rechnern erzeugt werden, nennt man Vektorgrafiken. Sie werden nicht in Pixel zerlegt, sondern mathematisch definiert. Dadurch lassen sie sich beliebig skalieren, also in ihrer Größe anpassen, ohne dass sie unscharf werden, oder verpixeln. Durch das Vektorverfahren lassen sich Logos, Piktogramme, Illustrationen und Schautafeln darstellen.

Planungsunterschiede Print und Web

mehraufwand-internetBeim Anlegen einer Website müssen Sie zahlreiche Punkte beachten, die bei Printprodukten nicht anfallen. In wenigen Fragen läuft das Vorgehen gleich ab, doch spätestens ab der Druckvorstufe gehen die Vorgänge auseinander. Im Print steht nach Satz und Reinzeichnung der Vordruck und schließlich Druck des Printproduktes. Ist das Webdesign vorangelegt, beginnt jedoch erst der Hauptteil der Arbeit an der Seite. Das Design an sich enthält noch keinerlei Inhalte und würde Interessenten keine Minute auf der angesteuerten Domain halten. Im ersten Schritt des Füllens der Seite mit Content, müssen Sie sich Gedanken über die Struktur der Unterseiten machen. Die Startseite wird immer mit "Index" bezeichnet.

Inhalte im Netz verursachen einen Mehraufwand

Die Unterseiten anzulegen, macht einen guten Teil der Arbeit an der Website aus. Neben dem festgelegten Namen, der in die URL einfließt, müssen Titel, Schlagwörter, Keywords und eine aussagekräftige Beschreibung rund um den eigentlichen Inhalt angelegt werden. Den Inhalt der Seite definieren wir durch das Hinzufügen von Texten, Bildern, Medieninhalten.

Bilder für das Netz fit zu machen, verursacht deutlich mehr Arbeit, als im Printverfahren. In Letzterem werden die Bilder eingespiegelt und gehen direkt in den Druck. Das Bildmaterial einzulesen, ist im Webdesign nur der erste Schritt. Das Bild muss in ein sinnvolles Format und eine praktische Abmessung gebracht werden, die Datenmenge will auf Ausgabe heruntergerechnet werden. Das Bild benötigt einen für Suchmaschinen optimierten Dateinamen und einen Alternativtext. Der Alternativtext beschreibt, was auf dem Bild zu sehen ist und wird angezeigt, falls das Bild nicht geladen wird. Menschen mit Seheinschränkungen lassen sich den Alternativtext in der Sprachausgabe vorlesen, um die Illustration zu erfassen, er sollte daher das Motiv gut umschreiben. Copyrighthinweise sollten in die Beschreibung und Metadaten des Bildes eingebunden werden.

Im CMS (Content Management System), dem Backend der Website, werden Texte, Bilder und alle mit ihnen verknüpften Daten und Informationen schließlich eingelesen, freigegeben und können jederzeit aktualisiert werden. Die Inhalte sind dann für jeden, der die Unterseite oder Website aufruft, sichtbar. Dieser Vorbereitungsaufwand macht das Veröffentlichen im Netz deutlich aufwendiger, als das Printverfahren. Das Veröffentlichen geschieht dafür in Echtzeit, Änderungen sind sofort sichtbar.

Nutzung nach Bedarf

Print und Web unterscheiden sich auch in der Nutzung grundlegend. Während Kunden Flyer, Produktkataloge und andere Printprodukte mehr oder weniger ungefragt in die Hand gedrückt bekommen und vielleicht irgendwann einmal hineinschauen, sie wieder beiseite legen, oder wie bei Zeitschriften und Büchern bereit sind, neue Inhalte zu entdecken und sich dafür Zeit zu nehmen, nutzen Sie Websites komplett anders. Niemand legt sich eine Website beiseite, um sie in einem Jahr zu lesen. Websites werden angesteuert, um sofort Informationen zu erhalten, oder Inhalte zu konsumieren.

Webnutzer wollen also einen bestimmten Inhalt einsehen und werden ungeduldig, wenn sie ihn nicht auf den ersten Klick sehen können. Sie suchen zielstrebig nach Informationen und klicken für gewöhnlich nur dann auf weiterführende Links, wenn diese bereits im Titel eine gesuchte Information versprechen. Niemand nimmt sich Zeit, um in Ruhe alle Unterseiten durchzublättern.

Als Webdesigner sind Sie also gefragt, die Kerninformation und das Angebot der Seite klar auszuweisen. Wer zu viel "Drumherum" auf der Website unterbringt, riskiert Desinteresse oder schlimmer – versteckt den eigentlichen Inhalt.

Optimierter Gebrauch und verdrängtes Unwichtiges

Ein eindrucksvolles Beispiel für dieses Phänomen ist die sogenannte "Banner Blindness". Darunter versteht man einen so zielgerichteten Blick auf den Wunschinhalt der Website, dass jedwede Werbung, die um den Inhalt herum platziert wurde, schlichtweg nicht gesehen wird. Je bunter, auffälliger und aufdringlicher die Werbebanner (dh. der Begriff) gestaltet sind, desto mehr werden sie ignoriert, beziehungsweise von der Wahrnehmung ausgeschlossen.

Die Nutzung der Suchmaschinen ist ein weiteres Beispiel für das gerichtete Nutzerverhalten. Wer einen Suchbegriff eingibt, liest in der Regel die ersten paar Treffer-Überschriften und entscheidet sich für die am relevantest klingende. Verspricht die Website nach dem Klick nicht innerhalb der ersten Sekunden, die Information nach der gesucht wurde, zu enthalten, navigiert der Nutzer zurück und steuert das nächste Ergebnis an. Lädt eine Seite nicht schnell, oder erfordert sie mehrere Klicks, erhält sie keine Aufrufe.

Gleiches gilt für die Steuerung der Website. Muss der Nutzer sich durch zahlreiche Menüs navigieren, oder findet beim intuitiven Klicken nicht direkt, was er sucht, schließt dieser die Seite und besucht den nächsten Anbieter. Die Usability der Website wird daher idealerweise vor dem Launch getestet.


Kommentare sind deaktiviert