Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip •...

Vorstellung des QQ2-Projektes

Alexander Betker, Marko Flod, Alex Maier, Gregor Biering

Überarbeitung der Webseite Kita Alter Gutshof

Wer?

Alexander Betker, AI – JavaScript, Inhalte

Marko Flod, AI – Design, Inhalte

Gregor Biering, AI – Joomla, PHP

Betreut durch Alex Maier

Ausgangssituation

Einige Probleme der alten Webseite

• Framebasierter Aufbau

• statische Webseite

- HTML und CSS Kenntnisse erforderlich bei der Pflege

• Durch lange Texte muss viel gescrollt werden

• Veraltete Inhalte

Ausgangssituation

Ausgangssituation

Framebasierter Aufbau

Ausgangssituation

Lange Textpassagen zwingen zum scrollen

Die Aufgabe

Überarbeiten der Webseite der

Kindertagesstätte „Alter Gutshof“

• Neues Design

• Neue Struktur

• Neue Funktionalitäten

• Administrierbar durch Kita-Personal

Warum?

• Techniken entwickeln sich weiter

• Webseiten sind nicht länger Visitenkarten, welche einen kurzen Eindruck über den Träger vermitteln

• sondern sollen laufend aktuell sein und informieren. -> Kommunikationsplattform zwischen Träger und Nutzer

• Design wurde im Bezug auf die Gebrauchstauglichkeit angepasst.

Wie?

• Kita Webseite ist kein Nachrichtenportal!

• Mischung aus festen und dynamischen Informationen musste gefunden werden

• Das Mittel zum Zweck derzeit ein CMS.

Exkurs CMS

• Content-Managment-System bieten dem Benutzer die Möglichkeit schnell und unkompliziert Inhalte zu veröffentlichen.

• Unterstützen beim Verwalten der Informationen.

• Ausmaßund Funktionalität variieren zwischen den Systemen.

• Um ein paar zu nennen: TYPO3, Drupal, Wordpress

Joomla

Ausgewählte Eigenschaften• Strikte Trennung von Layout/Design und funktionalem Quelltext

mit dem Model-View-Controller-Entwurfsprinzip• Suchmaschinenoptimierung – Joomla kann menschen- und

maschinenlesbare URLs (zum Beispiel für Suchmaschinen) erzeugen

• Eingebaute Volltext-Suchfunktion• Eingebaute Caching-Mechanismen sorgen für gute Performance• Zahlreiche Templates ermöglichen weitgehende Anpassung des

Layouts• Spracheinstellungen (auch mehrsprachige Sites) mit Hilfe von

Lokalisierungsdaten• Integration von Ajax-Features mit dem JavaScript-Framework

MooTools

Joomla

Warum Joomla?

• OpenSource-Produkt

• Das System kann von Dritten weiterentwickelt bzw. angepasst werden

• Fertige Komponenten, Module und Plugins

Neue Struktur

Statische Inhalte• Startseite• Betreuungsangebote• Das Gutshofteam

– Team– Vorstand

• Konzept• Presse• Impressum• Links• Kontakt

Neue Struktur

Dynamische Inhalte

• Aktuelles / Termine & Archiv

– Veranstaltungsliste

• Sandkasten - Die Stimme der Kinder

– Blog

• Tagebuch

– Blog

• Galerie

– Bildergalerie

Realisierung

Realisierung der dynamischen Inhalte

• Aktuelles / Termine & Archiv

– Simpleevents-Komponente

• Sandkasten - Die Stimme der Kinder

– Content-Komponente

• Tagebuch

– Content-Komponente

• Galerie

– PhocaGallery

Das Design-Konzept

1. Version

2. Version

3. Version

Finale Version

Finale Version

Finale Version

Finale Version

Finale Version

Finale Version

Finale Version

• Mit Lightbox-Effekten wurde die Struktur flach gehalten

• Pflege über WYSIWYG-Editoren möglich

– Frontend & Backend

• Anpassung der Inhalte

„Auslieferung“

Es wurde eine Systemdokumentation und eine

Anleitung zur Pflege der Webseite erstellt.

Zusätzlich haben wir mehrere Videotutorials

angefertigt, welche auf der Anleitung basieren.

„Auslieferung“