Webauthoring

Mein Verständnis von gutem Design

Von mir konzipierte und umgesetzte Websites zeichnen sich durch ihre klare Form und Strukturiertheit aus. Ich möchte Web-Auftritte so gestalten, wie ich sie mir auch als Nutzer wünsche:

• Ich möchte schnell einen Überblick über den Aufbau einer Website bekommen, d.h. ich brauche eine klare und als solche erkennbare Navigationsstruktur.
• Ich möchte meinen Browser so eingestellt nutzen können, wie ich das für sinnvoll halte. Eine Website soll sich an meine Gewohnheiten anpassen.
• Ich möchte nicht zwanzig unnötige Plug-Ins installieren müssen, um einen einfachen Text lesen zu können.

Dies erreiche ich unter anderem dadurch, dass ich mich an Standards im HTML und CSS halte (auch wenn diese nicht immer von allen Browsern korrekt umgesetzt werden), die Seiten weitestgehend in reinem HTML halte (d.h. kein Javascript, keine Flash-Animation etc. verwende, wenn sich die gleichen Effekte auch in HTML erzielen lassen). Meine Websites teste ich auf unterschiedlichen Browsern, ohne sie für einen bestimmten zu »optimieren«. Eine Website soll auch von Menschen mit Behinderung oder in reinen Text-Browsern lesbar, also barrierefrei sein.

Natürlich darf eine Website auch verspielt wirken und faszinierende graphische Effekte zeigen – wenn dies zu ihrem Inhalt passt. Ihre Nutzbarkeit darf dadurch jedoch nicht behindert werden.

Von mir verwirklichte Internetpräsenzen

In den letzten Jahren habe ich die nachfolgend vorgestellten Internetpräsenzen entwickelt und umgesetzt. Die Seiten sind in validem HTML unter Verwendung von CSS (Cascading Style Sheets) geschrieben.

»I-for-kids«

http://i4kids.uni-bamberg.de (derzeit noch nicht online)

Konzeption – Design – Umsetzung
Mai 2010 (in Arbeit!)

Designpaket: Logo, Website

Im Grund- und Vorschulprogramm »I-for-kids« der Universität Bamberg, Fakultät Wirtschaftsinformatik und Angewandte Informatik (WIAI) werden Kinder spielerisch an den Computer und seine Funktionsweise herangeführt. Sie erlangen dadurch mehr als Handlungswissen sondern entwickelt strukturelles Verständnis.

»Freak-IT – was die Welt am Laufen hält«

http://freak-it.uni-bamberg.de

Konzeption – Design – Umsetzung
August 2009

Designpaket: Logo, Flyer,Plakat, Mini-Handout, Website

Mit Freak-IT ermöglicht die Fakultät Wirtschaftsinformatik und Angewandte Informatik der Universität Bamberg in praktischen Workshops hands-on-Erfahrungen mit informatischen Fragestellungen und Anwendungsfeldern. Oberstufenschüler in der beruflichen Entscheidungsphase (Gymnasien, FOS, BOS ab elfter Jahrgang) können die Informatik als ein spannendes Aufgabenfeld entdecken, Vorurteile abbauen und sich durch die positive Erfahrung möglicherweise für ein Studium an der Universität Bamberg entscheiden.

getestet auf Mozilla Firefox 3.0, Internet Explorer 6.0, Lynx 2.8 (Textbrowser)

Informatik-Kindergarten

http://inki.uni-bamberg.de

Konzeption – Design – Umsetzung
Juli 2009

Designpaket: Logo, Website

Da viele Kinder bereits früh über ihr familiäres Umfeld Kontakt mit Computern haben und oft das Malen am Computer besonders faszinierend finden, bietet die Universität Bamberg einen Bildbearbeitungsworkshop an. Gruppen bis zu acht Vorschulkinder arbeiten mit professionellen Programmen aus dem universitären Alltag und entwickeln dabei informatisches Grundverständnis.

getestet auf Mozilla Firefox 3.0, Internet Explorer 6.0, Lynx 2.8 (Textbrowser)

Sabine Wild: »Malerei im Stil der romantischen Sachlichkeit«

http://www.sabinewild.de/

Konzeption – Design (in Kooperation mit der Künstlerin) – Umsetzung
März 2008

Website der Künstlerin Sabine Wild: Malerei im Stil der romantischen Sachlichkeit

getestet auf Mozilla Firefox 2.0, Internet Explorer 6.0, Links 2 (Textbrowser)

»girls@WIAI« an der Universität Bamberg

http://girls.wiai.uni-bamberg.de/

Konzeption – Design – Umsetzung
März 2007 bzw. Februar 2008

