Web2.0-Stammtisch 0.3: Web2.0-Stammtisch 0.3


Agenda: Agenda HTML 5 und CSS 3 Neue Websites Literaturempfehlungen Community Marketing Management Leitfaden Integrierte Kommunikation Virales Marketing Kommunikologie


Slide3: http://code.google.com/webstats/index.html Erstmal gucken…


(X)HTML 5(2) und CSS 3: (X)HTML 5(2) und CSS 3 HTML5 oder XHTML2? XHTML 2 bringt Semantik ins Web 2.0 HTML 5, der kleine Schritt zu XHTML 2 CSS 3 macht alles schöner


HTML5 oder XHTML2?: HTML5 oder XHTML2? HTML 5 ist eine Weiterentwicklung von HTML 4.0 und XHTML 1.0 HTML 5 muss abwärtskompatibel sein (Stichwort: Tag-Soup) HTML 5 setzt darauf auf, wie HTML 4.01 in der Praxis angewendet wird und wurde HTML 5 wird als text/html versendet und somit nicht auf semantisch korrekte Strukturen geprüft


HTML5 oder XHTML2?: HTML5 oder XHTML2? XHTML 2 setzt sich aus der XHTML 2 und Web Application 1.0 Spezifizierung zusammen XHTML 2 wird (im Gegensatz zu HTML 5) von keinem bekannten Browser unterstützt XHTML 2 wird streng auf Konformität validiert und somit als xml-Dokument gesendet


XHTML 2 bringt Semantik ins Web 2.0: XHTML 2 bringt Semantik ins Web 2.0 Navigationslisten Jedes Element kann ein Link sein Neue Überschrift-Konstrukte Das role-Attribut! Neue Attribute (z. B. hrefmedia=„print“, nextfocus=„w“ uvm.) http://www.w3.org/TR/xhtml2/


XHTML 2 bringt Semantik ins Web 2.0: XHTML 2 bringt Semantik ins Web 2.0 Beispiel einer Breadcrump-Navi mit XHTML 2 Sie sind hier: Startseite Produkte Widgets Funktionen


Slide9: HTML 5 wird auch oft als (X)HTML5 bezeichnet…


HTML 5, der kleine Schritt zu XHTML 2: HTML 5, der kleine Schritt zu XHTML 2 Baut auf der Verwendung von HTML 4.01 und XHTML 1.0 auf Wird bereits teilweise unterstützt und kann (im Gegensatzu zu XHTML 2) sehr leicht in zukünftige Browser implementiert werden Unterstützt weiterhin Tag-Soups Web Forms 1.0


HTML 4.01 -> HTML 5: HTML 4.01 -> HTML 5 Quelle: A List Apart http://www.alistapart.com/articles/previewofhtml5


HTML 4.01 -> HTML 5: HTML 4.01 -> HTML 5 Quelle: A List Apart http://www.alistapart.com/articles/previewofhtml5


HTML 5, Web Forms 1.0: HTML 5, Web Forms 1.0 Part number: Name: Comment:


Slide14: CSS 3 dauert zwar noch, schön ist es aber trotzdem


CSS 3 macht alles schöner: CSS 3 macht alles schöner Mehrer Seitenbereich definieren


CSS 3 macht alles schöner: CSS 3 macht alles schöner Mehrer Seitenbereich definieren dl { display: "ab" "cd" } #sym1 { position: a } #lab1 { position: b } #sym2 { position: c } #lab2 { position: d } A A is een aapje B B is de bakker


CSS 3 macht alles schöner: CSS 3 macht alles schöner Der Medientyp Reader hält Einzug in die Spezifikation Werte können mit calc berechnet werden div.spalte { float: left; margin: 1em; width: calc(100%/3 – 2*1em); } Quelle: http://meiert.com/de/publications/articles/20051224/


CSS 3 macht alles schöner: CSS 3 macht alles schöner Mehrere Hintergründe verwenden Runde Ecken dank border-radius Das target-Attribut wurde aus XHTML entfernt und in CSS 3 implementiert a { target: tab; } Öffnet eine URL innerhalb eines Tabs (sogar ohne Ajax)


Slide19: Entspannt durch Neues surfen…


Neue Web 2.0 Sites: Neue Web 2.0 Sites http://www.photophlow.com/ http://www.alpengluehen.com/ http://stockflock.de/ http://www.carmondo.de/ http://dauerwerbeblog.de


Slide21: Bis zum nächsten Web 2.0 Stammtisch!