Webfieldmanual: Zentrale Anlaufstelle für Designer und Coder

Der Service Webfieldmanual.com ist eine wachsende Sammlung rund um die Themen Design und Coding. Neben der Informationsfülle sticht vor allem das bemerkenswert gut gelungene Design des Dienstes selbst ins Auge.

Hast du dein Webfieldmanual? Yes, Sir!

Das Webfieldmanual.com bietet nicht zufällig optische Reminiszenzen an militärische Zusammenhänge. Der Begriff Field Manual selber stammt aus dem militärischen Sprachgebrauch und bezeichnet eine Art Handbuch, das Soldaten im Kampfeinsatz mit sich führen sollten. Das Field Manual stellt somit die essentielle Wissensbasis auf dem Schlachtfeld dar.

Webfieldmanual.com: Landing Page (Screenshot: Dr. Web)

Und wenn man es etwas martialisch liebt, findet man sich als freelancender Webdesigner und Coder vielleicht ganz gerne in dem Bild des Einzelkämpfers in der harten Web-Industrie wieder. Auf jeden Fall erhebt ein Field Manual als solches stets den Anspruch, das unverzichtbare Tool im Alltag zu sein, ohne das man es nicht unversehrt zurück ins Basislager schafft.

Das Webfieldmanual.com gibt sich große Mühe, diesem hohen Anspruch gerecht zu werden und bietet tatsächlich eine Fülle an Knowhow-Ressourcen und kleinen Tools, ohne die das Überleben im Web-Alltag schwerer als nötig ist.

Der Service wird betrieben vom US-amerikanischen Designer-Trio Jon Yablonski, Garrett Wieronski und Geoff Tice. Ergänzt wird die Website durch einen gleichnamigen Twitter-Account, über den du dich über Neuzugänge im Portfolio unterrichtet halten kannst. Bist du eher ein Freund traditioneller Informationswege, wird dich eventuell ein Abonnement des E-Mail-Newsletters reizen, der dich mit einer wöchentlichen Zusammenfassung ebenfalls auf dem Laufenden hält.

Webfieldmanual: Design | Code | Tools

Die einfachste und komfortabelste Zugangsmöglichkeit zum wirklich beeindruckend umfassenden Fundus des Dienstes ist die Freitextsuchfunktion, die sich hinter dem Lupen-Piktogramm rechts oben im Browserfenster befindet. Sobald du beginnst, einen Suchbegriff in das Feld zu schreiben, erscheinen darunter in Echtzeit Ergebnisvorschläge. Das funktioniert rasend schnell und äußerst präzise.

Webfieldmanual.com: Freitextsuche (Screenshot: Dr. Web)

Wenn du nicht genau weißt, wonach du eigentlich suchst, oder einfach nur mal stöbern willst, brauchst du dich lediglich zu entscheiden, ob du in Design- oder Codethemen schwelgen willst. Innerhalb dieser beiden Hauptkategorien findest du dann jeweils lange vorsortierte Listen mit allen Informationen, die du heutzutage benötigen könntest.

Das ist nämlich auch eine der bemerkenswerten Tatsachen am Webfieldmanual. Mir ist keine einzige veraltete Ressource untergekommen. Da bin ich anderes gewohnt. Die meisten Verzeichnisse, Listenanbieter oder wie du es auch immer nennen willst, nehmen Elemente immer gerne auf, schmeißen sie dann aber nie wieder raus und brüsten sich damit Zigtausend Einträge anzubieten. So läufst du häufig genug Gefahr, dir veraltetes Wissen einzuverleiben. Diesbezüglich musst du dich beim Webfieldmanual nicht sorgen.

Die einzelnen Hauptkategorien Design und Code beherbergen zwar dann lediglich scrollbare Listen, die weiter nach Kategorien unterteilt sind. Die Strukturierung ist aber dennoch sehr gelungen. Viel Whitespace sorgt für gute Übersichtlichkeit und das zurückhaltende Design macht tatsächlich Spaß.

Webfieldmanual.com: Hauptkategorie Design > Kategorie Animation (Screenshot: Dr. Web)

Jede einzelne Ressource wird kartenbasiert mit einem Titel und einem Satz zur Beschreibung vorgestellt. Ein Klick auf die Karte führt direkt zu der URL des jeweiligen Elements. Die Bedienung ist demnach schnell erlernt. Willst du direkt zu einzelnen Kategorien aus der endlos erscheinenden Liste springen, verwendest du das am unteren Bildschirmrand angeordnete Hamburger-Menü mit der Bezeichnung Categories.

Webfieldmanual.com: Tools aus der Feder der Betreiber (Screenshot: Dr. Web)

Eine Sonderposition nimmt die Hauptkategorie Tools ein. Hier findest du nicht etwa eine Sammlung von Tools nach dem gleichen Muster, wie du Ressourcen zu Design und Code unter den beiden anderen Hauptkategorien findest, sondern hier finden sich Tools, die von den Betreibern selber erstellt und bereitgestellt werden. Aktuell steht hier nur ein JavaScript-Tester zur Verfügung, ein Media-Query-Generator und ein Rechner für responsive Typografie sind angekündigt.

Das Webfieldmanual.com verdient sich mit einer klaren Empfehlung einen Platz in deiner Entwickler-Toolbox. Nicht unerwähnt bleiben sollte der Umstand, dass das Webfieldmanual selber eine Best Practice für modernes Design mit subtilen Animationseffekten darstellt. Good Job!