Zu jedem Handlungsziel aus der Modulidentifikation (hier gekürzt wiedergegeben) werden keine, eine oder mehrere realistische, beispielhafte und konkrete Handlungssituationen beschrieben, die zeigen, wie die Kompetenzen in der Praxis angewandt werden.
Nina absolviert ihre Ausbildung bei der Webagentur webwerk. Ein lokaler Bäckereibetrieb möchte seinen veralteten Internetauftritt durch eine moderne, mobiltaugliche Webseite ersetzen. Nina übernimmt den Auftrag von der ersten Skizze bis zur Veröffentlichung.
Vom Grafikteam erhält Nina einen klickbaren Prototyp und ein Mockup der geplanten Bäckerei-Webseite. Bevor eine Zeile Code entsteht, prüft sie den Entwurf auf technische Machbarkeit: Lassen sich die verschnörkelten Schriften und Animationen in allen gängigen Browsern (Firefox, Chrome, Safari) sauber darstellen? Ist das Layout responsive umsetzbar? Sie hält kritische Stellen fest und bespricht mit der Grafikerin, wo eine kleine Anpassung den Aufwand deutlich reduziert.
Nina richtet ihre Entwicklungsumgebung ein und baut aus dem Mockup eine erste lauffähige Webseite. Sie setzt die Startseite mit semantischem HTML, das Layout mit CSS und eine einfache Navigation mit JavaScript um. Dieser «Proof of Concept» zeigt dem Kunden früh, wie sich die Seite anfühlt, und dient dem Team zur ersten Überprüfung, ob Konzept und Technik zusammenpassen.
Nach dem Feedback des Kunden baut Nina den Prototyp zum vollständigen Webauftritt aus: Produktübersicht, Kontaktformular und Öffnungszeiten kommen dazu. Sie achtet auf lesbaren, wartbaren Code und stellt mit Responsive-Techniken sicher, dass die Seite auf Desktop und Smartphone gut aussieht. Zum Schluss prüft sie den Auftritt mit dem W3C-Validator und einer Testcheckliste gegen die Vorgaben und Richtlinien aus der Aufgabenstellung.
Die Seite ist abgenommen. Nina bringt den Webauftritt von ihrer lokalen Umgebung auf den Webserver des Kunden und veröffentlicht ihn unter der Domain der Bäckerei. Dabei berücksichtigt sie rechtliche und sicherheitstechnische Aspekte wie Urheberrecht und Persönlichkeitsschutz und kontrolliert nach dem Deployment, dass die Seite öffentlich korrekt erreichbar ist.