Website des Philatelieshops der Deutschen Post

Durch die 5 Teilnehmer war die Stimmung sehr gut und wir hatten neben einer sehr intensiven Einführung ins Thema auch sehr viel Spaß.

Website von Flyerpilot

Neben den typischen Problemen von Browserkompartibilität und den Einsatz sehr neuer HTML-Technologie in Browser, schafften wir am 2 Tag eine kleine Mini-App auf HTML-, CSS- und JavaScript-Basis zu schreiben.

Was ist das für ein Projekt?

Als Praxisprojekt erstelle ich für die Hochschule Hof eine Projekt- und Kommunikationsplattform als Website. Dazu benutze ich das Zend Framework (ZF2) und schreibe dafür mehrere Module. Eines davon ist das Module zur Verwaltung von Projekten.

Allerdings ist die Zielgruppe nicht allein auf die Hochschule, ihre Professoren und Studenten beschränkt, sondern erweitert sich auf Design-Interessierte Lehrer und Schüler ab der 11. Klasse von Gymnasien.

Mit diesem Post starte ich eine Dokumentationsreihe zu diesem Projekt. Ich werde in unregelmäßigen Abständen über den Fortschritt, die Schwierigkeiten und gefunden Lösungen berichten.

Basti übernahm dabei mit den 15 Kids den Zirkus-Teil, wurde dabei von Jana unterstützt und ich bin mit den Eltern am ersten Tag zur Steinbachtalsperre, am dritten Tage zur NS Ordensburg Vogelsang und am letzten Tag zum 2. größten Radioteleskop gewandert.

Dabei unterstützte mich Paul, ein erfahrener Wanderführer aus der Region, der auch schon im ersten Wanderzirkus die Touren begleitete.

Wie immer war es sehr spannend die Teilnehmer kennenzulernen und mit ihnen interessante Dinge zu unternehmen. Zusätzlich aber auch entspannend, da zwischen den Wnadertagen immer ein Tag Erholung lag.

http://www.youtube.com/embed/OGBPWN-wfWs?feature=oembed

Apps mit Catalyst

PDF zum Download

Briefbogen

Und hier ist das Ergebnis: GemeinschaftsPraxis Weiß

Noch im Nachhinein habe ich Kontakt zu ihr und sehe ihren Fortschritt in der PHP-Programmierung.

Wir habe also bei Null angefangen und uns über die Struktur-Tags, wie <H1>-<H6> und <p>, die Zeichenformatierung bis hin zu der Formular-Erstellung durchgearbeitet. Dabei habe ich immer versucht die Gestaltung mittels CSS mit einzustreuen. So lernten sie die Tag-, Klassen- und ID-Selektoren kennen, wichtige CSS-Eigenschaften und bekamen eine kleine Einführung in das Layouten mit CSS.

Zusätzlich kam hinzu, dass ihr Meinung was sie leisten können, bzw. wie intelligent sie sind sehr schlecht war und sie sich nicht immer viel zutrauten. Da musste man schon mal etwas Druck machen um sie über einen schwankenden Balken balancieren zu lassen. Als es dann vorbei war, fanden sie alle es dann doch cool obwohl sie vorher abbrechen wollten. Also eigentlich wie immer!

Leider wird dieses Seminar viel zu wenig gebucht. Entweder weil es bessere Anbieter auf diesen Bereich gibt oder weil die Notwendigkeit nicht gesehen wird. Ich würde mir wünschen mehr davon zu haben.

Auch hier hatte der Teilnehmer nur wenige Vorkenntnisse in allg. Programmierung, dafür aber um so mehr in HTML und CSS. So konnten wir selbst in den 2 “kurzen” Tagen doch recht viel schaffen.

Da genau dieses Seminar für solche Zwecke konzipiert wurde, war ich natürlich besonders erfreut. In vielen Fällen werden ja Website geplant ohne das nötige Hintergrundwissen zu haben auf was man bei der Planung achten muss. Oft stellt man hinterher fest: oh Mist wir haben ja die Zielgruppe, bzw. die Besucher total vergessen zu berücksichtigen. Oder man wunder sich warum die Website nicht gefunden wird, warum die Besucherzahlen nicht steigen und warum die angepriesenen Produkte sich über die Website nicht verkaufen. Meistens wird man erst dann tätig und versucht mit kostspieligen Änderungen das Kind aus dem Brunnen zu holen.

Besser wäre es natürlich gewesen vorher zu wissen auf was man achten sollte. Ein genaues Wissen über das Verhalten der Besucher ist dabei sehr wichtig, aber auch die Möglichkeiten des sozial Network und der technischen Hintergründe.

Die beiden Schulungstage waren etwas chaotisch und dabei meine ich nicht die Zeit während des Unterrichtens, sondern eher die ausgewählten Tage. Denn eigentlich sollte das Training schon im Dezember stattfinden, aber da machte uns das Wetter ein Strich durch die Rechnung. 1½ Stunden wartete ich damals auf den Bus bevor ich absagte. Selbst im zweiten Versuch war das Wetter mit Blitzeis und Neuschnee ein kleines bisschen gegen mich, aber ich habe es bezwungen.

