Webseiten sind kein bedrucktes Papier

Oder wie ich den Versuch der "Kontrolle" über die Seiten aufgegeben und die Anpassungsfähigkeit entdeckt habe.


Dieses Dokument ist eine Übersetzung von Web Pages aren't Printed on Paper .


Habt Ihr jemals alte Fernsehsendungen angeschaut? Es ist lehrreich. Fernsehen wurde zu dieser Zeit als "Radio mit Bildern" bezeichnet, eine recht treffende Beschreibung. Vieles folgte dem bekannten Radioformat dieser Zeit. Einige Sendungen verfolgen noch heute diesen Ansatz: Es gibt eine Band, geladene Gäste und ein Showmaster mit ihnen gemeinsam in eine Kamera redet, nachdem er das Tagesgeschehen kommentiert hat; oder auch die Nachrichten: Der Nachrichtensprecher erscheint als Person, statt einfach nur aufgezeichnete Bilder mit einem Kommentar zu zeigen. Es sind die Überbleibsel des Mediums, aus dem das Fernsehen entstand.

Denkt an die ersten Musikvideos (einige von uns sind wohl so alt)! Die Band hat sich selber beim Spielen der Musik gemimt. Wie fesselnd...

Wenn ein neues Medium etwas von einem etablierten übernimmt, macht einiges davon Sinn, aber anderes wird ohne zu überlegen übernommen und das behindert das neue Medium. Mit der Zeit entwickelt das neue Medium eigene Konventionen und wirft alte, die keinen Sinn mehr machen, über Bord.

Wenn ihr jemals die Chance bekommt wirklich alte Fernsehdramen zu sehen, dann gibt's ein offensichtliches Beispiel. Weil das Radio einen neutralen Sprecher benötigte, der beschrieb, was auf der Bühne passiert, gibt es in alten Dramen einen Sprecher im Off, der beschreibt, was die Zuschauer gerade sehen. Wozu? Ein plastisches Beispiel, was passiert, wenn sich ein Medium aus etwas bereits Bekanntem entwickelt und der Sinn der Konventionen nicht hinterfragt wird.

Ich fasse das Web als ein printnahes Medium auf und vergleiche es mit den klassischen Printmedien, dessen Fähigkeiten, Sprache und Konventionen, die die Erscheinung von Webseiten derzeit stark beeinflussen. Ich befürworte überhaupt nicht, daß jahrhundertealte Erfahrungen aus dem Druckbereich und jahrtausendealte Erfahrungen aus der Schrift aufgegeben werden sollen. Aber ich möchte überlegen, inwieweit die Einflüsse aus dem Druckbereich webbasiertes Veröffentlichen ohne guten Grund beschränken.

Im letzten Jahr habe ich meine Ansichten bezüglich des Webdesigns und Veröffentlichungen im Web geändert. Auf den ersten Blick sieht das trivial aus, aber durch meine Diskussionen mit Webdesignern, in Newsgruppen, die ich gelesen oder an denen ich mich beteiligt habe, ist die Änderung alles andere als trivial; für einige ist es diskussionswürdig und für wieder andere ist es ketzerisch.

Wo ist der Unterschied?

Der Unterschied zwischen dem Radio und dem Fernsehen ist einfach zu beschreiben, aber die Folgen sind alles andere als trivial. Der Unterschied sind bewegte Bilder.

Der Unterschied zwischen einer gedruckten Seite und einer Webseite ist gleichermaßen einfach: gedruckte Seiten sind statisch, Webseiten sind fließend. Welche Folgen ergeben sich aus diesem einfachen Unterschied?

Viele Webdesigner behandeln diese Anpassungsfähigkeit als Problem. PDF wird oft als Heilung dieses Problemes gepriesen. Cascading Style Sheets werden gelegentlich als Art PDF für HTML gehandelt, aber Entwickler vernachlässigen CSS wenn es "nicht richtig funktioniert".

Was ist die Natur dieses "Problems"? Der Designer verliert die Kontrolle über sein Design.

Leser können die Größe der Seite verändern, die Schriftart und Schriftgröße wählen, mit anderen Worten: Der Leser hat die Kontrolle. Es ist sehr verständlich, warum Designer dies, neben den Plattformunterschieden mit verschiedenen Betriebssystemen, Browsern und unterschiedlichen Einstellungen, als zu lösendes Problem ansehen. Die Designer dieser Welt haben bei Papierveröffentlichungen die Kontrolle. Eine ganze Industrie ist entstanden, die sicherstellt, daß das, was der Designer will, auch in dieser Form beim Leser erscheint.

