Direkt zum Inhalt

Was braucht es, um Webseiten zu codieren und marketinggerecht zu erstellen?

Handlungskompetenzorientierung ist am BWZ kein leeres Wort: In einem Projekt erstellten Lernende einen Webauftritt für einen fiktiven Kunden.

05-05-2022
Webseitenprojekt
Codieren eine Webseite (von links nach rechts): Mira Selimovic, Carmen Keist, Michelle Holdener und Nicole Dinisoara mit Kursleiter Pius Senn.

Der Kunde wünscht einen Webauftritt, um die Ferienregion Obersee zu vermarkten – Zeitdruck inklusive. In knapp zwei Tagen muss der erste Entwurf stehen. So lautete der Auftrag, den kaufmännische Lernende der BM an den Projekttagen in den letzten zwei Wochen bekamen. «Webseiten marketinggerecht zu texten, Bilder hochzuladen oder die Inhalte eines Internetauftritts anzupassen, gehört heute zum kaufmännischen Alltag – entsprechend werden die nötigen Skills später im Beruf erwartet», weiss Pius Senn, Leiter dieses Moduls und IT-Ausbilder am BWZ, aus seiner mehrjährigen Berufspraxis. Dass der Kursleiter damit den Nagel auf den Kopf trifft, zeigte sich schnell: Einige Lernende mussten bereits in ihren Betrieben kleinere Arbeiten an den Webauftritten vornehmen. «Darum führen wir jeweils im zweiten Lehrjahr diese Projekttage durch. Trainiert wird das Anpassen und einfache Codieren von Webseiten sowie das Vernetzen mit Marketingaspekten», sagt Pius Senn. Er sei sich bewusst, dass Firmen verschiedene Programme zur Webseitenadministration einsetzen. «Ein Grundverständnis - wie es an diesen Projekttagen erarbeitet wird - hilft, mit verschiedenen Softwareprodukten zurecht zu kommen.»

HTML-Code h1 oder h2?

Auch mit Vorwissen ist eine Webseitencodierung nicht ganz einfach, wie sich kurz nach dem Einstieg in die Projekttage zeigte. «Die Office-Kompetenzen waren dank der kaufmännischen Grundausbildung gross. Hingegen die Codes für eine Webseite hatte niemand gekannt», bilanziert der Kursleiter und erklärt an einem Beispiel: «In Word lassen sich Überschriften mit wenigen Klicks zuweisen. Bei der Codierung einer Webseite muss man wissen, dass – stark vereinfacht gesagt – h1 für den Seitentitel und h2 für die Untertitel steht. Das Einhalten dieser Hierarchie ist wichtig für die Suchmaschinenregistrierung und die Barrierefreiheit.» Für die Lernenden sei es zudem ungewohnt, dass sie in einem Fenster den Code schreiben, das Resultat jedoch nicht direkt, sondern erst nach dem Aktualisieren im Browser sehen. Damit kämpften auch die Lernenden Carmen Keist, Michelle Holdener, Mira Selimovic und Nicole Dinisoara. In der ungewohnten Codierumgebung hätten sie sich aber schnell zurecht gefunden, da die Einführung in das Thema sehr gut gemacht gewesen sei, wie Mira Selimovic sagt und Carmen Keist ergänzt: «Uns wurde eine Webseite zur Verfügung gestellt, auf der wir die vorgezeigten Schritte nacharbeiten konnten. Dadurch haben wir das Prinzip schnell verstanden.» Pius Senn betont, dass diese Einführung wichtig für den klaren Aufbau des Projektes gewesen ist: «Nach den ersten, einfachen Codierungsschritten an der Musterwebseite mussten die Lernenden ein Konzept erstellen und sich dabei klar werden, was sie wo und wie auf ihren Webauftritt bringen wollten. Dabei mussten sie auch Kommunikationsaspekte berücksichtigen», sagt er und fügt schmunzelnd hinzu: «Oft griffen die «Digital Natives» dafür zu unserem Erstaunen zu Papier und Bleistift, obwohl es auch erlaubt gewesen wäre, digitale Tools zu verwenden.»

Zeitdruck problemlos gemeistert

In 4er-Gruppen teilten sich die Lernenden die Arbeit jeweils gemäss dem Projektauftrag auf. Zwei Personen kümmerten sich um die Inhalte und deren Strukturierung, welche sie mittels HTML-Codierung umsetzten, während zwei andere die Webseite mittels CSS gestalteten. «Die Teamarbeit gehört bewusst zum Projekt – wie in der Praxis muss man herausfinden, wie man am effizientesten und konfliktfreisten zusammenarbeitet», sagt Pius Senn. Auch den Zeitdruck managten die Lernenden aus der Klasse ähnlich wie die Gruppe um Carmen Keist problemlos: «Wir haben am Anfang die Inhalte recherchiert und uns entschieden, unter anderem das Alpamare, den Kinderzoo und gute Restaurants zu bewerben», blickt sie zurück, «dadurch konnten wir in der ersten Woche alle Vorarbeiten abschliessen und mussten in der zweiten nur noch das Layout umsetzen.» Gefragt, ob sie denn als kaufmännische Berufsfachleute tatsächlich Webseiten codieren werden, sagt Michelle Holdener lachend: «Codieren werden? Die Anfragen kommen jetzt schon. Kaum hatte ich in meinem Verein vom Projekt erzählt, wurde ich schon gebeten, diesen Job zu übernehmen – und ich bin sicher, dass das nicht die letzte Anfrage gewesen sein wird.»