Referat HTML - CSS

[thuemmy]

Hallo Forum,

ich soll demnächst ein kleines Referat halten über die Erstellung von Webseiten. Das Wissen der Teilnehmer ist sehr breit gefächert. Es fängt an bei "ich schreibe immer meine Briefe auf dem PC und spiele Karten" bis "ich habe schon einige Websites erstellt". Bei Nachfragen erfährt man dann, Dreamweaver, Frontpage oder sonstige Klicki-Bunti-Programme waren im Spiel, oder bei Betrachtung der Website (Quellcode) tun sich wahre Tabellen-Labyrinthe (schreibt man das so?) auf.

Wie stelle ich mir das Referat vor?

Zuerst werde ich wohl zweimal dieselbe Webseite zeigen. Einmal mit Tabellenlayout und einmal mit CSS designed. Beim Tabellenlauyout wird auch alles an designtechnischen Instrumenten aus dem vorigen Jahrtausend eingebaut (Farbe, Schriftart, Schriftgröße, unterstrichen usw.) was es so gibt. Danach wird der Quellcode gezeigt, von beiden Seiten. Das erstmal als kleiner Einstieg um schon zu demonstrieren wie übel Tabellen sind.

Danach würde ich dann an dieser Webseite zeigen, wie schnell man das gewünschte Ziel erreichen kann.

1. Text erfassen
2. Text auszeichnen
3. Design durch CSS

Das sollte es eigentlich gewesen sein. Wer danach noch behauptet, dass es besser wäre mit Tabellenlayout zu arbeiten, wird dann vermutlich von mir aus dem Raum geprügelt (allerdings nicht bildlich :-) )

Könnte man so vorgehen, oder habt Ihr noch andere Ideen?

Bin schon gespannt auf die verschiedenen Anregungen.

Gruß thuemmy

 

[prm]

Ich würde auf Tabellen überhaupt nicht eingehen, zumindest nicht in Verbindung mit Layout.
Warum etwas beibringen, das veraltet und eigentlich sogar falsch ist?
Das verwirrt m.E. nur die Zuhörer.

Mach doch besser eine kleine "Zauberstunde", wie du schon erwähnt hast:
Eine kleine HTML-Seite ohne jegliche Formatierung und dann mit CSS etwas Form und Frabe reinbringen.
Dann noch schnell aus einer horizontal-Navi eine vertikale zaubern (oder umgekehrt), das sollte doch einen prägenden Eindruck machen.

 

[_Thor_]

Der Ansatz ist ganz gut. Ich würde wohl auch erst das Tabellenlayout und Frames vorstellen, damit die Frontpage-Benutzer was wiedererkennen und um ein abschreckendes Beispiel für unübersichtlichen Quellcode zu haben.
Dann würde ich deutlich darauf eingehen, wofür HTML wirklich gedacht ist, nämlich die Semantik und immer wieder unterstreichen, dass HTML nichts mit dem Aussehen im Browser zu tun hat. Das reine HTML dann also auch nicht im Browser anzeigen lassen, sondern nur auf den Quellcode konzentrieren. Dazu eine kleine Übersicht der gängigsten Tags an die Wand werfen und den Quellcode dann mit dem eines Tabellenlayouts vergleichen in einem Frameset vergleichen^^

Wenn dann deutlich ist, dass semantisches HTML viel leichter und übersichtlicher ist kannst du langsam mit CSS anfangen und die Seite im Browser zeigen.

 

[thuemmy]

Ich würde auf Tabellen überhaupt nicht eingehen, zumindest nicht in Verbindung mit Layout.
Warum etwas beibringen, das veraltet und eigentlich sogar falsch ist?
Das verwirrt m.E. nur die Zuhörer.

Och, prm, Du solltest mich eigentlich besser kennen, dass ich den Leutchen sicherlich kein Tabellenlayout beibringen will. Ich bezwecke mit der Tabelle zu demonstrieren, was sich da für Labyrinthe im Quelltext darstellen. Dem gegenüber steht dann die klare Struktur einer semantisch richtigen Webseite. Thor hat das verstanden, was ich bezwecke ;-)

