29
Vorstellung des QQ2-Projektes Alexander Betker, Marko Flod, Alex Maier, Gregor Biering Überarbeitung der Webseite Kita Alter Gutshof

Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

  • Upload
    others

  • View
    1

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Vorstellung des QQ2-Projektes

Alexander Betker, Marko Flod, Alex Maier, Gregor Biering

Überarbeitung der Webseite Kita Alter Gutshof

Page 2: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Wer?

Alexander Betker, AI – JavaScript, Inhalte

Marko Flod, AI – Design, Inhalte

Gregor Biering, AI – Joomla, PHP

Betreut durch Alex Maier

Page 3: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

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

Page 4: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Ausgangssituation

Page 5: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Ausgangssituation

Framebasierter Aufbau

Page 6: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Ausgangssituation

Lange Textpassagen zwingen zum scrollen

Page 7: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Die Aufgabe

Überarbeiten der Webseite der

Kindertagesstätte „Alter Gutshof“

• Neues Design

• Neue Struktur

• Neue Funktionalitäten

• Administrierbar durch Kita-Personal

Page 8: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

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.

Page 9: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Wie?

• Kita Webseite ist kein Nachrichtenportal!

• Mischung aus festen und dynamischen Informationen musste gefunden werden

• Das Mittel zum Zweck derzeit ein CMS.

Page 10: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

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

Page 11: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

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

Page 12: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Joomla

Page 13: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Warum Joomla?

• OpenSource-Produkt

• Das System kann von Dritten weiterentwickelt bzw. angepasst werden

• Fertige Komponenten, Module und Plugins

Page 14: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Neue Struktur

Statische Inhalte• Startseite• Betreuungsangebote• Das Gutshofteam

– Team– Vorstand

• Konzept• Presse• Impressum• Links• Kontakt

Page 15: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Neue Struktur

Dynamische Inhalte

• Aktuelles / Termine & Archiv

– Veranstaltungsliste

• Sandkasten - Die Stimme der Kinder

– Blog

• Tagebuch

– Blog

• Galerie

– Bildergalerie

Page 16: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Realisierung

Realisierung der dynamischen Inhalte

• Aktuelles / Termine & Archiv

– Simpleevents-Komponente

• Sandkasten - Die Stimme der Kinder

– Content-Komponente

• Tagebuch

– Content-Komponente

• Galerie

– PhocaGallery

Page 17: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Das Design-Konzept

Page 18: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

1. Version

Page 19: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

2. Version

Page 20: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

3. Version

Page 21: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Finale Version

Page 22: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Finale Version

Page 23: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Finale Version

Page 24: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Finale Version

Page 25: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Finale Version

Page 26: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Finale Version

Page 27: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

Finale Version

• Mit Lightbox-Effekten wurde die Struktur flach gehalten

• Pflege über WYSIWYG-Editoren möglich

– Frontend & Backend

• Anpassung der Inhalte

Page 28: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

„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.

Page 29: Vorstellung des QQ2-Projektes · 2012. 3. 19. · mit dem Model-View-Controller-Entwurfsprinzip • Suchmaschinenoptimierung –Joomla kann menschen- und maschinenlesbare URLs (zum

„Auslieferung“