Die Schulung an sich war richtig gut. Wir schafften innerhalb von 2 Tagen ein kleines CM-System zu schreiben und ich glaube die Teilnehmerin war sehr zufrieden mit der Entscheidung nicht über einen großen Anbieter eine Schulung zu buchen.

Gestern nun gab es einen Auffrischung-Kurs in Sachen Neuerung in Adobe Creative Suite 5. Dabei wurde der Tag halbiert. Vormittags gab es Themen rund um den digitalen Druck und nachmittags war ich dran mit den Möglichkeiten des modernen Webdesigns. Dabei war nicht nur Flash und Dreamweaver ein Thema, sondern auch Fireworks, Webusability, HTML5 und CSS3, sowie Tipps und Tricks für die Erstellung von Newslettern.

Ich habe dann den Quellcode nachgeschrieben und auf meine Bedürfnisse angepasst. Der HTML-Code ist recht einfach.

HTML-Formatierung
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>RE-Design – Weblabor – HTML5 – PostIt</title>
<link href='http://fonts.googleapis.com/css?family=Homemade+Apple' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="styles/main.css">
</head>
<body>
<div class="postit">
	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra, quam nec rutrum auctor, lorem lectus porttitor augue, vel pellentesque sem leo nec nisi. Fusce quis ligula nisi.</p>
	<p>Aliquam nec tellus elit.</p>
</div>
</body>
</html>
Created by Enrico Reinsdorf - RE-Design

Wie ihr seht wird das PostIt durch einen DIV-Tag präsentiert in dem 2 Absätze vorhanden sind.