Dann würde ich deutlich darauf eingehen, wofür HTML wirklich gedacht ist, nämlich die Semantik und immer wieder unterstreichen, dass HTML nichts mit dem Aussehen im Browser zu tun hat. Das reine HTML dann also auch nicht im Browser anzeigen lassen, sondern nur auf den Quellcode konzentrieren.

Doch, das hatte ich schon vor, das ich den reinen HTML-Code auch im Browser anzeige, um dann mit meiner "Zauberstunde" zu beginnen. Da werde ich dann Stück für Stück Layout reinbringen. Das mit der Navigation ist dann das vorletzte Highlight. Und als letztes was ich dann demonstriere (ich werde noch 2 oder 3 weiter Webseiten vorbereiten) wie man mit der Änderung in der CSS-Datei das Aussehen in allen Webseiten ändert.

Gruß thuemmy

 

[Shrax]

Erklähr doch dazu, wie sich Xhtml und css Entwickelt hat und wie css in Zukunft aussehen wird.

Das wär auch noch ein Punkt wenn du die Zeit nicht vollbekommst.

 

[thuemmy]

Erklähr doch dazu, wie sich Xhtml und css Entwickelt hat und wie css in Zukunft aussehen wird.

Das wär auch noch ein Punkt wenn du die Zeit nicht vollbekommst.

Also dass ich die Zeit nicht vollbekomme, da habe ich keine Bedenken, zumal keine feste Zeit vorgesehen ist. Aber ich glaube mit solchen Infos (müsste ich mich auch richtig beschäftigen, wenn ich ehrlich bin) würde ich den Leutchen wahrscheinlich zuviel zumuten. Es geht eigentlich darum einen ersten Eindruck zu bekommen.

Trotzdem danke für Deine Antwort.

Gruß thuemmy

 

[prm]

Och, prm, Du solltest mich eigentlich besser kennen, dass ich den Leutchen sicherlich kein Tabellenlayout beibringen will. Ich bezwecke mit der Tabelle zu demonstrieren, was sich da für Labyrinthe im Quelltext darstellen. Dem gegenüber steht dann die klare Struktur einer semantisch richtigen Webseite. Thor hat das verstanden, was ich bezwecke

Klar kenne ich dich diesbezüglich gut genug und ich hätte auch nie unterstellt, dass du Tabellenlayout beibringen wolltest.
Es ging mir lediglich darum, um mal irgendeinen blöden Vergleich zu bringen:
Das wäre ja ähnlich, wie wenn du dir ein Auto kaufst und der Verkäufer würde dir erklären, wie früher ein Holzvergaser-Motor funktioniert hat.

Es hat aber auch durchaus einen gewissen Charme, wenn du Frames und Tabellen als abschreckendes Beispiel verwendest. Insofern kann ich auch den Vorschlag von Thor nachvollziehen.
Es kommt eben auf's Publikum drauf an: Für diejenigen, die Tabellenlayout kennen und noch verwenden, würde ich das natürlich auch so machen.
Für jemand mit bisher keinerlei Ahnung würde es dagegen nur verwirren.

Ich denke, wir sind uns darin einig.

 

[thuemmy]

Es kommt eben auf's Publikum drauf an: Für diejenigen, die Tabellenlayout kennen und noch verwenden, würde ich das natürlich auch so machen.
Für jemand mit bisher keinerlei Ahnung würde es dagegen nur verwirren.

Das ist das Problem, an der Sache. Von einem weiß ich, dass er Tabellen-Layout benutzt (bis zum erbrechen), von einem oder zweien vermute ich es. Der Rest kann mehr oder weniger Briefe auf dem PC schreiben, ein bisschen was mit Excel-Tabellen und mehr wohl nicht.

Der Vergleich mit dem Hozlvergaßer-Auto hinkt allerdings meiner Meinung nach. Während diese Autos nicht mehr auf der Straße zu finden sind, und auch kaum einer behauptet, dass diese Fahrzeuge Vorteile gegenüber einem modernen, zeitgemäßem und umweltfreundlichen Auto haben, ist es bei der Webseitenerstellung ja noch immer so, dass diese Holzvergaser-Webseiten... ups, Tabellenlayout-Seiten meinte ich, immer noch in Massen zu finden sind, und dann gibt es noch genügend Verkäufer... äääähh Webdesigner meine ich, die das Tabellenlayout als das Non plus ultra hinstellen.

