Relaunching ZEIT ONLINE

1.779 Aufrufe

Veröffentlicht am

Nico Brünjes' Präsentation über den Relaunch von ZEIT ONLINE im September 2009, gehalten auf dem Webkonkress Erlangen, am 7.10.2010.

Veröffentlicht in: Technologie
0 Kommentare
0 Gefällt mir
Statistik
Notizen
  • Als Erste(r) kommentieren

  • Gehören Sie zu den Ersten, denen das gefällt!

Keine Downloads
Aufrufe
Aufrufe insgesamt
1.779
Auf SlideShare
0
Aus Einbettungen
0
Anzahl an Einbettungen
32
Aktionen
Geteilt
0
Downloads
8
Kommentare
0
Gefällt mir
0
Einbettungen 0
Keine Einbettungen

Keine Notizen für die Folie

Relaunching ZEIT ONLINE

  1. 1. Relaunching ZEIT ONLINE
  2. 2. Nico Brünjes ‣ Weblog: http://codecandies.de ‣ Twitter: @nicobruenjes
  3. 3. Der Plan
  4. 4. Komplett neues Webdesign
  5. 5. Austausch wichtiger Backend-Komponenten
  6. 6. Neuer CMS-Editor für Centerpages
  7. 7. Neuer CMS-Editor für Centerpages Editor für Bildergalerien, neues Bilduploadtool…
  8. 8. Relaunch des Communitysystems
  9. 9. Einführung eines neuen Videosystems
  10. 10. Stakeholder Foto unter CC Lizenz: http://www.flickr.com/photos/pictfactory/ »Als Stakeholder wird eine natürliche oder juristische Person bezeichnet, die ein Interesse am Verlauf oder Ergebnis eines Prozesses hat.«
  11. 11. Redaktion.
  12. 12. Produktmanagement.
  13. 13. Geschäftsführung.
  14. 14. Eigentümer.
  15. 15. Technik.
  16. 16. Und natürlich Nutzer.
  17. 17. Das Team
  18. 18. Die Architektur
  19. 19. Systemarchitektur ‣ Apache Webserver als XML Document Storage ‣ Metainformationen: PostgreSQL-DB ‣ Online-Redaktionssystem: ZOPE basiert ‣ Rendering: Apache mit einem XSLT-Modul ‣ Cache-Lösung mit Varnish
  20. 20. Frontendarchitektur ‣ standardkonformes HTML (5) ‣ standardkonformes CSS ‣ jQuery
  21. 21. Phasen des Relaunches
  22. 22. Spiel-Phase Foto unter CC Lizenz: http://www.flickr.com/photos/orcaman/
  23. 23. Projekt-Projekt-Phase Foto unter CC Lizenz: http://www.flickr.com/photos/dnorman/
  24. 24. Projekt-Projekt-Phase ‣ Designentwicklung: Wordpress ‣ Featureorientierte Planung: Drupal ‣ jedes Feature gelistet ‣ Seiten als Sammlung von Features ‣ Abnahmeprozess: ‣ Feature ‣ Seite ‣ Designentwurf ‣ Umsetzung in der Entwicklungsumgebung
  25. 25. Codeentwicklung ‣ HTML, CSS und JS muss kompakt entwickelen ‣ XSL/T-Entwicklung zu langsam ‣ HTML wird als Vorlage für das XSL/T genutzt ‣ Entwicklungsumgebung »Frontdev«
  26. 26. Werkzeuge ‣ Apple-Rechner ‣ Firefox ‣ Firebug (plus Plugins) ‣ Webdeveloper Extension ‣ Selenium IDE Plugin ‣ Texteditor ‣ Espresso (http://macrabbit.com/espresso/ ‣ Textmate (http://macromates.com/) ‣ W3C Validator integriert ‣ JS Lint integriert ‣ Transmit (http://www.panic.com/transmit/) ‣ Virtual Box (http://www.virtualbox.org/)
  27. 27. Styleguides? Coding Guidelines! ‣ Styleguide für das Schreiben von HTML-Code ‣ CSS-Styleguide ‣ Coding Guidelines für Javascript
  28. 28. Umsetzungsphase Foto unter CC Lizenz: http://www.flickr.com/photos/yourdon/
  29. 29. Launch-Phase
  30. 30. Was hat gut funktioniert?
  31. 31. Agile Designentwicklung am Prototypen.
  32. 32. Zusammenfassung aller Dokumente an einem Ort.
  33. 33. Frontdev Entwicklungssystem.
  34. 34. Was hat nicht so gut funktioniert?
  35. 35. Iterationen, Iterationen, Iterationen.
  36. 36. Testen.
  37. 37. Barrierefrei ganz nebenbei?
  38. 38. Validiert? Nope. ‣ 5 Validierungsfehler: ‣ X-UA-Compatible IE=edge ‣ 2 x falsches Datumsformat ‣ IDʻs doppelt an best. Links ‣ Ist das wirklich ein Problem? ‣ Keine komplette Validität garantiert.
  39. 39. Barrierefreiheit? ‣ loosly barrierefrei ‣ CMS: alt- und title-Attribute an Bildern vorgeschrieben bei der Bildanlage ‣ Layout ist gut lesbar ‣ Links hingegen nicht so gut ‣ keine Tabellen, Framesets etc. ‣ ordentliches HTML ‣ gesunder Menschenverstand? ‣ ist zeit.de barrierefrei?
  40. 40. Zumindest haben wir einen Preis dafür bekommen.
  41. 41. Und weiter…
  42. 42. Apps für iPhone und iPad
  43. 43.
  44. 44. Und zum Schluss
  45. 45. S/W-Fotos: © Konstantin Weiss http://konnexus.net/

×