Canvas -

[Rolf B]

Hallo mhz,

Canvas ist ein Problem, keine Lösung. Wie willst Du denn die Unterstreichungen überprüfen? Und wie soll ein Schüler mit Tablet die Aufgabe lösen? Dieses Widget reagiert nicht auf Touch (zumindest nicht auf die Touch-Simulation in meinem Browser)?

Löse Dich vom Blatt Papier. Das ist das Internet. Es gibt andere Möglichkeiten. Und es gibt andere Schwierigkeiten.

Eine solche Seite muss bedienbar sein. Das hat zwei Aspekte.

(1) Eingabe. Die Aufgabe sollte idealerweise mit Maus, mit Touchbildschirm und mit Tastatur lösbar sein. Tastatur würde ich auf Prio 3 setzen, aber Maus und Touch ist ein MUSS.

(2) Ausgabe. Du kennst deine Schüler besser als ich, und weißt daher, ob Du Kinder mit Sehschwierigkeiten hast. Im Allgemeinen muss ein solche Seite vorlesefähig sein, d.h. ein Screenreader sollte die Inhalte akustisch wiedergeben können. Wenn die Kinder deiner Klasse diesen Bedarf nicht haben, kann man das zurückstellen, aber Text im Canvas ist definitiv eine Hürde auf diesem Weg und daher nicht die beste Lösung.

Und dann sollte die Antwort eingereicht werden können, zwecke Überprüfung. Durch Dich, oder durch den Computer. Eine Canvas-Unterstreichung ist dafür ungeeignet. Das müsstest Du in eine Grafik umwandeln und die Grafik hochladen. Das geht, ist aber müüüühsam.

Mein Vorschlag wäre, aus jedem Wort einen Button zu machen. Den kann man per Maus, per Touch und per Tastatur anklicken. Per JavaScript kannst Du dafür sorgen, dass der Button in einer "Ringschaltung" die Klassen "verb", "nomen" oder keine davon bekommt. Per CSS sorgst Du dafür, dass ein solcher Button einen roten oder blauen unteren Rand bekommt. Jeder Button bekommt noch einen name, den einstellten Wert speicherst Du im value-Attribut. Wenn die Seite auch vorlesefähig sein soll, braucht man hier noch etwas Arbeit mit Aria-Attributen - ich bin aber nicht so sicher, ob sich eine solche Aufgabe für Blinde überhaupt eignet oder ob die eine ganz andere Didaktik brauchen.

Wie auch immer - und dann eintragen in eine Tabelle? Wozu? Steck den Text in ein Form, und mach einen Submit-Button drunter. Fertig. Die Buttons werden dann mit name und value zum Server geschickt.

Je nachdem, wie gut Du in JS bist, kannst Du die Erzeugung der Buttons sogar aus Fließtext automatisieren. Wenn nicht, ok, dann von Hand.

Die Überprüfung sollte aber am Server erfolgen, nicht per JavaScript. Je nachdem, wie fit deine Kiddies sind, gucken sie sonst mal kurz in den Seitenquelltext und lesen die Lösung ab.

So könnte das aussehen

Rolf