Aber ich gebe Dir glaub ich recht. Da die meisten von HTML und CSS keine Ahnung hat, würde sie das unter Umständen überfordern. Und diejenigen, die bisher mit Tabellen gearbeitet haben, sicherlich den Unterschied erkennen, wie einfach das ist.

Na, mal schauen... vielleicht kommen ja noch ein paar Tipps, die der absolute Hammer sind, an die wir noch alle nicht gedacht haben.

Gruß thuemmy

 

[Bernhard]

Das ist das Problem, an der Sache. Von einem weiß ich, dass er Tabellen-Layout benutzt (bis zum erbrechen), von einem oder zweien vermute ich es. Der Rest kann mehr oder weniger Briefe auf dem PC schreiben, ein bisschen was mit Excel-Tabellen und mehr wohl nicht.

Hallo thuemmy,

interessantes Thema - wieviel Zeit hast Du dafür? (hab schon gesehen, dass
keine feste Zeit vorgesehen ist, aber irgendeinen Rahmen wird es ja geben?)

Ich würde Tabellen und Frames auf jeden Fall erwähnen (und auch die von Dir
im ersten Beitrag beschriebene Inline-Formatierung mit den entsprechenden
Fehler-Gefahren).

Selbst wenn Du einen ganzen Tag Zeit hast, wird derjenige, der bisher gerade
mal "Briefe am PC schreiben kann" und sich dann tatsächlich dran versuchen
möchte, eine Website zu bauen, früher oder später Google bemühen, weil er
Hilfe sucht - und dann ganz schnell bei irgendeiner Anleitung / Tutorial landen,
wo ihm Tabellen erklärt werden.
Hast Du sie nicht erwähnt, ist er sauer auf Dich und wird sie verwenden, weil
sie ja tatsächlich auf den allerersten Blick einfacher aussehen...

Auf WYSIWYG-Editoren und "Homepage-Baukästen" solltest Du auch kurz eingehen...;-)

Grüße
Bernhard

 

[neuroleptika]

Nabend thuemmy,
vielleicht könnte dir ein Buch von Peter Müller helfen.
Aus der Little Boxes Reihe gibt es Teil 0.
Unter anderem wird es auch für (potentielle) Kunden empfohlen die wissen möchten um was es geht.

Ich habe Teil 0 selber nicht gelesen. Es soll aber wirklich bei null anfangen.
Teil 1 wäre für css-Einsteiger mit etwas Grundwissen in html geeignet.

 

[thuemmy]

Also, da wir hier ja unter uns sind, kann ich vielleicht ein bisschen deutlicher werden, im Bezug auf Teilnehmerkreis und Umfeld.

Zur Zeit befinde ich mich in einer Maßnahme der ArGe. Es geht darum, die Teilnehmer wieder fit zu machen für den ersten Arbeitsmarkt. Die Teilnehmer sind aus den verschiedensten Gründen schon länger arbeitslos. Der Hauptbestandteil dieser Maßnahme ist ein fachliches Praktikum. Es gibt Bereiche wie Holzbearbeitung, Recycling, Farbe und Raumgestaltung, Logistik und Handel, Hotel und Gastronomie, usw. Aufgrund meines beruflichen Werdeganges (Organisatonsprogrammierer) wurde ich dem Praktikum für Mediengestaltung zugeteilt. Leider ist es so, dass man mit Leuten, die jetzt in keine der angebotenen Praktikas richtig reinpassen, so verfährt, dass sie am besten zur EDV passen, da ja eigentlich alle einen PC daheim haben, und sich damit auskennen. Der Vorteil ist, zumindest in dem Mediengestaltungsbereich, die Teilnehmer machen auf mich den Eindruck, als ob sie richtig motiviert sind.

