Produktion Website ist fertig

elisabeth.kaar.uni-linz, 29. Februar 2012, 20:13

Auch die Webgruppe hat jetzt alle Änderungen abgeschlossen.

Hier nochmal der Link, unter dem sie erreichbar ist: http://qstreaming.idv.edu:8080/pim/nelson/

Folgende Änderungen wurden nach der Besprechung am 17.02.2012 noch durchgeführt:

 

Generelle Änderungen:

Navigation farblich umgekehrt: dort, wo man sich befindet ist die Schrift hell, alle anderen Menüpunkte sind in schwarzer Schrift.

Headlines auf den Folgeseiten verkleinert (die Größe der Headlines ist so gewählt, dass sich die längste Headline „Ted about Transcopyright“ noch neben das Bild ausgeht)

 

Die Schriftgröße der Headline auf der Startseite wurde beibehalten. Wir haben probiert, die Headline auch auf die selbe Schriftgröße wie die restlichen Seiten zu setzen, jedoch ist die Headline um einiges kürzer als der Rest und würde somit nicht gut aussehen. Da die Website ausschließlich um „Ted Nelson“ geht, haben wir uns entschieden, dass sein Name auf der Startseite ruhig etwas größer sein darf.

Der Footer wurde textlich nochmal nach Rücksprache mit Prof. Mittendorfer geändert.

 

Seite Who am I:

Einarbeitung der neuen Zitate von Ralf

Foto Ted Nelson kleiner und nach rechts gerückt, damit mehr Platz für Zitate ist.

Auch hier wurde die Google Font eingebettet und die gleiche Schriftart verwendet, die auch auf den anderen Seiten für die Zitate verwendet wird.

 

Seite Xanadu:

Neue Headline -> Ted about Xanadu

Bild im Header neu positioniert (Das Bild ist nun an der exakt selben Position wie bei die Seiten Transcopyright und Steve Jobs)

Das Zitat ist nun kein Bild mehr, sondern es wurde eine Google Font eingebettet.

 

Seite Transcopyright:

Neue Headline -> Ted about Transcopyright

Bild im Header neu positioniert (Das Bild ist nun an der exakt selben Position wie bei die Seiten Xanadu und Steve Jobs)

Das Zitat ist nun kein Bild mehr, sondern es wurde eine Google Font eingebettet.

 

Seite Steve Jobs:

Neue Headline -> Ted about Steve Jobs

Bild im Header neu positioniert (Das Bild ist nun an der exakt selben Position wie bei die Seiten Transcopyright und Xanadu)

Das Zitat ist nun kein Bild mehr, sondern es wurde eine Google Font eingebettet.

 

Sonstige Anmerkungen: 

Die Kompatibilitätsprüfung wurde durchgeführt, die gesamten Titelseiten (Headlines) der Webvideos nochmals überarbeitet und die Videos nochmals gesichtet, um die Zitate für die erste Seite zu finden. (Die Einzelheiten dazu finden sich in den jeweiligen Blogbeiträgen der Gruppenmitglieder, die das gemacht haben)

Somit ist die Website aus meiner Sicht fertig. Bitte noch eure Kommentare, falls ihr noch welche habt. Ansonsten würde ich die Website als zur Benotung freigegeben betracheten und Prof. Mittendorfer um seine Beurteilung bitten.

Vielen Dank für die hervorragende Zusammenarbeit!

10 comments :: Kommentieren

Fragen zur abgegebenen Version

Hans.Mittendorfer.Uni-Linz, 29. Februar 2012, 21:03

Desing:

  1. Wozu der scharze Balken oben?
  2. und warum schwenkt bei Xanadu die Kamera links und rechts ins "Schwarze?"
  3. Wird die Quellenangabe nicht dem Video zugeordnet? Ich dachte wir vereinbarten eine andere Form des Zitierens.
  4. Warum muss es eine Liste der Aussagen sein, die dann zum scrollen führt?