Aber was passiert, wenn das keine Rolle mehr spielt? Was, wenn der Designer nicht mehr der König ist? Was ist, wenn wir den Designer als jemanden betrachten, der wohlüberlegte Vorschläge macht, wie der Leser die Information zu empfangen wünscht und nicht allwissend bis ins Kleinste diktieren kann, wie es sein muß? Es ist leicht übertrieben, aber das Fakt, daß der Leser die Webseite nach ihren eigenen Vorstellungen und wichtiger Ihren Notwendigkeiten anpassen kann, bleibt.

Ich werde die Möglichkeit des Lesers, den Inhalt von Webseiten an ihre eigenen Bedürfnisse anzupassen Anpassungsfähigkeit nennen. Von meiner Betrachtungsweise her ist Anpassungsfähigkeit kein Problem, im Gegenteil es ist eine besondere Stärke des Webs. Und als Webdesigner sollte man versuchen webbasierte Informationen so anpassungsfähig wie möglich machen. Wir sollten vom heiligen Gral der Pixelperfektion weggehen und unsere Seiten so Designen und Aufbauen, daß Sie so anpassungsfähig wie nur möglich werden.

Warum?

Ich kann den Wert der Anpassungsfähigkeit nicht beschreiben. Ich brauche es, glaube ich, auch nicht. Fragen wir uns zuerst, welchen Vorteil eine Seite hat, die nicht anpassungsfähig ist? Gedruckte Seiten sind fix, weil Sie es physisch sein müssen. Man könnte argumentieren, daß ein Designer die Ausbildung und Erfahrung hat, um bestmögliche Erscheinung und Lesbarkeit sicherzustellen. Das ist vielfach auch der Fall. Aber deckt das auch die Situationen ab, wenn Leser unterschiedliche Fähigkeiten mit der Wahrnehmung haben? Wie gut kommt das Design mit einem Leser zu recht, der sehr schlechte Augen hat? Oder mit Farbenblindheit? Wie gut kommt die "Eine Größe für alle" Designphilosophie damit zu recht, wenn der Leser keinen PC mit Monitor, sondern einen Fernsehbrowser oder einen Handheld benutzt?

Das sind wichtige Fakten über Webpublishing, die - durch die viel zu oft ignorierte - Flexibilität erreicht werden können.

Anpassungsfähigkeit ist Fakt im Web. Es ist eine Behinderung, ein Mangel, ein Fehler, wenn ihr wollt oder aber ein immanenter Vorteil, eine Stärke des Mediums. Es wird so bleiben und ich glaube, es sollte und es wird nicht abgestellt werden.

Ein weiteres Argument gegen die Anpassungsfähigkeit könnte unter ethischen oder rechtlichen Gesichtspunkten auftauchen. Ein Designer könnte folgendermaßen argumentieren: "Das ist mein Design, und es ist Bedingung, daß ihr es so betrachtet, wie ich es entworfen habe.". Ein Anwalt könnte eine Lizenz entwerfen, in der genau dies drinsteht. (Wenn man geistiges Eigentum lizensieren möchte, so findet sich ein solcher Passus mit einiger Sicherheit.) Vom ethischen Standpunkt her könnte ein Designer argumentieren, daß es rücksichtslos ist und möglicherweise Rechten des Autors - durch das praktisch weltweit geschützte Urheberrecht - entgegenläuft. Man wird antworten können, daß das Web auf Zugänglichkeit beruht und das es höchst problematisch ist Leute wegen einer Behinderung von Informationen auszuschließen, zumal diese Änderungen nicht zwangsläufig durch das Urheberrecht verboten werden.

Aber es gibt noch weitere Argumente. Wenn ihr nicht an den grundsätzlichen Wert der Anpassungsfähigkeit glaubt, so geben diese Argumente eine Rechtfertigung oder einen Mechanismus, um Leser davon abzuhalten die Designerseiten an Ihre Vorstellungen oder Notwendigkeiten anzupassen. Zu sagen, daß Anpassungsfähigkeit rücksichtslos oder möglicherweise illegal ist, entkräftet ja nicht das Argument, daß Anpassungsfähigkeit wichtig ist.

Es kann wirklich etwas dauern, sich auf diese Position einzulassen, weil es die Rolle des Designers, von Gott zu Guru, ändert. Viele Designer werden sich in ihrer derzeitigen Rolle wohler fühlen. Änderungen sind selten angenehm.

Wie kann Anpassungsfähigkeit eingebaut werden?

Wenn ihr soweit gelesen habt und ein Fünkchen Wahrheit in meinen Aussagen findet, will ich jetzt die Frage aufwerfen, was wir machen und versuchen können, um zu versuchen, daß unsere Seiten anpassungsfähiger werden.

