text-transform: uppercase – über CSS-Anweisung Text in Großbuchstaben anzeigen lassen

In manchen Fällen ist es sinnvoll, dass wir eine Textausgabe komplett in Großbuchstaben ausgeben lassen. Die Betonung liegt auf „ausgeben lassen“. Wir müssen also nicht unseren Text im HTML-Code anfassen und dessen korrekte Groß- und Kleinschreibung zerstören, sondern haben über eine CSS-Anweisung die Möglichkeit, die Ausgabe wie gewünscht zu ändern.

Angenommen wir wollen eine Überschrift in Großbuchstaben ausgeben lassen, dann haben wir in unserem HTML-Code den korrekt geschriebenen Text:

<h1>Überschrift in korrekter Groß- und Kleinschreibung</h1>

Und nun können wir über die CSS-Anweisung text-transform: uppercase; die Ausgabe entsprechend ändern:

Unser CSS-Code:

h1 {
    text-transform: uppercase;
}

Als Ergebnis erhalten wir damit dann:

mögliche Werte bei text-transform

Über CSS können wir verschieden Werte zuweisen.

Anmerkung zum Lesefluss von Großbuchstaben

Die Lesegeschwindigkeit ist für geübte Leser deutlich langsamer durch eine komplette Großschreibung. Der Grund ist sehr einfach. Wir erkennen Wörter am Wortumriss – wir müssen also nicht mehr Buchstabe für Buchstabe lesen, sondern erkennen je nach Übungsstand auch mehrere Wörter nacheinander am Umriss. Dadurch sind sehr hohe Lesegeschwindigkeiten möglich. Das ist auch der Grund, warum Schreibfehler „ungünstig“ sind. Diese können (je nachdem wo sich der Schreibfehler eingeschlichen hat) den Wortumriss zerstören und somit die Lesegeschwindigkeit stören.

Daher sind manche Schreibfehler wie ein vertauschtes „m“ und „n“ deutlich schwerer für den Schreiber sichtbar, da diese beim Überfliegen nicht so stark auffallen.

Geschichtliches zur Großschreibung

Mit Großschreibung wurde in den Zeiten von Schreibmaschinen (ja das Gerät, das ohne Strom auskam, aber Papier benötigte) Wörter dadurch hervorgehoben, dass diese komplett in Großbuchstaben geschrieben wurden.