Webkongress Erlangen 2018

Der Firefox für Desktops enthält ab Version 61 in den Entwicklertools ein Werkzeug, mit dem Webentwickler untersuchen können, wie ihr HTML, CSS und JavaScript zur Laufzeit für Hilfstechnologien wie Screen Reader übersetzt werden. Mit diesem können viele Probleme schnell erkannt und die Struktur eines Dokuments so erfasst werden, wie diese nachher bei Endanwendern ankommt. So können schon vor der eigentlichen Prüfung auf die Erfüllung der WCAG-Kriterien viele Fehler gefunden und korrigiert werden.

In diesem Vortrag zeigt Marco Zehe anschaulich und anhand einer Live-Demo, wie das Werkzeug eingesetzt werden kann. Auch wird gezeigt, wie Anwender, die nicht Webentwickler sind, den Accessibility Inspector einsetzen können, um Probleme an Webentwickler zu melden.

Web-Performance ist und bleibt auch 2018 ein wichtiges Thema. Nicht nur, dass Google schnelle Seiten im Ranking bevorzugt, auch freut sich sicherlich jeder Nutzer über eine performante Seite. Wer wartet schon gern auf das Laden von Schriften oder zu großen Bildern?

Aber: Gelten die bekannten Optimierungen noch, oder werden mittlerweile andere Kriterien bevorzugt? Wie werden Web-Fonts effizient geladen? Was ist beim Laden von CSS, JavaScript und Bildern zu beachten? Wie testet man Website-Performance und automatisiert Monitoring? Welche Möglichkeiten bieten Service Worker und HTTP2 zur Performancesteigerung?

Diese und weitere neue Tricks zeigt Sven Wolfermann in seiner Session.

Die Komplexität eines Webportals steigt im Normalfall direkt proportional zu den Ansprüchen, die gestellt werden. Zuvor ausgewählte Technologien, Architekturen und CMS können da oft nicht mehr mithalten oder halten uns sogar auf. Wir verbiegen Schnittstellen, bis sie brechen. Unsere dedicated Server gehen in die Knie. Anzahl und Qualität der installieren Plug-Ins lassen unser Portal an Frankenstein erinnern.

Mit den neuen Möglichkeiten, die hippe Cloud-Technologien mit sich bringen, können wir solchen Monolithen vorbeugen:

Sehen wir uns an, wie diese Einzelteile im großen Ganzen zusammenspielen, und wie komplex diese Systeme wirklich sind. Kopflose Systeme, ohne selbst dabei den Kopf zu verlieren. Dabei werfen wir einen kritischen Blick auf Integrität, Nachhaltigkeit und Performance und hinterfragen Einsatzgebiete.

COMPARE ist ein von der EU im Erasmus+ Programm gefördertes Projekt mit Partnern aus Deutschland (DIAS GmbH), Frankreich (BrailleNet) und Schweden (Funka).

Das COMPARE-Projekt hat ein Wiki-basiertes Verzeichnis entwickelt, in dem Barrierefreiheits-Prüfer und Entwickler web content cases eintragen, bewerten und kommentieren können (http://compare.accessiweb.org/ ) . Die Bewertung folgt den Kriterien der Web Content Accessibility Guidelines (WCAG) und wird im Sommer 2019 um die neuen Kriterien der WCAG 2.1 erweitert. Der Vergleich der Bewertungen ermöglicht einen Austausch über die je nach Land und genutzter Evaluations-Methode oft unterschiedliche Bewertungspraxis.

Ein zweiter Baustein des COMPARE-Projektes ist ein CONTAO-basiertes Informations- und Lernmodul, das die Anforderungen für wichtige interaktive Bausteine des Webdesigns beschreibt und praktische Probleme von Nutzern dokumentiert, z. B. über kommentierte Ausschnitte von Screencasts.  Zudem wird auf öffentlich verfügbare Best-Practice-Beispiele für inklusives Webdesign und auf die web content cases des COMPARE-Verzeichnisses verwiesen.

Der Vortrag gibt einen Überblick über die Projektergebnisse, lädt zum aktiven Mitmachen beim Verzeichnis ein und öffnet einen Raum für Fragen und Anregungen.

[1] Diese Arbeit hat im März 2018 begonnen und wird sich bis Ende 2018 fortsetzen.

Mit „Inclusive Design“ wird versucht, das Design von Mainstream-Produkten und/oder -Services für so viele Menschen wie möglich zugänglich und nutzbar zu machen.

Für barrierefreie Komponenten reicht es oftmals nicht, einzig semantisches Markup und Styles zu schreiben. Für die Nutzer-Interaktion ist Javascript notwendig, um Zustände der Benutzeroberfläche an assistive Technologien weiterzureichen.

Der Vortrag wird sich dabei auf die Javascript-Aspekte anhand einer Beispiel-Komponente konzentrieren. Dabei werden Fallstricke und Lösungsstrategien bei der Umsetzung gezeigt.

In manchen Projekten sammeln die Entwickler gerne eine ganze Reihe an Bibliotheken und kleinen Helferlein, um diese oder jene Funktion zu ermöglichen. Das rächt sich spätestens dann, wenn ein paar Monate später etwas geändert werden soll und der neue Entwickler nicht mehr durchblickt, was überhaupt wozu eingebaut wurde.

So kann etwa SASS recht nützlich sein, um seine CSS-Dateien zu ordnen.

Ebenso sind Themes und Subthemes eine feine Sache. Wenn man vom eigentlichen Theme aber nur das Grid benötigt, ist es einfacher, dieses eben selbst zu schreiben und die vielen weiteren Funktionen des Themes gar nicht erst „mitzuschleppen“.

Ebenso muss es nicht immer jQuery sein bzw. nicht immer JavaScript. Viele Projekte nutzen stillschweigend noch jQuery für alles Mögliche. Dabei ist reines JavaScript für die gängigen Probleme viel performanter. Und einige Effekte lassen sich mittlerweile auch mit HTML und CSS umsetzen.

Der Vortrag zeigt einige Beispiele von unsinnigem Code und demonstriert, wie sich Dinge einfacher und effizienter – oft auch noch performanter und benutzerfreundlicher – umsetzen lassen.

Die Digitalisierung und die moderne Welt verändern, wie wir arbeiten – insbesondere in der Webentwicklung, wo man im Prinzip überall dort arbeiten kann, wo es Internetzugang gibt.

Wie kann man das Modell des agil entwickelnden und verteilt arbeitenden Teams durch Prozesse und Werkzeuge, aber auch durch Werte und Denkweisen für alle Beteiligten angenehm und effizient gestalten?