Bevor das praktisch passiert, schauen wir uns das einmal philosophisch an. Als Designer muß man seine Seiten gehen lassen, wie auch Eltern ihre Kinder gehen lassen müssen. Sobald diese in die Welt (das WWW) gehen lässt, leben Sie ihr eigenes Leben. Man kann nur Vorschläge zum Aussehen machen, aber nicht auf dem Aussehen bestehen. Das ist die größte Hürde, wenn man anpassungsfähige Seiten entwickelt. Diese Philosophie für sich anzunehmen passiert (normalerweise) nicht sofort. Vielleicht wurdet ihr von den Argumenten überzeugt, warum Webdesign anpassungsfähig sein sollte, aber ihr fühlt Euch damit noch nicht wohl. Es ist eine riesige Chance; es könnte einige Zeit brauchen.

Laßt uns jetzt verschiedene Aspekte von Webseiten betrachten bei denen es sehr wahrscheinlich ist, daß Sie sich von Plattform zu Plattform und von Leser zu Leser unterschiedlich aussehen. Wir werden überlegen, wie die Seiten aufgebaut sein sollten, um sich diesen Gegebenheiten anzupassen.

Praktisch gesprochen wird im Folgenden davon ausgegangen, daß alles das mit Aussehen der Webseite zu tun hat über die Verwendung von Stylesheets (CSS) gelöst ist.
HTML sollte einfach nicht mehr dazu verwendet werden aus Aussehen zu beeinflussen.

Mehr über CSS findet ihr auf einer (englischen) Liste mit Quellen zu CSS.

Schriften

Der durchschnittliche Windowsrechner, Macintosh oder auch andere Systeme haben nur eine handvoll Schriften installiert. Es gibt kleine Überschneidungen der üblicherweise bei den unterschiedlichen Systemen installierten Schriften. Mit vielen Browsern, und zukünftig noch zunehmend, kann der Leser verbindlich einstellen mit welcher Schrift er Webseiten betrachten will. Mittels CSS kann man eine Vielzahl von Schriften vorschlagen, aber verlaßt Euch nicht darauf, daß bestimmte Schriften vorhanden sind oder auch zur Anzeige genutzt werden, egal wie verbreitet Sie auch sein mögen.

Wichtiger ist aber die Schriftgröße. Vielleicht ist Euch bereits bekannt, daß bei einer identischen Schrift und derselben Größe auf einem Macintosh "kleiner aussieht" als auf den meisten Windowsrechnern. Ganz grob gesagt liegt das daran, daß die "logische Auflösung" auf einem Macintosh 72dpi beträgt, während es bei Windows 96dpi sind. Damit wird auch klar, warum es nicht möglich ist den Text auf Windows und Macintosh basierten Rechnern identisch aussehen zu lassen. Aber wenn Ihr der Philosophie der Anpassungsfähigkeit folgt, dann spielt das schlicht keine Rolle.

Was? Wenn Ihr Euch immer noch Gedanken macht wie genau eine Webseite erscheint, dann ist das ein Zeichen, daß Ihr noch nicht an anpassungsfähige Seiten denkt. Einer der wichtigsten Zugänglichkeitspunkte ist die Schriftgröße. Kleine Schriften sind schwieriger zu lesen. Für alle mit guten Augen wird es ein Schock sein, daß ein erheblicher Teil der Bevölkerung Probleme hat Times, mit weniger als 14 Punkten, auf Papier zu lesen. An Bildschirmen ist Text noch schlechter lesbar, weil sie eine geringere Auflösung haben.

Bedeutet das, daß die kleinste Schriftgröße die man verwenden sollte 14 Punkte ist? Das hilft denen, die schlecht sehen nicht. Welche Größe sollte ich dann nehmen? Keine. Gebt einfach nichts an. Das erlaubt dem Leser die für ihn passende Größe zu wählen.

Ihr könnt für Überschriften und andere Elemente immer noch Vergrößerungen vorschlagen. CSS eröffnet verschiedene Möglichkeiten die Schriftgröße vorzuschlagen, die die Anpassungsfähigkeit nicht beeinflussen. Wir schauen uns eine Möglichkeit etwas genauer an.

Mit CSS kann man die Schriftgröße als eine Prozentangabe zum übergeordneten Elternelement angeben. Zum Beispiel befinden sich Überschriften immer innerhalb von BODY. Wenn man jetzt keine Größe für den Text im BODY angibt, dann wird die Größeneinstellung des Lesers (für ihn passend) genommen. Indem wir nichts machen, erhöhen wir die Anpassungsfähigkeit unserer Seite!

Ihr könntet sagen "Aber das sieht zu groß aus", wenn ich es einfach so lasse. Na dann mach' es kleiner, aber in Eurem Browser! Eure Leser können dann, abhängig von ihrem Geschmack und den Bedürfnissen, die Schrift größer oder kleiner machen.