Inhalt:

  1. Wäre es nicht besser, den Videos eine Aussage aus dem Video als Text-Überschrift zu geben, das es sich um eine Video-Website handelt, die selber keine textuellen Aussagen macht, sondern strukturiert und eben Überschriften enthält.
  2. Impressum ist nicht der richtige Ausdruck für das, was daneben steht. Wenn, dann sollte der Text in etwas so lauten: "Diese Website wurde im Rahmen der Lehrveranstaltung "Produktion Interaktiver Medien" im Wintersemester 2011 am Institut für Datenverarbeitung, Johannes Kepler Universität, Linz erstellt. Es handelt sich um ein Projekt zu Übungszwecken, für den Inhalt wird keinerlei Haftung übernommen.

HTML5 und CSS Codierung:

  1. außer "div" keine strukturierenden Tags (section, nav, article, ?)
  2. CSS: ist border color notwendig, wenn border-left, border-rigt definiert ist?
  3. head: wo ist definiert, dass es sich um ein HTMl-5 Dokument handelt. Was besagt in diesem Fall die Validierung?
  4. Warum im body-tag die Hintergrundfarbe definieren?
  5. wozu der "Wrapper-div" mit der id=index?
  6. Warum mehrfach idente Styles:
    #footer_ {
        border0 none;
        height40px;
        left0;
        positionabsolute;
        top728px;
        width1024px;
    }
    #footer-tednelson_ {
        border0 none;
        height40px;
        left0;
        positionabsolute;
        top728px;
        width1024px;

Verlinken :: Kommentieren

ralf.mittmannsgruber2.uni-linz, 1. März 2012, 10:26

Zu Punkt drei kann ich Ihnen folgendes sagen: Bei einer Seite die mit HTML 5 erstellt wurde, ist die Definition so wie wir sie verwendet haben. Dazu können sie folgende Seite nachschlagen: http://www.w3schools.com/html5/tag_doctype.asp

 

Es muss nicht mehr definiert werden, dass es sich um HTML 5 handelt. Die Validierung der Website ist komplett fehlerfrei. Es gibt auch keine Warnungen.

 

Zu Punkt 2: Die Validierung hat uns zu dieser Vorgehensweise gezwungen, anfangs haben wir gewisse bereiche nicht definiert gehabt und deshalb hatten wir einen Fehler bei der Validierung. Mit einfügen der weiteren Definitionen war die Validierung dann fehlerfrei. Selbes gilt für Punkt 6.

 

Ich hoffe das meine Kollegen Ihnen bei den anderen Punkten weiterhelfen können. Was aber die Validierung betrifft, haben wir die oben genannten Punkte so machen müssen, da ansonsten Fehler bzw. Warnungen erzeugt wurden.

Verlinken :: Kommentieren

HTML5 ist leider (noch) kein Standard

Hans.Mittendorfer.Uni-Linz, 1. März 2012, 11:13

es gibt unterschiedliche Meinungen zur DOCTYPE Deklaration. Ich kann nicht abschätzen, wie alle möglichen Browser reagieren (parsen) wenn die Deklaration, wie Sie es vorschlagen, weggelassen wird. Ein Versuch mit XHTML5 wäre auf alle Fälle interessant, da in diesem Falle die strengeren Regeln von XML angewendet werden. Mal sehen, was dann die Validatoren sagen.

Es gibt übrigens auch eine dahingehende Empfehlung.

Dass die übrigen Punkte von den Validatoren nicht angezeigt werden, kann am Doctype liegen, ist mir aber unverständlich, weil es ja keine Gründe gibt derartige Redundanzen in den Conde einzubauen, außer die Bemerkung: "das hat Dreamweaver so gemacht". In diesem Falle kann aber leicht manuell in den Code eingegriffen werden.

Verlinken :: Kommentieren

Design Pkt.1 u. 2

franz.muehleder.uni-linz, 1. März 2012, 21:56

In Rücksprache mit den Kollegen haben wir die Videoauflösung auf 480x270 und 480x360 geändert.

Verlinken :: Kommentieren

Feedback zur Website

bettina.kollegger.uni-linz, 1. März 2012, 09:57

Eure selbständige Aufteilung und kooperative Zusammenarbeit im Team, fand ich sehr gut. Die Struktur zusammen mit den neuen Überschriften ist jetzt stimmig. Gut gefällt mir auch, dass sich die Bilder passend zum Thema im Header ändern. Von den Videos sind mit Abstand diejenigen über Steve Jobs am besten gewählt, kurz und prägnant.

 

