1 |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
![eBook-Project by AboutWebDesign.de [LOGO]](logo.jpg){kind=logo}
|
|||
3.3 Textgestaltung |
|||
|
|||
3.3.1 EinführungHTML steht für "Hypertext Markup Language". "Hypertext" kommt hierbei die entscheidende Bedeutung zu. Text spielt also eine entscheidende Rolle im WWW, ist doch HTML eigentlich auf die Präsentation von Texten ausgelegt. Aber nicht nur innerhalb technischer Grenzen stimmt diese Aussage: Auch für den Benutzer ist Text im WWW weiterhin das entscheidende Medium, auch wenn Flash-Filmchen und Bilderwüsten vielleicht anderes suggerieren möchten.Fakt ist: Nur mit Hilfe von Text lassen sich im WWW derzeit umfangreiche Informationen praktisch darstellen. Daher ist die Fähigkeit der Textgestaltung elementar für jeden guten Designer. Um genau diese Fähigkeit geht es in diesem Abschnitt. Wie werden Texte gut im WWW in Szene gesetzt? Dabei geht es sowohl um technische Aspekte wie Lesbarkeit als auch um inhaltliche Aspekte wie Web-geeigneten Sprachstil. |
|||
|
|||
3.3.2 Technische TextgestaltungTechnische Textgestaltung bedeutet die Fähigkeit, Texte mit technischen Mitteln aufzubereiten. Grundlage ist dabei HTML. Mit HTML werden bestimmte Passagen ausgezeichnet, also z.B. mit demb-Tag als "fett". Der Browser verwendet diese Informationen, um Ihre HTML-Seite zu rendern.Hauptziel der technischen Textgestaltung muss die Ergonomie sein, soll heißen, dass die sinnvolle Präsentation der Texte im Vordergrund steht. Dabei geht es nicht um coole Effekte, die ohnehin wenig relevant sind. Benutzer sind dann zufriedene Benutzer, wenn sie sinnvolle Informationen auf einer Seite finden. Das Finden und Aufnehmen dieser Informationen muss durch den Designer unterstützt werden. Dabei gibt es zwei Hauptbereiche: Lesbarkeit und Übersichtlichkeit. Wir werden jedoch mit einem kleinen Exkurs beginnen und uns zunächst dem weiten Feld der Schriften zuwenden. Die im Folgenden vermittelten Informationen und Fachbegriffe sind Grundlage, um später kommende Inhalte zu verstehen und haben die Aufgabe, einen Überblick über die für Webdesigner vorhandenen Möglichkeiten zu geben. 3.3.2.1 Schriften als technische Grundlage des WWWSchriften sind die technische Grundlage des WWW, denn erst sie ermöglichen es einem Browser, HTML zu visualisieren. Grundkenntnisse sind daher unverzichtbar.Es gibt verschiedene Merkmale, anhand derer sich Schriften unterscheiden und klassifizieren lassen. Dazu zählt - wichtiger Aspekt - die Frage, ob eine Schriftart Serifen einsetzt oder nicht. 3.3.2.1.1 Serifen
In Bezug auf Lesbarkeit heißt es häufig, die Schriften mit Serifen seien hier im Vorteil. Andere wiederum vertreten die Meinung, serifenlose Schriften wären auf dem Monitor besser lesbar. Richtig ist dagegen wahrscheinlich, dass bei kleinen Zeilenabständen Serifen-Schriften besser lesbar sind. Wenn Sie jedoch auf größere Zeilenabstände setzen, können Sie auch bedenkenlos serifenlose Schriften einsetzen. Wichtig auch der psychologische Effekt: Serifenlose Schriften werden im Vergleich zu Schriften mit Serifen als moderner empfunden. Manche Surfer behaupten sogar, Seiten, die die "Times New Roman" verwenden, würden ihnen altbacken erscheinen. Eine Grundregel lässt sich also nicht formulieren. Verwenden Sie serifenlose Schriften, wenn Sie wollen, aber achten Sie dann verstärkt auf den Zeilenabstand. Mehr dazu im Abschnitt "Lesbarkeit" weiter unten. 3.3.2.1.2 ProportionalitätEin anderes Unterscheidungsmerkmal ist die Proportionalität der Schrift. Die meisten Schriften haben unterschiedlich breite Buchstaben, z.B. mit einem breiteren "m" als "i". Solche Schriftarten sind proportional. Andere Schriftarten (z.B. Courier) sind dagegen nicht-proportional oder diktengleich: Hier ist jeder Buchstabe gleich breit.Sinnvoll ist der Einsatz nicht-proportionaler Schriftarten überall dort, wo die Randentfernung eines Zeichens Bedeutung hat. Beispiel: Quelltexte. Dort erleichtert es das Verständnis enorm, wenn der Abstand (also die Einrückung) eines Zeichens vom Rand direkt klar ersichtlich ist. 3.3.2.1.3 TrueType oder BitmapTechnisch sind zwei Schrifttypen zu unterscheiden: Bitmap-Schriftarten und TrueType-Schriftarten. Erstgenannte sind dabei im wahrsten Sinne des Wortes als Bitmap gespeichert. Will man eine solche Schrift in einer Größe verwenden, die nicht von vorneherein in der Schriftdatei abgespeichert wurde, bekommt man es mit störenden Effekten wie Verpixelung zu tun. Im Gegensatz dazu TrueType-Schriftsätze: Hier liegen die Buchstaben als Vektorgrafiken vor, dabei wird sozusagen das Verhältnis der einzelnen Linien zueinander abgespeichert. Diese Schriften sind beliebig skalierbar und daher grundsätzlich zu bevorzugen.3.3.2.1.4 Schriften im SystemEin Browser kann nur die Schriften anzeigen, die als Schriftdatei verfügbar sind. Daher ist es notwendig, dass die auf der Site verwendeten Schriftarten entweder Standard sind oder online eingebunden werden.Logischerweise ist die erste Alternative zu bevorzugen: Hier muss nichts zusätzlich heruntergeladen werden, mit Grabenkämpfen zwischen Microsoft und Netscape hat man keine Scherereien. Nur: welche Schriftarten können als Standard angesehen werden? Vorweg sei gesagt, dass es wirklich plattformübergreifende Standard-Schriftarten nicht gibt. Wer jedoch bereit ist, sich auf Windows, Mac OS und Linux (nur unter Umständen) zu beschränken, der fährt mit Arial (bzw. Sans Serif), Times New Roman, Courier New und auch Verdana recht gut. Wer dagegen wirklich viel Wert auf eine bestimmte Schriftart legt, kann auch versuchen, sie online einzubinden. Wenn alles klappt, wird die passende Schriftart dann, sofern sie nicht auf dem lokalen System verfügbar ist, aus dem Internet heruntergeladen. Unser Magazin AboutWebDesign.de hat dazu einen Artikel geschrieben. 3.3.2.2 LesbarkeitTexte müssen, um beim Benutzer überhaupt ankommen zu können, gut lesbar sein.Nur: wie kann man die Lesbarkeit eines Textes erhöhen? Extrem wichtig ist der Kontrast des Vordergrundes zum Hintergrund. Gut zueinander passend sind z.B. Schwarz und Hellgrau oder Schwarz und Weiß. Achten Sie darauf, einen ruhigen Hintergrund zu verwenden, anderenfalls beginnt das Bild zu "flimmern". Ebenfalls von Bedeutung ist die Spaltenbreite: wer den Monitor in seiner vollen Breite ausnutzt, gestaltet alles andere als optimal. Text dagegen in kleineren Spalten fließen zu lassen, erhöht die Lesbarkeit. Wer sich nicht mit Spaltensatz im WWW herumschlagen will, kann sich auf eine einzige Spalte beschränken, genauso, wie wir das hier tun. Auch eine Erhöhung des Zeilenabstands trägt dazu bei, die Lesbarkeit zu erhöhen - meistens jedenfalls. Wenn Sie eine Serifen-Schrift verwenden, empfehlen wir einen verhältnismäßig kleineren Zeilenabstand, bei serifenlosen Fonts dagegen sollten Sie den Zeilenabstand eher erhöhen. Wichtig ist auch die Spaltenbreite: kleine Spalten verlangen nach einem geringen Zeilenabstand, große dagegen nach mehr Raum zwischen den Zeilen. Versuchen Sie also, das für Ihre Site geeignete "gesunde Mittelmaß" zu finden. Erreichen lässt sich eine Beeinflussung des Zeilenabstands nur mit CSS. Beispiel: style = "line-height : 20t".Es gibt demnach keine Möglichkeit, den Zeilenabstand auch für ältere Browser zu erhöhen. Wer sein Lesbarkeits-Konzept daher zu großen Teilen auf dem erhöhten Zeilenabstand aufbaut, macht einen Fehler, denn es geht darum, möglichst für alle Surfer eine gute Lesbarkeit zu erreichen. Vergessen Sie auch gerade in diesem Zusammenhang nie, dass den "Mobile Applications" eine große Zukunft vorhergesagt wird. Wer kann schon wissen, wie viele User wohl in einem Jahr über ihr Handy auf Ihre Seite zugreifen werden? Von selbst versteht sich die Wahl einer passenden Schriftgröße: winzige Mikro-Fonts sind schlecht lesbar. Gleiches gilt übrigens für animierte Schriften und Dauer-Großschreibung. 3.3.2.3 ÜbersichtlichkeitAuch Übersichtlichkeit sollte ein Leitmotiv des Webdesigners sein.Wir erwähnten bereits, dass viele Benutzer Texte im Internet überfliegen, anstatt sie zu lesen. Ein Grund dafür ist die geringere Auflösung des Monitors im Vergleich zu gedruckten Dokumenten. Andere Gründe mögen psychologischer Natur sein: das Internet ist ein hektisches Medium. Einmal abgesehen von den Auswirkungen auf Inhaltsgestaltung, die sich dadurch ergeben, macht es auch Sinn, diese Erkenntnis in die technische Textgestaltung mit einzubringen. Es geht also darum, dieses Überfliegen zu unterstützen. Erste Maßnahme muss daher eine sinnvolle Unterteilung in Absätze sein. Pro Absatz ein wesentlicher Gedankengang. Wer vor Absätze dann auch noch Zwischenüberschriften stellt, verbessert seine Textstruktur. Echte Profis recyceln ihre Zwischenüberschriften dann noch in einem internen Inhaltsverzeichnis. Wer auf der Suche nach einer speziellen Information ist, dem wird so geholfen. Wichtig auch die richtige Wahl von Zwischenüberschriften: Diese müssen möglichst objektiv und knapp gehalten sein. Wortspiele, Metaphern, Aufreißer und Humor sollten hier möglichst nicht verwendet werden. Ziel der Zwischenüberschriften ist es, dem Surfer auch ohne tieferen Texteinstieg einen kurzen Überblick zu geben. Darüber hinaus gehen andere Ansätze: Dr. Web z.B. schreibt bestimmte Schlüsselbegriffe innerhalb von Fließtexten in Fettschrift. Ob das gut oder schlecht ist, ist sicher Ansichtssache: Manch einer wird die Ansicht vertreten, damit würde das Schriftbild zu unruhig, andere dagegen werden der Meinung sein, dass dadurch optimale Übersicht erreicht werde. Wer nicht gleich so weit wie Dr. Web gehen will, der kann auch anders vorgehen, um das Schriftbild aufzulockern. Wechselnd links und rechts platzierte Bilder sind z.B. eine Möglichkeit. |
|||
|
|||
3.3.3 Inhaltliche Textgestaltung3.3.3.1 SeitentitelVor den eigentlichen Text sollte ein passender Seitentitel gestellt werden. Der Titel kann doppelt verwendet werden: Einmal imtitle-Tag und einmal im Text selbst, kurz vor dem eigentlichen Textkörper.An den Seitentitel sind verschiedene Anforderungen gekoppelt:
3.3.3.2 TextkörperNachdem Sie nun bereit sind, einen Text passend zu layouten, geht es nun um den Inhalt des Textes: Wie sollte ein im Internet zu präsentierender Text geschrieben sein, um den Erfordernissen der Surfer gerecht zu werden?Jakob Nielsen definiert in seinem Buch "Der Erfolg des Einfachen" drei Maßnahmen, Texte inhaltlich besser für das Web zu gestalten: präzise Wortwahl, objektive Sprache und ein lesbares Layout. Letzteres wurde bereits in vorhergehenden Abschnitten behandelt, die ersten beiden Punkte werden in den folgenden Faustregeln aufgegriffen. Erste Grundregel ist, wie praktisch überall, wo es um Text und Texterstellung geht, die Vermeidung von Fehlern. Rechtschreib- und Grammatik-Fehler stören den Textfluss und sind lästig. Die Verwendung eines Korrekturprogramms (z.B. Rechtschreibprüfung von Textverarbeitung) sollte Standard sein. Nebenbei gesagt geht es bei der Fehlervermeidung nicht nur um gute Inhaltsgestaltung, es geht auch um Ihr Image: Fehler sind unprofessionell! Trotzdem schleichen sie sich, trotz aller Bemühungen, fast überall ein. Fehler sind, das zeigt die Praxis, nicht vollständig vermeidbar. Auch in unseren Texten wird der interessierte Leser sicher den einen oder anderen Fehler entdecken können. Tipp: wenn Fehler aufgespürt werden sollen, dann sehen vier Augen mehr als zwei. Bitten Sie doch einen Freund oder Kollegen, einmal kurz über Ihre Texte zu sehen... Die zweite Grundregel ist ähnlich simpel: Verwenden Sie einen prägnanten Sprachstil. Kurze und griffige Sätze sind am besten für das WWW geeignet. Endlose Nebensatz-Konstruktionen dagegen sorgen oft nur für Verwirrung. Hüten Sie sich davor, den Sprachstil eines Buches oder einer Zeitung zu übernehmen: Zeitungen und Bücher werden gelesen. Internet-Seiten dagegen werden überflogen. Nur ein auf kurze Sätze ausgelegter Satzbau ermöglicht das Querlesen und den Einstieg in den Text an einer nahezu beliebigen Stelle. Die dritte Grundregel betrifft die Struktur des optimalen Internet-Textes. Herkömmliche Alltagstexte bauen ihre Argumentation normalerweise langsam auf, bis dann am Ende eines Textes oftmals die Schlussfolgerung aus den zuvor präsentierten Argumenten folgt. Zugeschnitten ist dieses Konzept auf den "herkömmlichen" Leser, der sich vom Internet-Leser meist dadurch unterscheidet, dass er es nicht eilig hat. Schlussfolgerung: Internet-Leser sind darauf erpicht, Informationen so schnell wie möglich aufzusaugen. Erscheint eine Information es nicht wert, sich mit ihr zu beschäftigen, wird sie sehr schnell vom Monitor weggeklickt. Ein guter Online-Text muss die Aufmerksamkeit des Lesers also schnell gewinnen, sonst wird er nicht gelesen. Erreicht wird das durch die Voranstellung besonders interessanter Informationen aus dem folgenden Text. Der Fachbegriff dafür ist der sog. "Teaser", eine kleine Einleitung, die das Interesse des Lesers wecken soll. Interessanterweise also wird im Internet oft eine im Vergleich zu herkömmlichen Texten komplementäre Struktur verwendet: die Schlussfolgerung am Anfang, die Argumente im folgenden Text. |
|||
|