Wir können Überschriften und andere Elemente hervorheben, indem wir sie vergrößern. Bespielsweise können wir für Überschriften erster Ordnung vorschlagen, daß Sie 30% größer sind als der Fließtext und Überschriften zweiter Ordnung 25% größer sein sollen und so weiter. Jetzt werden die Überschriften entsprechend angepaßt, wenn der Leser die Größe des Fließtextes verändert. Natürlich kann man bestimmte Textstellen auch kleiner machen, als den Fließtext, aber das kann zu Problemen führen, wenn der Leser schon die kleinste für ihn lesbare Schrift für den Fließtext eingestellt hat. Seid damit also vorsichtig!

Wir haben bisher recht wenig gemacht; wir haben nur absolute Größenangaben für Schriften vermieden und proportionale Angaben für Überschriften vorgeschlagen und damit haben wir unsere Seite schon wesentlich anpassungsfähiger und zugänglicher gemacht.

Layouts

Margins, Seitenbreite und Einzüge sind Aspekte des Seitendesigns, die die Lesbarkeit unterstützen können. Das Web hält aber Überraschungen für den Designer mit diesen Punkten bereit. Browserfenster können verändert werden und damit ändert sich die Seitengröße. Verschiedene Webbrowser (WebTV, hochauflösende Monitore, PDAs) haben verschiedene minimale und maximale Fenstergrößen. Wie auch bei fixen Schriftgrößen kann ein fixes Seitenlayout im Web problematisch sein.

Wie auch bei den Schriften kann dieses Layout erreicht werden, wenn man prozentuale Angaben arbeitet, was ebenfalls zu anpassungsfähigeren Seiten führt. Margins können als Prozentangaben der Breite des übergeordneten Elementes angegeben werden.

Wenn man Prozente (oder andere relative Werte) angibt, um das Seitenlayout anzugeben erhält man automatisch anpassungsfähige Seiten. Wenn man Browserfenster vergrößert oder verkleinert passt sich das Layout mit identischen Proportionen an und damit wird die gesamte Seite anpassungsfähig.

Margins, Texteinzüge und andere Aspekte des Layouts können ebenfalls in Abhängigkeit zur Textgröße angegeben werden. Das ist ein weiterer Weg, der das Seitendesign anpassungsfähig an die Wünsche des Lesers anpaßt.

Farben

Das Web ist ein wesentlich farbigeres Medium als bedruckte Seiten. Farbe ist im Web halt billiger. Farbe kann Beiwerk sein, Helfen eine Identität zu erzeugen und auch praktische Werte (Rot zieht die Aufmerksamkeit auf wichtige Informationen) haben. Aber Farben sind wiederum nicht unproblematisch.

Wußtet Ihr, daß in vielen (wenn nicht allen) Ländern Leute mit Rot-Grün Farbenblindheit (Sie können die beiden Farben nicht unterscheiden) keinen Pilotenschein erwerben dürfen? Unabhängig von anderen Fähigkeiten liegt das daran, daß fast immer und überall Rot für Warnungen und Grün für Sicherheit verwendet wird. Es ist eine Schande, daß Warnlichter nicht einfach anpassungsfähig sein können...

Schließen Eure Seiten Leute auf ähnliche Weise aus? Es würde Schade sein, denn es gibt einfache Wege für den Leser zu bestimmen (mit einem User-Stylesheet), welche Farben für Hintergründe und Elemente verwendet werden sollen, die Eure Farbangaben überschreiben.

Wie man dieses Problem vermeidet? Gebraucht Stylesheets statt des HTML Elementes <font>. Verlaßt Euch auch nicht alleine auf Farben, um den Sinn zu transportieren.

Man kann in diesem Dokument nicht auf alle Aspekte der Anpassungsfähigkeit eingehen. Ich habe einfach nur versucht, ein paar Grundsatzfragen aufzuwerfen, damit man anfängt darüber sowohl praktisch als auch theoretisch nachzudenken.

Wie geht es jetzt weiter?

Wenn ihr denkt, daß das Gesagte Sinn macht, dann fang an Eure Seiten von reinem HTML auf HTML in Verbindung mit CSS umzustellen. Wenn ihr bereits CSS nutzt, dann verlaßt auf nicht auf physikalische Größen wie Pixel oder Punkte für Schriften und das Layout, sondern nehmt Prozentangaben oder relative Einheiten wie EM.

Mehr Informationen zu CSS gibt's mit einem CSS-Tutorial Everything you ever wanted to know about style, oder schaut Euch eine Liste mit ausgewählten CSS-Quellen an.

Zustimmung? Ablehnung? Habt Ihr etwas zu sagen? Laßt es mich doch bitte wissen!

Web-Technik und Anleitungen.