Unsere Bereichsleiterin kommt aus der reinen Gestaltungsecke (zertifizierte Adobe Photoshop Trainerin) und hat von Webseitenerstellung keinen Plan. Da ich mir letztens mal überlegt habe, im ehrenamtlichen Bereich etwas zu machen (PC und Internet für Senioren) habe ich gedacht, dass sei doch ein gutes Training (Referieren und gut erklären ist halt nicht so meine Stärke). Deshalb habe ich mich angeboten da mal ein Referat zu machen. Das wurde dankbar angenommen, und nun hab' ich den Salat :-)

Dadurch, dass es ein sehr gemischter Teilnehmerkreis ist, will/kann ich gar nicht so sehr in die Tiefe gehen (dazu würde ein Referat so oder so nicht ausreichen). Als Ergebniss möchte ich folgendes erreichen:

• Den Teilnehmern die Angst nehmen
• Zeigen was HTML ist, und dass es eigentlich ganz einfach ist, wenn man die Aufgabe von HTML verstanden hat.
• Zeigen was HTML nicht ist (Benutzung von z.B. <h3> weil die Schriftgröße passt ;-)
• Zeigen zu was CSS genutzt wird.
• Zeigen was barrierefreies Internet ist, und was nicht (habe gestern schon ein tolles Beispiel für eine nicht barrierefreie Website gefunden vom Anbieter der Maßnahme :mrgreen: )

Eben ist mir ein tolles Schmankerl für das Referat eingefallen. Ich werde wie anfangs schon geschrieben zweimal dieselbe Seite machen, zumindest äußerlich. Einmal mit Tabellen und einmal Layout durch CSS. Dann wende ich mich an die hießige Blindenschule oder einen Blindenverein, sie möchten sich beide Seiten mit einem Voice-Browser ansehen und das aufnehmen (das wird doch sicherlich gehen) und das wird den Leutchen dann vorgespielt. Ein besseres Beispiel um zu demonstrieren, wie schwachsinnig Tabelenlayout ist, gibt es wohl nicht

So habe ich mir das ganze vorgestellt.

Gruß thuemmy

 

[xooox]

Moin thuemmy,

schön das du ein paar Infos frei gibst, glaube aber nicht das irgentjemand gerne so kurse macht, die meisten müssen dran teil nehmen damit sie auch weiterhin kolle vom amt bekommen, darum wäre es mein ziel erstmal drauf einzugehen wie simpel das ganze ist, dann würde ich drauf eingehen wie groß die möglichkeit ist damit Geld zu verdienen, und erst dann wenn alle hellhöhrig sind würde ich mich mit dem ganzen Thema beschäftigen.


lg.xooox

 

[thuemmy]

Moin xooox, s

chon irgendwie komisch... Du schreibst immer so, dass ich Dir widersprechen muss und wir in einer gewissen Regelmäßigkeit aneinander rasseln

glaube aber nicht das irgentjemand gerne so kurse macht, die meisten müssen dran teil nehmen damit sie auch weiterhin kolle vom amt bekommen

Das ist ja irgendwie ein persönlicher Angriff auf mich. Ich bin ja auch Teilnehmer dieser Maßnahme. Und ich glaube ich spreche für eine Mehrzahl der Teilnehmer, wenn ich sage, dass Deine Aussage schlichtweg falsch ist.

dann würde ich drauf eingehen wie groß die möglichkeit ist damit Geld zu verdienen

Du bist irgendwie immer sehr auf Geld fixiert. Das geht auch aus anderen Posts von Dir hervor. Und so einfach, wie es scheint, ist es eben auch nicht, damit sein Geld zu verdienen.

Gruß thuemmy

 

[xooox]

chon irgendwie komisch... Du schreibst immer so, dass ich Dir widersprechen muss und wir in einer gewissen Regelmäßigkeit aneinander rasseln

:mrgreen: so wird es nie langweilig :mrgreen:

Zum Thema:
Die Jungs die ich kenn, die wollen alle nicht arbeiten, wenn die vom Amt aus eine masnahme machen sollen, gehen sie nur hin weil sie angst haben das sonst ihr Geld gekürzt wird.

Hab ja nicht behauptet das alle nicht wollen :

die meisten müssen dran teil nehmen damit sie auch weiterhin kolle vom amt bekommen,

Aber auf jedenfall wollte ich nicht sagen das du einer von denen bist :mrgreen:

Du bist irgendwie immer sehr auf Geld fixiert. Das geht auch aus anderen Posts von Dir hervor. Und so einfach, wie es scheint, ist es eben auch nicht, damit sein Geld zu verdienen.

Natürlich geht es bei mir nur noch um Geld, warum auch nicht soll ich meine arbeit verschencken ? :mrgreen:
Ich bin der Meinung das es leicht ist, ist natürlich nicht von heute auf morgen gelernt aber wenn man dies als Ziel hat dann kann man es schafen, finde das sölltest du den anderen auch vermitteln.

Wenn schon eine Stimmung da ist wie, ah das ist voll schwer dann hat auch keiner die mutivation es zu schaffen....

 

[prm]

Nochmal zurück zum Hauptthema und zum Teilnehmerkreis:
Ich interpretiere das so, dass der überwiegende Teil bisher mit Websites überhaupt nichts zu tun hatte.
Somit sind für diesen Teil vermutlich auch sämtliche Informationen deines Vortrags neu, fremd und zunächst mal gewöhnungsbedürftig.
Da kann es schon passieren dass mancher bereits bei den einfachsten Dingen nur "Bahnhof" versteht. Alles was für dich als Profi selbstverständlich ist, ist für einen Laien vollkommenes Neuland.

Wenn nun dieser (wohl größere) Teilnehmerkreis keinerlei Ahnung hat, dann ist es aus meiner Sicht didaktisch viel sinnvoller, ihn von Tabellen, Frames & Co zu verschonen und ihm gleich das "Richtige" beizubringen. Warum soll man mit Wissen konfrontiert werden, das nicht mehr up to date ist?

Für alle anderen würde ich in einem Nebensatz erwähnen, welche Nachteile die veralteten Techniken haben. Und wer dann immer noch drauf besteht, dem kannst du entsprechende Code-Demonstrationen liefern. Nur: den größeren, unbedarften Teilnehmerkreis wird das nur verwirren: Kannte er bisher nur ein (richtiges) Produkt, so merkt er, dass auch noch andere Produkte im Regal stehen und wird unschlüssig, welches er nehmen soll.
Die Verwirrung nimmt zu, das Interesse nimmt infolge der noch komplizierteren Sachverhalte ab.
Ich sehe das also rein didaktisch.

 

[neuroleptika]

Tach thuemmy,

sie möchten sich beide Seiten mit einem Voice-Browser ansehen und das aufnehmen (das wird doch sicherlich gehen) und das wird den Leutchen dann vorgespielt. Ein besseres Beispiel um zu demonstrieren, wie schwachsinnig Tabelenlayout ist, gibt es wohl nicht

Screenreader kommen ganz gut mit Tabelenlayouts zurecht.
Erst wenn die Zellen / Zeilen aus dem Zusammenhang gerissen werden wird es richtig chaotisch.
Kein Problem für Screenreader:

<table>
  <tr>
<td>Mail</td><td><input type="text" value="mail" /></td>
</tr>
  <tr>
<td>Name</td><td><input type="text" value="name" /></td>
</tr>
</table>

Oft gibt es aber auch sowas:

<table>
<tr>
<td id="beschreibungen">
[COLOR="DarkRed"]<table>
  <tr>
  <td>Mail</td>
  </tr>
  <tr>
  <td>Name</td>
  </tr>
</table>[/COLOR]
</td>
<td id="eingabefelder">
[COLOR="#8b0000"]<table>
  <tr>
  <td><input type="text" value="mail" /></td>
  </tr>
  <tr>
  <td><input type="text" value="name" /></td>
  </tr>
</table>[/COLOR]
</td>
</tr>
</table>

Das könnte sich dann so anhören:
"Name Mail Eingabe Eingabe".

Diesen Fehler könnte mann aber auch mit Listen produzieren.

aber nicht das irgentjemand gerne so kurse macht, die meisten müssen dran teil nehmen damit sie auch weiterhin kolle vom amt bekommen

Doch, es gibt auch Leute die sich nicht aufgegeben haben.

 

[thuemmy]