Verbesserungsvorschläge von meiner Seite:

  • So wie die Website jetzt konzipiert ist, passt sie nur für wenig Inhalte. Wenn jetzt trotzdem mehr Zitate gewünscht sind, gibt es Möglichkeiten diese zum Design passend zu positionieren. 
     
  • Eine Variante wäre zum Beispiel, die Zitate inhaltlich zu gruppieren, oder wenn das inhaltlich schwierig ist, könnt ihr auch nach formalen Richtlinien zusammengehörige Blöcke finden (z.B. ein Block mit kürzeren Zitaten, ein weiterer mit weniger aber dafür längere Sätze…). Wenn die Zitate dann erstmal geclustert sind, könnte zB mithilfe von Vor- und Zurückbuttons innerhalb der Startseite weitergeblättert werden. 
     
  • Was wir vereinbart haben und noch fehlt, ist die Website zu zentrieren. 
     
  • Noch etwas würde den Gesamteindruck steigern: Bei der jetzigen Version sehen sich die User als erstes das Xanadu-Video an, was ich vergleichsweise am wenigsten mitreißend finde. Bei einem Tafelschwenk, kombiniert mit einer Stimme aus dem Hintergrund erwartet sich der Zuseher/die Zuseherin permanent, dass bald die Person zur Stimme im Bild ist. Ein Lösungsansatz dazu wäre entweder generell die Stimme rauszuschmeißen und eine Musikuntermalung zu machen, oder den Sprecher (Nelson) einmal einzublenden. Eine komplett andere Lösung wäre das Xanadu-Video ganz rauszuschmeißen und stattdessen das Video der Videogruppe zu nehmen, das im Vergleich dazu einen guten Ersteindruck vermitteln würde.

 

Verlinken :: Kommentieren

Zentrierung der Website

elisabeth.hummer.uni-linz, 6. März 2012, 05:01

Wer von den CSS-Spezialisten kann sich noch des Problemes der Zentrierung annehmen? Bitte um Rückmeldung bzw. Durchführung.

Danke

Verlinken :: Kommentieren

Was soll erreicht werden?

Hans.Mittendorfer.Uni-Linz, 6. März 2012, 11:12

Mir ist aufgefallen, dass im HTML-Code ein "DIV" Tag existiert, der alle anderen "DIVS" umrahmt. Üblicher Weise werden diese DIVS "Wrapper" (Einpacker) genannt und sie dienen oftmals der Zentrierung des gesamten Inhalts. Eigentlich ist dies eine höchst unsemantischer Trick der Webdesigner, denn der Wrapper-DIV dient allein der Darstellung und trägt nichts zur Semantik (z.B. Gliederung der Inhalte in Sinnabschnitte) ein.

Verlinken :: Kommentieren

Das zentrieren der Website werde ich übernehmen

franz.muehleder.uni-linz, 6. März 2012, 15:36

und am Abend durchführen. Ich werde dazu - wie durch den Hrn. Professor beschrieben - eine DIV mit dem Namen "container" um den ganzen body (schon innerhalb ;)) legen und dafür margin:0 auto; setzen. Ich werde dazu das css offline genauer ansehen, weil eine ad-hoc Lösung online nicht funktioniert hat.

Verlinken :: Kommentieren

Dank

elisabeth.hummer.uni-linz, 2. März 2012, 17:06

an die Mitglieder der Web-Gruppe für die tolle Arbeit. Ich bitte die Kollegen Stefan und Philipp sich der offenen Punkte noch anzunehmen und um Dokumentierung der Schritte im Blog. Ich hoffe, ihr seid damit einverstanden.

Elisabeth

Verlinken :: Kommentieren

Ist die Abarbeitung der Restpunkte

franz.muehleder.uni-linz, 3. März 2012, 12:12

eine Voraussetzung für den Abschluss? Gibt es noch eine Abschlussbesprechung oder habt Ihr schon eine Note bekommen?

Ich möchte mich dann ebenfalls bei allen noch recht herzlich für die nette Zusammenarbeit bedanken und bitte, wie besprochen den gesamten Blog auf nicht mehr öffentlich einsehbar zu setzen.

Verlinken :: Kommentieren