Girls’Day 2012

Vernetzt arbeiten – Technik, Anwendung und Gestaltung

26. April 2012 – Girls’Day im Netti 2.0 in Steglitz. Auch in diesem Jahr stellen vier Frauen aus dem Business-Netzwerk webgrrls e.V. ihre Berufsbilder aus Fotografie, Webdesign, Webentwicklung und Programmierung vor. Wie auch im Vorjahr waren alle 12 Plätze sehr schnell ausgebucht. Es sind dann 11 Mädchen zwischen 12 und 14 Jahren aus Berlin Charlottenburg, Schöneberg, Steglitz und Kreuzberg, die sich im Netti 2.0 einfinden. Pünktlich um 9 Uhr sitzen sie an den PC-Plätzen und sehen uns erwartungsvoll an.

Fotosession am Girslday 2012

Hier wird bei der Fotosession eines der später ausgewählten Headerbilder komponiert und fotografiert.

Weil die Verbindung zum Beamer nicht sofort hergestellt werden kann, wird flexibel umdisponiert. Wir ziehen die Fotosession vor. Eine gute Entscheidung, wie sich herausstellt, denn die Schülerinnen haben großen Spaß, stellen mit Fotozubehör ihre Vorstellungen vom Thema Girls’Day zusammen und fotografieren nach Herzenlust unter Anleitung von C. Paulussen.
Später werden die entstandenen Bilder gemeinsam ausgewertet, drei Headerbilder demokratisch ausgewählt. Wie ein Foto mit professioneller Bildbearbeitung perfektioniert werden kann, wird an den ausgewählten Motiven anschaulich vorgeführt. Der Beamer ist nun angeschlossen und die Schülerinnen können die Arbeit verfolgen.

Gestaltungsbeispiel einer Webseite

Gestaltungsbeispiel einer einfachen Webseite

Nach der wohlverdienten Pause geht es weiter mit einem Ausflug in die Konzeption und Gestaltung einer Webseite, Letzteres mit Hilfe des freien Bildbearbeitungsprogrammes Gimp. A. Bischoff demonstriert an zwei Online-Beispielen die unterschiedlichen Anforderungen an Websites und den daraus resultierenden Gestaltungsaufwand.
An einer vorbereiteten Gimp-Datei zeigt sie verschiedene Möglichkeiten der Farbgebung in einem Layout (Bild links). Die meisten professionellen Webdesigner arbeiten mit dem Programm Photoshop. Viele Schulen nutzen das freie Programm Gimp für die Bildbearbeitung. Dieser Umstand bewog uns, für diesen Workshop auf Gimp umzusatteln. Gimp bietet eine Reihe nützlicher Funktionen, erfüllt jedoch nicht die Anforderungen eines Designers 🙁 Mit etwas Übung reicht es aber alle Male, um sich auszuprobieren und einfache Layouts umzusetzen. Weiterführende Links zu allen von uns vorgestellten Programmen gibt es am Ende dieses kleinen Berichtes.

Im letzten Teil unserer Girls’Day Workshop-Reihe geht es darum, ein Gefühl für die Seitenbeschreibungssprache HTML zu bekommen sowie für den Einsatz und die Wirkungsweise von PHP-Code. Durch diesen Block führen I. Pilarek und K. Schönherr. Gemeinsam schreiben wir eine minimalistische HTML-Webseite im Editor. Leider reicht am Ende die Zeit nicht mehr, um in eine vorbereitete WepYep-Seite beispielhaft PHP-Code einzufügen und im Browser zu prüfen. Wir müssen uns damit begnügen, unser Onlinebeispiel auf webyep.webgrrls-berlin.de vorzuführen.

Während am Ende des Tages einige Schülerinnen pünktlich abgeholt werden, hauen andere noch unbeirrt in die Tasten und modifizieren ihren HTML-Quellcode.
Kein Problem, wenn die eine oder andere nicht alles notieren konnte. Auf dem Stick, den jedes Mädchen erhielt, sind sämtliche Dateien zum Nachbauen vorhanden, einschließlich des Content-Management-Systems WebYep mit Beispielseite.

Wir hoffen, dass alle Schülerinnen einen kurzweiligen und informativen Girls’Day hatten und wir die Lust an einer Tätigkeit im Bereich digitale Medien wecken konnten.
Abschließend gibt es auch hier noch einmal eine Zusammenfassung aller Links, die Euch nützlich sein können, wenn Ihr das eine oder andere ausprobieren wollt:

Programme, die wir nutzten, zum kostenfreien Download:

Logo Gimp Gimp: Bildbearbeitung und -gestaltung:
http://www.gimp.org/downloads/

Logo Nodepad++ Notepad++: Editor für Websprachen und Programmierung
http://notepade-plus-plus.org/download/

Logo CMS WebYep

WebYep: das feine kleine Web-Content-Management-System
http://www.obdev.at/products/webyep/download-de.html

Logo WordPress WordPress: Weblog-System
http://wpde.org/download/

Logo XAMPP XAMPP: virtuelle Server-Software, ohne die PHP auf dem heimischen Computer nicht ausgeführt werden kann
http://www.apachefriends.org/de/xampp-windows.html

Weiterführende Links:

HTML: Sprache zum Erstellen von statischen Webseiten
http://de.selfhtml.org/

CSS: Sprache zum Erstellen von Stylesheets für HTML
http://de.selfhtml.org/css/intro.htm

PHP Logo PHP: Sprache zum Anreichern der Webseite mit dynamisch erzeugten Inhalten
http://www.php.net

Logo XAMPP XAMPP: System bestehend aus dem Webserver Apache, der Datenbank MySQL, PHP und Pearl
http://de.wikipedia.org/wiki/XAMPP


Hier gehts zum Blogbeitrag: Aufruf zum Girlsday 2012 und Unser Vorbereitungstreffen für den Girlsday 2012

Schreibe einen Kommentar

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