Netzgestaltung

Für die Zeit zwischen Weihnachten und Neujahr habe ich ein paar Tage frei. In diese Zeit nahm ich mir ein paar Bücher mit, denen ich etwas mehr Zeit zukommen lassen wollte. Eines davon ist »HTML5 for Web Designers« von Jeremy Keith.

Dieses Buch erscheint im Verlag »A BOOK APART«, von den Herausgebern des Web-Magazins A LIST APART. Die Bücher, die in diesem Verlag erscheinen, folgen dem Anspruch kurz und bündig über Themen zu schreiben, die für Webdesigner wichtig sind.

Mir hat die Lektüre des Buches sehr gut gefallen. Auf mich wirkt es wie ein Espresso. Es enthält in konzentrierter Form eine Fülle wichtiger Gedanken und Anregungen, die beleben und Lust machen, weiter mit HTML5 zu experimentieren. Auf »CSS3 for Web Designers«, das sich noch in meinem Rucksack befindet, freue ich mich schon sehr.

In Kapitel 4 thematisiert Keith die Möglichkeiten, die HTML5 im Umgang mit Formfeldern bietet. Und auf einen Aspekt davon möchte ich nun gerne kurz eingehen.

Im Umgang mit Formfeldern <input> bringt HTML5 einiges an Neuerungen. Ein Suchfeld, wie hier abgebildet kann mit folgendem Code erzeugt werden:

<p>
<label for="query" >Suche: </label> 
<input id="query" name="query" type="search" 
placeholder="Suchbegriff ..." >
</p>

Es ist nun möglich Formfelder entsprechend ihrer Funktion anzusprechen. In diesem Fall verwendete ich folgendes: type=“search“. Die Browser verstehen sofort, dass es sich bei dem entsprechenden Feld um ein Suchfeld handelt. Diese Felder werden dann entsprechend der Spezifikationen der Browser dargestellt.

Die zweite Möglichkeit ist das Eingeben eines Platzhaltertextes. Dies wurde hier mittels placeholder=“Suchbegriff …“ umgesetzt. Bisher wurde dafür Javascript verwendet. HTML5 löst an einigen Stellen den Einsatz von Plugins ab, und ermöglicht es so Webdesignern, gewünschte Funktionen direkt über das Markup zu realisieren. Bei meinen kurzen Tests eben, stellte sich jedoch heraus, dass es bisher lediglich die Webkit-Browser (Safari und Google Chrome) sind, die die Platzhalter-Spezifikation unterstützen.

Auf dem Weg zu semantisch aufgebauten Webseiten sind die genaueren Bezeichnungen unterschiedlicher Formfelder, und darüber hinaus einzelne Abschnitte einer Webseite, eine wichtige Neuerung. Die Möglichkeiten auf Erweiterungen mittels Javascript und anderer Plugins zu verzichten, und die gewünschten Funktionen direkt über das Markup zu realisieren werden der Kompatibilität und der Schnelligkeit von Webseiten zuträglich sein.

Wieso eigentlich extra gestalten?

Keith wirft im angesprochenen Kapitel die Frage nach der Gestaltung der so erzeugten Formfelder auf. Die Browser, die eine besondere Gestaltung liefern (im Falle des Suchfeldes sind das die Webkit-Browser), bieten momentan noch keine weitere Gestaltungsmöglichkeit. Sie erscheinen also auf die Weise, wie der Browser sie ausgibt. Diese Ausgabe entspricht jedoch der Darstellung eines Suchfeldes im Browser selbst.

Die Frage nach der Gestaltungsmöglichkeit wendet er daraufhin geschickt zur Frage, ob Formfelder überhaupt extra gestaltet werden sollten. Wenn Benutzerfreundlichkeit eng verbunden ist mit Gewohnheit, dann erscheint diese Frage plausibel. Eine Person, die eine Webseite mit einem Safari betrachtet, kennt die Darstellung eines Suchfeldes in ihrem Browser, sie wird dementsprechend das Suchfeld innerhalb der Webseite als solches erkennen.

Keith betrachtet die browserspezifische Darstellung der Formfelder als Herausforderung an die Browserentwickler. Diese werden sich ins Zeug legen, gebräuchliche Formfelder gut gestaltet auszuliefern, so dass ein angenehmes Surferlebnis entsteht, und somit Benutzerinnen und Benutzer gewonnen werden. Ich hoffe, dass die Entwicklung tatsächlich in diese Richtung geht.

Momentan würde mich jedoch interessieren, wie ihr das seht. Was haltet ihr davon bei der Gestaltung von Webseiten auf „vordefinierte Formfelder“ zu setzen?

_

Ein Browser, der die HTML5-Spezifikation der Formfelder nicht auf diese Weise unterstützt, behandelt sie wie normale Texteingabe-Felder. Die Spezifikation kann also verwendet werden, ohne dass Besucherinnen und Besuchern daraus ein Nachteil erwächst, sollte ihr Browser diese Spezifikation nicht unterstützen.