Schriftgrösse: 100 %
Zeilenhöhe: 0 %
Buchstabenabstand: 0 px
Wortabstand: 0 px

Lieber JOHAN, hier siehst Du ganz viele Buchstaben, Worte und ganze Sätze, wo Du die Grösse der Schrift und Abstände der Buchstaben mit den Reglern oben ändern kannst.

Wir wissen noch nicht, wie Du die am besten lesen kannst! Sei so lieb und probiere das mit Mami oder Papi aus. Macht das grösser oder kleiner bis Du das am besten lesen kannst. Viel Spass!

Lieber JOHAN, hier siehst Du ganz viele Buchstaben, Worte und ganze Sätze, wo Du die Grösse der Schrift und Abstände der Buchstaben mit den Reglern oben ändern kannst.

Wir wissen noch nicht, wie Du die am besten lesen kannst! Sei so lieb und probiere das mit Mami oder Papi aus. Macht das grösser oder kleiner bis Du das am besten lesen kannst. Viel Spass!

Statische Beispiele

(1) `class="space0"`

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur non felis dolor. Fusce rutrum velit quis sem luctus ultrices. Vivamus bibendum mollis enim, vel auctor massa convallis accumsan. Curabitur laoreet nunc vel leo laoreet sed feugiat elit tempor.

(2) `class="space1"`

(3) `class="space2 blur2"`

(4) `class="space4"`

(5) `class="space8 shadow1"`

(6) `class="space4 shadow2 size36"`

(7) `class="space8 size48"`

Schrift optimal einstellen

Absicht

Kind kann hier Text in verschiedener "Streckung/Stauchung" der Buchstaben sehen und erfahren (CSS: letter-spacing). Eine Anpassung wird vorallem von lese- und rechtschreibschwachen Kindern als angenehmer empfunden. Eine serifenfreie Schriftart (CSS: font-family: sans-serif; ) unterstützt diesen Effekt. (Quelle: alphaPROF)

JOHAN soll genau wie in Schule bzw. Flex-und-Flo mit Buchstaben arbeiten.

Legende

Das sind die benutzen CSS-Klassen für die statischen Beispiele:

div.cont { font-family: sans-serif; font-size: 24px; }
div.cont h3 { background-color: #DDDDDD; padding: 4px;}
div.cont p.size24 { font-size: 24px; }
div.cont p.size36 { font-size: 36px; }
div.cont p.size48 { font-size: 48px; }
div.cont p.space0 { letter-spacing: normal; }
div.cont p.space1 { letter-spacing: 1px; }
div.cont p.space2 { letter-spacing: 2px; }
div.cont p.space4 { letter-spacing: 4px; }
div.cont p.space8 { letter-spacing: 8px; }
div.cont p.shadow1 { text-shadow: 1px 1px #CCCCCC; }
div.cont p.shadow2 { text-shadow: 2px 2px #ff0000; }
div.cont p.shadow4 { text-shadow: 4px 4px #ff0000; }
div.cont p.blur2 { text-shadow: 2px 2px 8px #ff0000; }

Dies ist mit einem WYSIWYG-Programm ¹ (z.B. MS Word) nicht zu machen! Diese Art Software ist aber an Schulen nach wie vor sehr beliebt beim Fachpersonal, in Unkenntnis der Möglichkeiten moderner Browser.

Ausblick

Wenn das Ding getestet ist und ins Rollen kommt, bietet es sich sofort an auch seine "Rechtschreibschwäche" auf diese Art zu kurieren. Dann natürlich statt NumPad sowas wie Komponente CharPad, WordPad, TextPad. etc. Da ist Fantasie gefragt! So wie Rätsel oder einfache Spiele (Games wie Memory). Hatte ich bei CC in Java gemacht. Viel zu umständlich und grausam zu deployen. Browser-App ist definitiv besser.

LG evomath.

Statische Beispiele

(1) class="space0"

(2) class="space1"

(3) class="space2 blur2"

(4) class="space4"

(5) class="space8 shadow1"

(6) class="space4 shadow2 size36"

(7) class="space8 size48"