CSS-Formatierung
.postit {
	width: 700px;
	position: relative;
	margin: auto;
	padding: 2em 0 1em;
	color: #212121;
 
	-webkit-border-bottom-left-radius: 20px 500px;
	-webkit-border-bottom-right-radius: 500px 30px;
	-webkit-border-top-right-radius: 5px 100px;
 
	-moz-border-radius-bottomleft: 20px 500px;
	-moz-border-radius-bottomright: 500px 30px;
	-moz-border-radius-topright: 5px 100px;
 
	background: #fcf59c;
	background: -moz-repeating-linear-gradient( 
					top, 
					#fcf59c, 
					#fcf59c 18px, 
					#81cbbc 20px
				);
	background: -webkit-gradient(
					linear, 
					left top, 
					left bottom, 
					color-stop(0, #fcf59c), 
					color-stop(.9, #fcf59c), 
					color-stop(1, #81cbbc)
				);
	-webkit-background-size: 100% 20px;
 
	-webkit-box-shadow: 0 2px 10px 1px rgba(0,0,0,.2);
	-moz-box-shadow: 0 2px 10px 1px rgba(0,0,0,.2);
	box-shadow: 0 2px 10px 1px rgba(0,0,0,.2);
}
Created by Enrico Reinsdorf - RE-Design

In der CSS-Datei wird als erstes der Div-Container formatiert. Interessant an der Formatierung ist die Gestaltung der Grundlinien. Über einen Verlauf, der sich alle 40 Pixel wiederholt erreiche ich ein Linienmuster.

Weiterhin habe ich die Ecken asymmetrisch abgerundet, so dass der Eindruck des Biegens entsteht.

Zum Schluss bekam der DIV-Container noch einen Drop-Shadow. Dadurch wirkt das Ganze etwas plastischer.

CSS-Formatierung
.postit p {
	font-family: 'Homemade Apple', cursive;
	font-size: 2em;
	padding: 0 2em;
	line-height: 1.5em;
	margin: 0 0 1em;
}
.postit p:last-child {
	margin-bottom: 0;
}
Created by Enrico Reinsdorf - RE-Design

Um dann die Absätze den Hintergrund-Linien anzupassen, habe ich den Zeilenabstand und die Schriftgröße verändert. Auch habe ich die Grundeinstellungen für margin und padding angepasst.

CSS-Formatierung
.postit:before {
	content: ' ';
	position: absolute;
	top: -10px;
	left: 40%;
	width: 130px;
	height: 30px;
	display: block;
	background: rgba(255,255,255,.3);
	background: -webkit-gradient( 
					linaer, 
					center center, 
					color-stop( 0,  rgba(255,255,255,.2))
					color-stop( .9,  rgba(255,255,255,.3))
					color-stop( 1,  rgba(127,127,127,.5))
				);
	background: -moz-radial-gradient( 
					center center, 
					ellipse, 
					rgba(255,255,255,.2), 
					rgba(255,255,255,.3) 90%, 
					rgba(127,127,127,.5)
				);
	-webkit-transform: rotate(-3deg);
	-moz-transform: rotate(-3deg);
	transform: rotate(-3deg);
}
Created by Enrico Reinsdorf - RE-Design

Zum Schluss noch der Klebestreifen am oberen Rand des Zettels. Dieser wird mit der Pseudo-Klasse :before und einem Leerzeichen realisiert. Durch die absolute Positionierung und einer kleinen Rotation wirkt das Ganze doch recht realistisch. Hinzu kommt dass die Farbe der Streifens durch einen Transparenzwert und einen leichten, radialen Verlauf diese Wirkung unterstützt.

Ein kleiner Wermutstropfen bleibt trotz des beeindruckenden Ergebnis übrig, leider funktioniert dieses Beispiel nur in Standardkonformen Browsern, also nicht wirklich im IE8.

Natürlich habe ich diese kleine Demo auch online gelegt und ihr bekommt noch den Download dazu.

Hier ein kleines Beispiel aus dem Kurs. Es ist eine kleine Bestellseite, welches die Berechnung der Preise und das per DOM-Scripting erzeugte Formular übernimmt. Und hier gibt es den Download.

weiter zur Demo bzw. zum Download

Old Pulteney Row to the Pole.jpg

Die Website http://www.rowtothepole.com glänzt mit der parallaxen Bewegung der 2 Hintergründe und simuliert damit eine scheinbare Tiefe. Echt super.

Weitere Inspirationen findet ihr in meinem Picasa-Webalbum.

Nicht nur den Trainern und mir hat dieser Tag super viel Spaß gemacht, sondern auch alle Teilnehmer waren super begeistert und dankbar für diesen gelungenen Event.

Durch das contenteditable-Attribute kann jeder Inhalt eines beliebige HTML-Tag von Benutzer geändert werden. Eine wunderbare Sache! So habe ich mit ein bisschen CSS für die Formatierung und JavaScript für das Ein- und Ausschalten eine ersten Entwurf eines Online-Editors geschaffen.

Hier geht es zur Demonstration und hier findet ihr den Download.

Auch wenn die Azubis noch nicht sehr viele Vokabeln, also Befehle, in PHP kannten, konnten wir schon von Anfang an auf weiterführende Themen wie Session-Verwaltung, Datenbank-Zugriff via mySQL und Trennung von Programmierung und Design via Template-System einsetzen. Auch haben die beiden eine grundlegende Einführung in das MVC kennengelernt.

Weiterhin konzentrierten wir uns auf die Möglichkeiten von HTML 5 und CSS 3.

Beide Teilnehmer sind Auszubildende des WDR und bereiteten sich auch die Zwischen- bzw. Abschlussprüfung zum Mediengestalter vor.

• Flashprojekte in mehreren Sprachen realisieren, XML
• Objektorientierte Programmierung, Code wieder verwenden, optimieren.
• Multimedia Sound & Video
• Suchmaschinen-Optimierung

Da die beiden Teilnehmerinnen schon sehr gut mit Flash und ActionScript umgehen konnten sind wir in dieser Tagesschulung sehr weit gekommen und konnten tief in die Materie einsteigen.

Zwar hatte sie mich im Vorfeld darauf aufmerksam gemacht das der Schwerpunkt auf das gemeinsame Erleben gesetzt werden sollte, aber die Umstellung von einzelnen Programmpunkten auf Teamarbeit wie es in der klassischen Erlebnispägagogik der Fall ist, war ihr dann doch zu viel.

So war es doch eine recht schwierige Woche. Auch die Kinder hatte in ihren Umgang miteinander recht große Problem und Zeit zum Reflektieren blieb leider nicht wirklich. Wie gesagt versuchte ich über Kompromisslösungen ein einigermaßen gutes Programm abzuliefern.

Immer wieder stelle ich fest, dass eingefleischte Druckspeziallisten Schwierigkeiten haben sich die 4. Dimension vorzustellen, also Animation in der Zeitleisten zu koordinieren. Aber mit etwas Geduld klappt es dann schließlich doch.

Der Schwerpunkt in diesem Seminar lag zu Großteil auf die Erstellung von Banner, das Animieren von Objekten und die Datenreduzierung der SWF-Files.

Adobe Flash Catalyst CS5 – Classroom in a Book – Mit DVD: Das offizielle Trainingsbuch von Adobe Systems

Der Schwerpunkt für die beiden Teilnehmer war die Erstellung von Animationen und der Import von Bildern, Texten, Grafiken und Videos. Wieder einmal hat es mir sehr viel Spaß gemacht, da die Teilnehmer sehr locker drauf waren und großes Interesse zeigten.

Weingläser.jpg

Nach dem Workshop in der revo. GmbH am vergangenen Wochenende habe ich sehr viel Lust gehabt einige Tutorials nachzubauen.

Wie immer war es Anfang schwer und die Kids wollten lieber chillen als beim Programm mitmachen. Aber nachdem sie gesehen haben das auch dies Spaß macht entschieden sich viele doch dafür. Wie immer leider aber nicht alle. Trotzdem glaube ich das diese Klassenfahrt für die Schüler einen nachhaltigen Eindruck hinterlassen hat.

Naja ganz so schlimm war es auch wieder nicht. Nur ein paar von denen waren absolut Beratungsresistenz und fanden vieles total kindisch und langweilig. Viele von den anderen begriffen sehr schnell das, wenn sie sich auf die Aktionen einlassen, sie recht viel Spaß haben können.

Nur bei den Reflexionen kam ich nie so weit wie ich es gern hätte. Da fehlte es vielen an dem nötigen Durchhaltevermögen.

Trotz dem anstrengenden Programablauf und immer wieder Motivieren bin ich froh genau diese Klasse gehabt zu haben. Denn am Ende hatten doch viele Begriffe was es bedeutet sich gegenseitig zu Helfen und Herausforderungen gemeinsam zu schaffen.

Viele fanden den Tag im Hochseilgarten als den schönsten Tag auf der Klassenfahrt. Auch fand das die Kinder an diesen Tag sehr große Herausforderungen angenommen haben und zum Teil sogar über ihre persönlichen Grenzen hinaus gegangen sind. Sehr beeindruckend so etwas.

Andere meinten das die gemachte Nachtaktion, wo sie in 3er-Teams ein Teilstück im Wald alleine gehen sollten, das Aufregendste war.

Leider war unser Start am Montag nicht besonders gelungen, denn die Gruppe konnte erst eine halbe Stunde später beginnen. Da ich aber, wegen einem Team-Training eines Versicherungesgesellschaft schon 16:30 Uhr das Programm beenden musste, fehlte mir somit eine ganze Stunde um die Kinder kennenzulernen.

Das EP-Programm für eine Realschule beendete ich dann gegen 16:30 Uhr. So verpasste ich nur eine halbe Stunde – die meine Kollegen mit der Sicherheitseinweisung überbrückten. Soweit die Theorie. Wie üblich bei solch kniffligen Zeitkonstellationen klappte das gar nicht so gut, denn das EP-Programm konnte ich erst 14:30 Uhr statt um 14:00 Uhr beginnen und so fehlte mir fast eine Stunde Programm-Zeit. Fazit: keine Überlappungen mehr bei Programmen.

In letzter Zeit habe ich mich aber mit Kollegen unterhalten und ein anderes Bild diese Programmes bekommen. Nicht das Programm ist stressig sondern meine Einstellung dazu. Diesmal bin ich viel relaxter an die Sache rangegangen und siehe da es ist ein sehr nettes Programm.

Auch war meine Gruppe eine sehr nette Zusammensetzung von 5 Vätern mit ihren Söhnen, die zur Erstkommunion dieses als Geschenk bekommen haben.

Trotzdem gibt es immer ein paar Kleinigkeiten die man verbessern kann. Zum Beispiel fiel es der Klasse schwer sich gegenseitig zuzuhören. Sie hatten noch nicht gelernt ihren Impuls direkt antworten zu müssen zu unterdrückt, sich zu melden und zu warten bis sie dran sind.

Meistens hatten die lauten Kinder immer eine gute Idee und diese wurde dann bis alles klappte von wiederum den lauten verbessert. Die leiseren Kinder wurden dabei oft überhört bzw. ergaben sich ihrem Schicksal und machten einfach nur mit.

Erst gegen Ende der Woche begriffen viele von ihnen das es stressfreier – weil leiser – und produktiver – weil alle mithelfen – ist wenn man sich zuhört und alle fragt was sie für Ideen haben bzw. was sie von den vorgeschlagenen Ideen halten.

Oft habe ich festgestellt das diese Menschen nicht alle Zusammenhänge im World Wide Web kennen und somit falsche Weg gehen. Oft setzen sie an falscher Stelle also zu einem falschen Zeitpunkt die falschen Weichen.

Folgende Themen sind Inhalt dieses Seminars:

• Bedeutung einer Website
• Website-Marketing
• Strukturen einer Website
• Navigation
• Gestaltungsrichtlinien
• Kundenwunsch ≠ Besucherwunsch
• Suchmaschininenoptimierung (SEO)
• Webusability & Barrierefreiheit
• Technische Schwierigkeiten
• HTML & CSS
• PHP & mySQL
• Web2.0 / AJAX
• Verschiedene Systeme
• WCMS
• Wiki
• Weblog
• Pod- & Videocast
• Mashup
• Microformats

Passend dazu eine kleine Übersicht meiner Seminare.

Sie wollten ihr Interanet so ausbauen, dass ihre Geschäftsprozesse transparenter werden. So wollen sie eine Flex Webapplication entwickeln die nicht nur dann in den Büros von die Mitarbeitern genutzt wird, sondern auch über Tablet-PCs von den Menschen an den Druckmaschinen. Was für ein Vorhaben. Ich bin gespannt ob und wie das alles klappt.

Während der 4 Tage haben wir erst einmal klassisch mit den beiden wichtigen Sprachen ActionScript und MXML angefangen um dann weiter in die Tiefe einzutauchen. Folgende Themen haben wir behandelt:

• 1. Tag
• Begrüßung
• Einstieg
• IDE
• MXML
• ActionScript
• 2. Tag
• Komponenten
• Medienintegration
• lokale Dateien
• externe Quellen
• 3. Tag
• weitere Werkzeuge
• States
• Validierung
• Formatter
• Effects
• Transitions
• 4. Tag
• eig. Komponenten
• Styles
• Adobe AIR

Am letzten Tag ihrer Klassenfahrt sind wir in den angeschlossenen Hochseilgarten gegangen, wo die Schüler sich, gegenseitig gesichert, in 8 Metern Höhe ihren eigenen Grenzen stellen durften. Auch waren einige Elemente nur durch Teamarbeit zu schaffen.

Leider war das nicht immer so. In den ersten beiden Begegnungen mit den Lehrern von dieser Schule war das Klima sehr angespannt. Sie konnten meine Stränge beim Einhalten von Regeln und die für sie “zu langen” Reflexionsrunden nach den Aktion nicht verstehen. Es gipfelte in ein sehr emotionsgeladenes und leider auch persönliches – nicht sachliches – Streitgespräch. Danach beschloss ich nicht mehr mit Gruppen aus dieser Schule zu arbeiten.

Dieses Jahr war es wieder soweit und ich versuchte einen neuen Versuch. Wie schon eingangs geschrieben war es ein voller Erfolg. Beide Beurteilungen nach dem Training waren absolut positiv. Gerade meine Ruhe im Umgang mit problematischen Kindern und eskalierenden Situationen wurde besonders gelobt. Aber auch das in den Gesprächsrunden jedes Kind zu Wort kam und seine Eindrücke schildern konnte.

So macht mir das Arbeiten Spaß und gibt mir die Kraft weiterhin einen Haufen quirliger 5. Klässler zu managen.

Ich hoffe das die Teilnehmer nach der Schulung einen guten Überblick über die Möglichkeiten von Joomla! bekommen haben, aber auch einen guten Eindruck von der Arbeitsweises dieses CMS.

Neben dem Erstellen und Verwalten von Inhalten im Backend haben wir auch über die Präsentation der Inhalte im Frontend durch das Anlegen von Menüs besprochen. Außerdem haben wir uns die mitgelieferten Komponenten und Module angesehen und eingesetzt.

Wie gewohnt kann man innerhalb von einem Tag nicht wirklich weit in die Tiefe von diesen 2 umfangreichen Themen einsteigen – aber ich glaube ich konnte einen relativ großen Überblick über die Technologien vermitteln.

Der Anfang war etwas holprig da das Programm auf den Rechnern nicht laufen wollte und wir erst eine aktuelle Version herunterladen musste. Dieser Vorgang dauerte dann fast 1,5 Stunden (super peinlich). Dabei haben wir festgestellt, dass man Test-Programme ausschließlich mit dem Internet Explorer downloaden kann. Da aber auf einen Mac selten der IE installiert ist mussten wir für den Download (ca. 1,3 GB) auf einen PC ausweichen und dann alles durch Netzwerk kopieren.

Nach diesen anfänglichen Schwierigkeiten wurde dann aber ein sehr schönes und produktives Seminar draus. Da die beiden Teilnehmer aus dem Film- und Brodcastbereich kamen, konnten wir zügig Themen wie Videoformate, Footage-Vorbereitung und einfache Animation überspringen und zu komplexen Tweenings, Textanimationen, Arbeiten mit Masken und Effekten, Bewegungsverfolgung und –stabilisierung und den Einsatz von Expressionens übergehen.

Von Seminar

Folgende Themen haben wir behandelt:

• MySQL über CommandLine benutzen
• Nutzung DBDesigner
• Tabellenstrukturen erstellen, ändern und löschen
• Relationen zwischen Tabellen herstellen
  • Normalisierung
• Datenabfrage und –eingabe
• komplexe Abfragen

Bei einem Kurzprogramm über 2 Tage bin ich immer skeptisch, ob die Übungen ihre Nachhaltigkeit bekommen so wie geplant.

Die Kinder suchen dabei z.B. als Nachtaktion im Wald nach Lösungsbuchstaben, bauen Kodierräder für geheime Botschaften oder schreiben sie unsichtbar mit Milch. Auch nehmen sie Finderabdrücke und erstellen sich gegenseitig Steckbriefe.

Wie immer hat es nicht nur mir sondern auch den Kindern sehr viel Spaß gemacht und ich freue mich immer wenn solche Programme stattfinden.

Besser wäre für sie eine Klassenfahrt mit einen 4-Tage-Programm gewesen.

Im zweiten Teil sind wir dann näher auf das Regelwerk und die damit zusammenhängende DTD eingegangen. Wir haben uns Gedanken darüber gemacht, wie ein Regelwerk eines fiktiven Adressbuches aussehen könnte. Später haben wir als Übung noch ein Regelwerk, also DTD, für den Aufbau von Büchern erstellt.

1. <?xml version="1.0" encoding="UTF-8"?>
2. <!ELEMENT buch(impressum,verzeichnisse?+,inhalt)>
3. <!ELEMENT impressum(titel,isbn,autoren,buchreihe,verlag)>
4. <!ELEMENT titel (#PCDATA)>
5. <!ELEMENT isbn (#PCDATA)>
6. <!ELEMENT autoren (autor+)>
7. <!ELEMENT autor (#PCDATA)>
8. <!ELEMENT buchreihe(#PCDATA)>
9. <!ELEMENT verlag (#PCDATA)>
10. <!ELEMENTverzeichnisse (index?,literatur?,abbildung?)>
11. <!ELEMENT index(eintrage+)>
12. <!ELEMENT eintrag (name,seite+)>
13. <!ELEMENT name (#PCDATA)>
14. <!ELEMENT seite (#PCDATA)>
15. <!ELEMENT literatur(eintrage+)>
16. <!ELEMENT abbildung(eintrage+)>
17. <!ELEMENT inhalt(vorwort*,einleitung*,danksagung*,kapitel+,anhang*)>
18. <!ELEMENT vorwort(#PCDATA)>
19. <!ELEMENT einleitung(#PCDATA)>
20. <!ELEMENT danksagung(#PCDATA)>
21. <!ELEMENT kapitel (name,(kapitel|text|bild|tabelle|hinweis)+)>
22. <!ELEMENT name (#PCDATA)>
23. <!ELEMENT text (#PCDATA)>
24. <!ELEMENT hinweis (text+)>
25. <!ELEMENT bild EMPTY>
26. <!ELEMENT tabelle EMPTY>
27. <!ELEMENT anhang (name,(kapitel|text|bild|tabelle|hinweis)+)>

Zusätzlich habe ich zum Vergleich hier noch ein XML-Schema

1. <?xml version="1.0" encoding="UTF-8"?>
2. <schematargetNamespace="http://www.re-design.de/xmlbuch/example" elementFormDefault="qualified" xmlns="http://www.w3.org/2001/XMLSchema" xmlns:tns="http://www.re-design.de/xmlbuch/example">
3. <element name="buch" type="tns:buch"></element>
4. <complexType name="buch">
5. <sequence>
6. <element ref="tns:impressum"></element>
7. <element ref="tns:verzeichnisse"></element>
8. <element ref="tns:inhalt"></element>
9. </sequence>
10. </complexType>
11. <elementname="impressum" type="tns:impressum"></element>
12. <complexTypename="impressum">
13. <sequence>
14. <element ref="tns:titel"></element>
15. <element ref="tns:isbn"></element>
16. <element ref="tns:autoren"></element>
17. <element ref="tns:buchreihe" minOccurs="0" maxOccurs="1"></element>
18. <element ref="tns:verlag"></element>
19. </sequence>
20. </complexType>
21. <element name="titel" type="string"></element>
22. <element name="isbn" type="int"></element>
23. <element name="buchreihe" type="string"></element>
24. <element name="verlag" type="string"></element>
25. <element name="autoren" type="tns:autoren"></element>
26. <complexType name="autoren">
27. <sequence>
28. <element ref="tns:autor" minOccurs="1" maxOccurs="unbounded"></element>
29. </sequence>
30. </complexType>
32. <element name="autor" type="string"></element>
34. <element name="verzeichnisse" type="tns:verzeichnisse" ></element>
35. <complexType name="verzeichnisse">
36. <sequence>
37. <element ref="tns:index" minOccurs="0" maxOccurs="1"></element>
38. <element ref="tns:literatur" minOccurs="0" maxOccurs="1"></element>
39. <element ref="tns:abbildung" minOccurs="0" maxOccurs="1"></element>
40. </sequence>
41. </complexType>
43. <element name="index" type="tns:index"></element>
44. <complexType name="index">
45. <sequence>
46. <element ref="tns:eintrag" minOccurs="1" maxOccurs="unbounded"></element>
47. </sequence>
48. </complexType>
50. <element name="literatur" type="tns:literatur"></element>
51. <complexType name="literatur">
52. <sequence>
53. <element ref="tns:eintrag" minOccurs="1" maxOccurs="unbounded"></element>
54. </sequence>
55. </complexType>
57. <element name="abbildung" type="tns:abbildung"></element>
58. <complexType name="abbildung">
59. <sequence>
60. <element ref="tns:eintrag" minOccurs="1" maxOccurs="unbounded"></element>
61. </sequence>
62. </complexType>
64. <element name="eintrag" type="tns:eintrag"></element>
65. <complexType name="eintrag">
66. <sequence>
67. <element ref="tns:name"></element>
68. <element ref="tns:seite" minOccurs="1" maxOccurs="unbounded"></element>
69. </sequence>
70. </complexType>
72. <element name="name" type="string"></element>
73. <element name="seite" type="int"></element>
75. <element name="inhalt" type="tns:inhalt"></element>
76. <complexType name="inhalt">
77. <sequence>
78. <element ref="tns:vorwort" minOccurs="0" maxOccurs="unbounded"></element>
79. <element ref="tns:einleitung" minOccurs="0" maxOccurs="unbounded"></element>
80. <element ref="tns:kapitel" minOccurs="1" maxOccurs="unbounded"></element>
81. <element ref="tns:abbildung" minOccurs="0" maxOccurs="unbounded"></element>
82. </sequence>
83. </complexType>
84. <element name="vorwort" type="string"></element>
85. <element name="einleitung" type="string"></element>
86. <element name="danksagung" type="string"></element>
87. <element name="kapitel" type="tns:kapitel"></element>
88. <complexType name="kapitel">
89. <sequence>
90. <element ref="tns:name"></element>
91. <choice minOccurs="1" maxOccurs="unbounded">
92. <element ref="tns:kapitel"></element>
93. <element ref="tns:text"></element>
94. <element ref="tns:bild"></element>
95. <element ref="tns:hinweis"></element>
96. <element ref="tns:tabelle"></element>
97. </choice>
98. </sequence>
99. </complexType>
100. <element name="text" type="string"></element>
101. <element name="hinweis" type="tns:hinweis"></element>
102. <complexType name="hinweis">
103. <sequence>
104. <element ref="tns:text"></element>
105. </sequence>
106. </complexType>
107. <element name="bild" type="anyURI"></element>
108. <element name="anhang" type="tns:anhang"></element>
109. <complexType name="anhang">
110. <sequence>
111. <element ref="tns:text"></element>
112. </sequence>
113. </complexType>
114. <element name="tabelle" type="string"></element>
115. </schema>

Aus diesen beiden Regelwerken könnte dann eine folgende XML Datei entstehen:

1. <?xml version="1.0" encoding="UTF-8"?>
2. <!DOCTYPE buch SYSTEM "buch.dtd">
3. <buch>
4. <impressum>
5. <titel></titel>
6. <isbn></isbn>
7. <autoren>
8. <autor></autor>
9. </autoren>
10. <buchreihe></buchreihe>
11. <verlag></verlag>
12. </impressum>
13. <verzeichnisse>
14. <index>
15. <eintrag>
16. <name></name>
17. <seite></seite>
18. </eintrag>
19. </index>
20. </verzeichnisse>
21. <inhalt>
22. <vorwort></vorwort>
23. <einleitung></einleitung>
24. <kapitel>
25. <name></name>
26. <text></text>
27. <kapitel>
28. <name></name>
29. <text></text>
30. <bild />
31. </kapitel>
32. <text></text>
33. <tabelle></tabelle>
34. <text></text>
35. <hinweis></hinweis>
36. </kapitel>
37. <anhang>
38. <name></name>
39. <text></text>
40. </anhang>
41. </inhalt>
42. </buch>

alle Dateien zum Download

Nachdem ich am ersten Nachmittag durch Kennlern-Aktionen die Klasse besser einschätzen konnte, unternahmen wir abends dann eine Nachtaktion (sehr nette Atmosphäre – bei Schnee im Dunklen quer durch den Wald). Am 2. Tag ging es dann in den Hochseilgarten, wo nicht wie üblich durch Eigensicherung sondern durch das gegenseitige Sichern, die Teilnehmer mehr Vertrauen und Hilfsbereitschaft üben konnten. Nebenbei wird dadurch das Selbstbewusstsein bzw. Selbstwertgefühl gesteigert. So war es am Schluss eine neue und sehr gute Erfahrung für alle Schüler.

Diesmal sollte es um PHP gehen. Sie hatte schon einige Vorkenntnisse, weshalb wir nicht komplett bei Null anfangen musste. Wir konzentrierten uns an Anfang auf das Zusammenspiel und Einrichten vom Webserver mit PHP und mySQL sowie die Unterschiede zwischen einem LAN und WAN. Später haben wir durch ein Mini-Projekt ein sinnvolles Struktur bzw. Aufbau von PHP-Seiten erarbeitet. Zum Schluss zeigte ich noch durch ein kleines Script wie man eine XML-Ausgabe über die DOMDocument-Klasse, also ein bisschen OOP, erzeugt.

Free Monitor For Google

Ein wirklich brauchbares Freeware-Tool – danke an die Hersteller ClerverStat.

• Windows XP
  • Chrome 3.0
  • Firefox 2.0
  • Firefox 3.0
  • Firefox 3.5
  • Internet Explorer 6.0
  • Internet Explorer 7.0
  • Internet Explorer 8.0
• Mac OS X
  • Firefox 2.0
  • Firefox 3.0
  • Firefox 3.5
  • Safari 3.0
  • Safari 4.0

Adobe Browser Lab

Direkt zur Anwendung: Adobe Browser Lab
Über Adobe Browser Lab
Dreamweaver Erweiterungen: Part 1 & Part 2

Der Teilnehmer hatte schon viele Photoshop- und Illustrator bzw. Freehand-Kenntnisse und so konnte ich den Teile des Zeichnens in Flash relativ klein halten. Wir haben uns dann eher auf das Animieren von MovieClips und die optimale Ausgabe in SWF konzentriert. Auch nutzten wir die Zeit den Umgang mit Videos in Flash durchzusprechen.

Nach anfänglichen Schwierigkeiten – Dreamweaver als Authorentool zu sehen – haben wir eine schöne und effektive Seminarzeit gehabt. Ich hoffe das sie durch das Seminar einen guten Einstieg bekommen habe – eigentlich bin ich mir da aber ziemlich sicher

Der Teilnehmer kam, wie so oft, aus dem Print-Bereich und hatte keinerlei Vorkenntnisse. Die große Herausforderung besteht dann darin die Denkweise (ist ja Print bezogen) auszuweiten, da ja beim Konzipieren und Layouten von Webdesign die technischen Vorgaben einen großen Einfluss haben.

Der Teilnehmer war sehr zufrieden, hat schon weiter Seminare gebucht und würde – laut Beurteilung – mich weiter empfehlen.

Beide habe schon guter Erfahrungen in der Vektorverarbeitung mitgebracht, so dass wir uns auf die Animation und optimierte Ausgabe von Flash konzentrieren konnten. Auch war der Import von Illustrator- bzw. Photoshop-Vorlagen ein großes Thema, sowie die Einbindung von Text.

In den ersten 2 Wochen kamen 16- bis 21-Jährige und machten in 2 Gruppen jeweils 2 Touren – eine Trekking- und eine Kanu-Tour. Leider war ich so stark erkältet, dass ich die erste Tour nicht kommen konnte.Selbst die Übernachtung im Zelt war nicht möglich und nicht musste ins Gästehaus wechseln. Später ging es mir wieder besser und die 2. Tour konnte ich als Kanu-Guide mitfahren.

In der letzten Hälfte meines Urlaubes kamen dann 13- bis 15-Jährige (15 Stück) mit denen wir geplant hatten eine 10tages Kanu-Tour auf den Nidelva zu machen. Aber leider hat es so stark geregnet, dass wir in den ersten 2 Tagen nicht starten konnten. Wir haben dann die gesamte Tour auf geteilt und als erstes mit einer 3tages Tour begonnen. Später folgte dann noch eine 5tägige.

Das Programm ist kostenlos und bietet alles was man für Einzelbildaufnahmen haben soll. Schön an der ganzen Sache ist, dass man das gemachte Bild sowohl als BMP, JPG, ICO und PDF speichern kann. Weiterhin kann man relativ einfach auswählen, welches Fenster – also welches Programm man aufnehmen möchte.

Einziger, kleiner Nachteil den ich bis jetzt gefunden habe ist das es das gemachte Bild in der internen Zwischenablage speichert und so den benötigten Arbeitsspeicher heraufsetzt.

Am 29. und 30. Juni habe ich für Reuter Onlineshop GmbH eine individuelle Schulung gehalten. Das spezielle an dieser Schulung war, dass es 3 Gestalter gab, die mit Flash nur rudimentäre Erfahrungen hatten und 2 Programmierer, die zwar schon mit Flash programmiert hatten, aber nur in ActionScript 2. In den 2 Tagen musste ich also einen Spagat zwischen Gestalten – Programmieren und Anfänger – Umsteigern in Flash schaffen.

Begonnen hatten wir dann mit den Veröffentlichungseinstellungen, Dateivorbereitungen und Datenreduzierungen in und für Flash. Im Verlauf des Seminare wurden dann noch Animationsmöglichkeiten mit MovieClips gezeigt und einfachen Button-Steuerungen programmiert.

Am 2. Tage gingen wir dann näher auf die Programmierung ein. Gegen Ende des Seminares hatten dann die Einsteiger Zeit ihre neues Wissen zu verarbeiten, während ich immer wieder für die Programmierer interessante Aspekte der ActionScript3-Programmierung einwarf.

Leider bietet Adobe nur die neusten Programme zum Download an und so konnte das KWTZ nur auf eine Testversion aus einem Buch drauf zurückgreifen. Diese wiederum lief aber nur einen Tag und verkomplizierte die Schulungsvorbereitungen und später auch die Durchführung. Hinzu kam das es zwar auf der Adobe-Website eine Testversion von Encore DVD gibt, wenn man sie aber heruntergeladen und installiert hat, muss man aber eine Seriennummer eingeben. Solche Download-Möglichkeiten sind nicht gerade förderlich für Einsteiger die nur mal eben die Programme testen möchten um dann sich für eins zu entscheiden.