Designpaket: Handout (Girls'Day), Website

Website zu den Aktivitäten der Frauenbeauftragten der Fakultät Wirtschaftsinformatik und Angewandte Informatik der Universität Bamberg.
Ausführliche Darstellung des WIAI-»Girls'Days« (jährlicher Mädchen-Zukunftstag).

getestet auf Mozilla Firefox 2.0, Internet Explorer 6.0, Lynx 2.8 (Textbrowser)

MUT Bamberg: »Auf die Plätze – Technik – los!«

http://mut.uni-bamberg.de

Analyse der alten Webpräsenz
Neukonzeption – Design – Umsetzung
September 2006

Designpaket: Flyer, Poster, Handout, Website

Website zu den Mädchen-Workshoptagen »Auf die Plätze – Technik – los« an der Universität Bamberg (jährlich stattfindende dreitägige Veranstaltung in den Herbstferien).

getestet auf Mozilla Firefox 1.0, Internet Explorer 6.0, Lynx 2.8 (Textbrowser)

Kunsthalle Göppingen

http://www.kunsthalle-goeppingen.de

Seit 2009 nicht mehr online. So sah die Seite 2006 aus.

Analyse der alten Webpräsenz
Konzept – Design – Umsetzung
September 2006

Die Website stellt das Haus und seine wechselnden Ausstellungen vor. Mit Ausstellungsübersicht und Publikationsverzeichnis (verlinkt).

getestet auf Mozilla Firefox 1.0, Internet Explorer 6.0, Lynx 2.8 (Textbrowser)

Multimediaprojekt »Im Reich des Halali«

http://halal.istik.de

Konzept – Design – Umsetzung
Juni 2006

Die Website einer Gruppe von Neuntklässlern setzt sich in einer durch Anim-Gifs teilanimierten Fotostory mit der Rauminstallation »Halali« der Künstlerin Sonja Alhäuser auseinander. Ausführliche Infos zur Kunst und zum Projekt runden die Site ab.

getestet auf Mozilla Firefox 1.0, Internet Explorer 6.0, Lynx 2.8 (Textbrowser)

Idealistik – die Heimatseiten von Sanne Grabisch

http://ideal.istik.de/

Konzept – Design – Umsetzung – Inhalt
Januar 2004
März 2007 (Überarbeitung)
steter Ausbau

Meine Heimatseiten mit Hintergründen zu meiner Person, meinen Berufsfeldern Kultur- und insbesondere Medienpädagogik, Webauthoring, Design und Illustration, eigener Kunst und eigenen Comics, sowie mit Texten, Aufsätzen und wissenschaftlichen Arbeiten.

getestet auf Mozilla Firefox 1.0, Internet Explorer 6.0, Lynx 2.8 (Textbrowser)

Templates

Ein Template bestimmt das Aussehen der Inhalte die auf einer Website erscheinen sollen, es legt sowohl die Struktur fest (wo sich welche Inhalte und welche Bedienelemente finden) als auch das Layout, also Farben, Bildgestaltung etc.

Absolventenverein »ab.hier.kultur«

http://www.abhierkultur.de/

Konzeption – Design
September 2008

Entwicklung eines Templates für das Content-Management-System Joomla.
Das Design greift den Gestaltungsansatz des Logos auf und vertieft so den Netzwerkgedanken.

getestet auf Mozilla Firefox 2.0, Internet Explorer 6.0

Inductive Programming Community

http://www.inductive-programming.org/

Layout (Erweiterung bzw. Umschreibung des bestehenden CSS)
März 2008

Designpaket: Logo, Anpassung der bestehenden Website, neuer Website-Header

Entwicklung eines Layouts aufbauend auf einem YAML-Framework.
Der Kopfbereich der Website und das ebenfalls von mir entworfene Logo illustrieren den Ansatz der induktiven Programmierung.

getestet auf Mozilla Firefox 2.0, Internet Explorer 6.0

Kleine Projekte (Einseitige Website)

Wenn alles, was zu sagen ist, auf eine Seite passt, dann sollte man es auch so umsetzen...

Nachwuchsaktivitäten der Fakultät Wirtschaftsinformatik und Angewandte Informatik (WIAI) der Uni Bamberg

http://nachwuchs.wiai.uni-bamberg.de (derzeit noch nicht online)

Konzeption – Design – Umsetzung
Mai 2010 (in Arbeit!)

Designpaket: Logo, Handout, Website

Förderverein »Chronisch krankes Kind«

http://www.chronisch-krankes-kind.de

Konzeption – Design – Umsetzung
Juni 2008 (seit Januar 2009 online)

Designpaket: Logo, Flyer, Website

Website auf Grundlage des Flyers des Fördervereins »Chronisch krankes Kind« unter Einbindung des Logos.

getestet auf Mozilla Firefox 3.0, Internet Explorer 6.0, Lynx 2.8 (Textbrowser)