@ prm - Ich habe mir Dein Post genau durchgelesen. Du hast Recht. Ich stelle mir das gerade umgekehrt vor. Wenn mir ein KFZ-Mechaniker was über die Funktionsweise von Motoren erzählen will, und dann erst mit dem Holzvergaser anfängt. Ich werde das mit Tabellen und Frames vielleicht am Schluss erwähnen. Die Tabellen- und Frameverfechter haben dann die Möglcihkeit nachzufragen, und die anderen können dann ja in die Kaffeepause gehen.

@ neuroleptika - Das mit den Tabellen habe ich mittlerweile auch mitbekommen. Ich habe mir eben mal den BITV-Test | Selbstbewertung | Fragebogen
angeschaut. Da werden auch Layout-Tabellen als nicht barrierebehaftet gewertet, wenn der Inhalt linearisiert ist.

Ich denke, dass ich die Zauberstabnummer mache. Das wird dem Großteil der Leute schon genug sein, für's erste zumindest.

Gruß thuemmy

 

[Bernhard]

@ prm - Ich habe mir Dein Post genau durchgelesen. Du hast Recht. Ich stelle mir das gerade umgekehrt vor. Wenn mir ein KFZ-Mechaniker was über die Funktionsweise von Motoren erzählen will, und dann erst mit dem Holzvergaser anfängt.

Hallo thuemmy,

auch mit Holzvergaser bleibt es ein Verbrennungsmotor...

Ich werde das mit Tabellen und Frames vielleicht am Schluss erwähnen. Die Tabellen- und Frameverfechter haben dann die Möglcihkeit nachzufragen, und die anderen können dann ja in die Kaffeepause gehen.

Wichtig erscheint mir, sie zu erwähnen, vielleicht ist am Schluss auch nicht verkehrt.

@ neuroleptika - Das mit den Tabellen habe ich mittlerweile auch mitbekommen. Ich habe mir eben mal den BITV-Test | Selbstbewertung | Fragebogen
angeschaut. Da werden auch Layout-Tabellen als nicht barrierebehaftet gewertet, wenn der Inhalt linearisiert ist.

Ich denke, dass ich die Zauberstabnummer mache. Das wird dem Großteil der Leute schon genug sein, für's erste zumindest.

Gruß thuemmy

Ich hab mir vor einer Weile mal einen Screenreader (JAWS) heruntergeladen,
ist auf jeden Fall interessant...

aber nicht das irgentjemand gerne so kurse macht, die meisten müssen dran teil nehmen damit sie auch weiterhin kolle vom amt bekommen

Doch, es gibt auch Leute die sich nicht aufgegeben haben.

So ist es! Da spielt auch das Alter eine Rolle: unter 40 bekommt man solche Kurse
fast schon aufgedrängt, über 40 muss man sich anstrengen, sowas überhaupt zu
bekommen. Wer die Hürde genommen hat, mit über 40 so einen Kurs zu bekommen,
der wird auch anschließend am Ball bleiben...

Natürlich geht es bei mir nur noch um Geld, warum auch nicht soll ich meine arbeit verschencken ?

Keiner sagt, dass Du Deine Arbeit verschenken sollst, aber das Leben hat noch
einiges mehr zu bieten, als nur Kohle...;-)

Grüße
Bernhard

 

[xooox]

Mal ganz abgesehen von meiner Aussage, das viele Hartz4 Leute es garnicht wollen, kann man doch keinen Kurs nicht einfach so starten, alle kommen rein, erste Wort "hallo", und dann "Tabellen sind scheiße":mrgreen:

Wäre das mein Kurs würde ich erstmal weit aushollen, und alle späteren möglichkeiten aufzählen, dann weiß jeder wofür er sich die arbeit macht, und erst dann würde ich richtig auf das Thema eingehen.

 

[Niklas]

Keiner sagt, dass Du Deine Arbeit verschenken sollst, aber das Leben hat noch einiges mehr zu bieten, als nur Kohle...;-)

Stimmt manche machen das als Hobby ich wollt zuerst das auch nur aus Spaß machen und als einziger von deinen Freunden ne Webseite zu haben ist auch nicht schlecht :) Ich habe Später erst erfahren das man damit auch gut Geld verdinen kann und das auch als Beruf haben kann das gibt einem noch mehr Lust ne Webseite zu erstellen.

MFG Niklas