Dieter Petereit 16. Mai 2014

Google Web Fundamentals: Kostenloses Online-Handbuch lehrt Webdesign über Gerätegrenzen hinweg

Vor einigen Tagen stellte Google die erste Beta-Version eines leicht verständlichen und angenehm designten Online-Handbuchs für Webdesigner und Entwickler ins Netz. Das Projekt versteht sich als in Arbeit befindlich und soll im Juni in eine erste stabile Version 1.0 münden. Es gibt indes keinen Grund, bis dahin zu warten, denn bereits jetzt ist Web Fundamentals eine schöne Sammlung der besten Methoden und Vorgehensweisen im responsiven Design über Gerätegrenzen hinweg. Die Arbeit an dem Projekt wird via Github koordiniert, während das Online-Handbuch selber eine eigene Hochglanz-Website spendiert bekam, die ihrerseits ein Beispiel für das ist, was man zu lehren beabsichtigt…

Google Web Fundamentals: Landing Page

Google Web Fundamentals: Startseite

Web Fundamentals: Ganz von vorne beginnen

Googles Name für das jüngste Unterstützungsprojekt für Webentwickler und -designer ist eine Untertreibung. Anders als der Name "Web Fundamentals" suggeriert, geht das Handbuch schon vom Start weg über die reinen Grundlagen hinaus und ist deutlich auf Wachstum ausgerichtet. Sind Sie neu im Thema Design für mobile Geräte, ist sicherlich der Einstieg "Getting Started" für Sie geeignet. Haben Sie hingegen bereits mobile Websites erstellt und hantieren mit Begriffen wie Viewport und Breakpoint ganz selbstverständlich, wird dieser Teil des Handbuchs nicht viel für Sie tun können.

Google Web Fundamentals: Key Takeaways
Google Web Fundamentals: Key Takeaways (die wichtigsten Infos in Kürze)

Dennoch will ich den absoluten Einstieg nicht so schnell verlassen. Denn man muss sagen, Google hat sich hier richtig viel Mühe gegeben. Getting Started ist sehr leicht verständlich, bietet gute Beispiele, sauberen Code und unterstützt den Lernprozess effektiv mit Hilfen wie den Key Takeaways und den Notes, die immer wieder eingestreut werden, um das Wichtigste nochmal zusammen zu fassen oder einzelne Merkposten besonders hervor zu heben.

Google Web Fundamentals: Note

Google Web Fundamentals: Note (Merkposten)

Beispielbilder, die den Stand der Bearbeitung im Vergleich zum fertigen Produkt zeigen, helfen beim Verständnis dessen, was man überhaupt erreichen will.

Google Web Fundamentals: Finished Example

Google Web Fundamentals: Fertiges Beispiel

Haben Sie sich durch die beiden Kapitel des Getting Started gearbeitet, sind Sie hinreichend mit Vorwissen ausgestattet, um sich mit den weiteren Themen des Handbuchs auseinander zu setzen.

Web Fundamentals Handbuch: Vier Themenbereiche mit zehn Lektionen

Das Handbuch selber setzt sich derzeit aus vier Themenbereichen mit insgesamt zehn Lektionen zusammen. Dabei ist bereits erkennbar, dass die Themenauswahl auf Wachstum angelegt ist, ebenso erwarte ich das Hinzufügen weiterer Lektionen zu den einzelnen Themen.

Google Web Fundamentals: Topics

Google Web Fundamentals: Themenübersicht

Der erste Themenbereich "Multi-Device Layouts" beschäftigt sich mit Methoden des responsiven Webdesign. Der zweite Bereich namens "Forms and User Input" erklärt den responsiven Einsatz von Formularen und erläutert, wie man die Möglichkeit der Benutzereingabe um Touch-Funktionalität erweitert. Das sehr interessante Thema "Images, Audio and Video" behandelt alle Aspekte des Hinzufügens von Medien zu responsiven Designs und der letzte Themenbereich kümmert sich um Fragen der "Performance", also der Geschwindigkeit der zu erstellenden Sites.

Zusätzlich bietet Web Fundamentals einen Bereich mit weiteren Ressourcen, darunter den Visual Style Guide, der für das Handbuch selber Verwendung fand. Auf diese Weise lassen sich Zusammenhänge schneller erfassen und zu konkretem Wissen manifestieren.

Drüben bei Github läuft bereits die Diskussion darüber, wie und wo man das Handbuch noch verbessern und erweitern kann. Jedermann hat die Möglichkeit, dort Pull Requests einzureichen. Die Qualität der Web Fundamentals ist so, wie man es von Google insgesamt gewohnt ist, nämlich hoch. Wenn Sie der englischen Sprache hinreichend mächtig sind, sollten Sie das Handbuch auf jeden Fall zu einem festen Bestandteil Ihrer Designer-Bookmarkliste machen.

Links zum Beitrag

Dieter Petereit

Dieter Petereit

ist seit 1994 im Netz unterwegs, aber bereits seit über 30 Jahren in der IT daheim. Seit Anfang des neuen Jahrtausends schreibt er für diverse Medien, hauptsächlich zu den Themenfeldern Technik und Design. Man findet ihn auch auf Twitter und Google+.
Dr. Webs exklusiver Newsletter
Hinweise zum Datenschutz, also dem Einsatz von Double-Opt-In, der Protokollierung der Anmeldung, der Erfolgsmessung, dem Einsatz von MailChimp als Versanddienstleister und deinen Widerrufsrechten findest du in unseren Datenschutzhinweisen.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Kennst du schon unseren Newsletter?

Hinweise zum Datenschutz, also dem Einsatz von Double-Opt-In, der Protokollierung der Anmeldung, der Erfolgsmessung, dem Einsatz von MailChimp als Versanddienstleister und deinen Widerrufsrechten findest du in unseren Datenschutzhinweisen.