Anzeige
Anzeige
Für Links auf dieser Seite erhält GIGA ggf. eine Provision vom Händler, z.B. für mit oder blauer Unterstreichung gekennzeichnete. Mehr Infos.
  1. GIGA
  2. Tech
  3. Digital Life
  4. HTML: Umlaute und Sonderzeichen codieren – so geht’s

HTML: Umlaute und Sonderzeichen codieren – so geht’s


Solange man sich in HTML an die Buchstaben des englischen Alphabets hält, kann man alles einfach schreiben, aber schon ein Ä oder Ö muss extra codiert werden, damit es überall richtig dargestellt wird. GIGA nennt euch die Codes für die wichtigsten HTML-Sonderzeichen und die deutschen Umlaute und erklären euch, nach welchem Prinzip sie aufgebaut sind.

Wenn die HTML-Seite richtig kodiert ist, könnt ihr Sonderzeichen direkt mit der Tastatur einfügen:

ipad-tastatur-sonderzeichen-hd.mp4
ipad-tastatur-sonderzeichen-hd.mp4

HTML Umlaute

Einer der Gebrüder Grimm, der ältere Jacob Grimm, erfand den Begriff „Umlaut“ für jene Zeichen, die sich aus zwei Lauten zusammensetzen und im deutschen mit einem querliegenden Doppelpunkt über dem Buchstaben gekennzeichnet werden.

Anzeige

Hier seht ihr eine Liste aller deutschen und international gebräuchlichen Umlaute sowie deren Kodierung als HTML-Umlaut und in Unicode:

Zeichen Beschreibung HTML Code Unicode in HTML
Ä A Umlaut Ä Ä
ä a Umlaut ä ä
Ë E Umlaut Ë Ë
ë e Umlaut ë ë
Ï I Umlaut Ï Ï
ï i Umlaut ï ï
Ö O Umlaut Ö Ö
ö o Umlaut ö ö
Ü U Umlaut Ü Ü
ü u Umlaut ü ü
Ÿ Y Umlaut Ÿ Ã
ÿ y Umlaut ÿ ÿ
Anzeige

HTML Sonderzeichen

Sonderzeichen in HTML-Code zu schreiben, kann schon deswegen praktisch sein, weil viele von Ihnen ohnehin nicht auf der Tastatur zu finden sind.

Anzeige

Ein Sonderzeichen ist ein Schriftzeichen, das weder ein Buchstabe noch eine Ziffer ist. Zu den Sonderzeichen gehören beispielsweise Satzzeichen, Klammern, Währungszeichen und mathematische Symbole.

In HTML-Dokumenten können Sonderzeichen, ähnlich wie bei den Umlauten, durch sogenannte Zeichen-Entität-Referenzen dargestellt werden. Sie beginnen mit einem Und-Zeichen (&) und enden mit einem Semikolon (;), dazwischen befindet sich eine Zeichenfolge, welche das Zeichen bestimmt. In der folgenden Tabelle haben wir einmal die wichtigsten Sonderzeichen aufgelistet.

Zeichen Beschreibung HTML Code
Unicode in HTML
Erzwungenes Leerzeichen    
& Und-Zeichen, Ampersand & &
ß scharfes S ß ß
© Copyright-Zeichen © ©
® Registriermarke-Zeichen ® ®
Trademark ™ ™
« angewinkelte Anf.zeichen links « «
» angewinkelte Anf.zeichen rechts » »
Bullet (größerer, dickerer Punkt) • •
· Mittelpunkt · ·
¨ Pünktchen oben ¨ ¨
Ellipsis, Auslassungspunkte … …
¡ umgekehrtes Ausrufezeichen ¡ ¡
¿ umgekehrtes Fragezeichen ¿ ¿
¦ durchbrochener Strich ¦ ¦
§ Paragraph-Zeichen § §
º Ordinal-Zeichen männlich º º
ª Ordinal-Zeichen weiblich ª ª
­ kurzer Trennstrich ­ ­
¯ Überstrich ¯ ¯
Absatz-Zeichen ¶ ¶
einfaches Kreuz (Dagger) † †
doppeltes Kreuz ‡ ‡
° Grad-Zeichen ° °
Anzeige

HTML Währungszeichen

Zeichen Beschreibung HTML Code
Unicode in HTML
Euro-Zeichen € €
¢ Cent-Zeichen ¢ ¢
£ Pfund-Zeichen £ £
¤ Währungs-Zeichen ¤ ¤
¥ Yen-Zeichen ¥ ¥
ƒ Florin, Gulden ƒ ƒ

Aufbau der „HTML-Entities“

Man nennt die speziellen Zeichen, die für eine übergreifende Kompatibilität gesondert kodiert werden müssen, auch „HTML-Entities“. Wer sich fragt, warum so etwas überhaupt nötig ist, der sollte sich Folgendes klarmachen:

  • Die Standardzeichensätze der meisten Länder enthalten nur die dort gebräuchlichen Zeichen und können die anderen nicht richtig darstellen.
  • Schon zwischen der Zeichenkodierung von Windows, Apple und Android gibt es Unterschiede, sodass man im Problemfall etwa einen Satz auf dem Mac schreibt und das Ergebnis in Windows fehlerhaft ist.
Anzeige

Aus diesem Grund wurde als systemübergreifende Vereinbarung das System der eindeutigen Zeichenkodierung geschaffen.

Es gelten folgende Gesetzmäßigkeiten bei den HTML-Umlauten und -Sonderzeichen:

  1. Die Zeichen können entweder im HTML-Code oder in Unicode (Ziffern-Code) geschrieben werden.
  2. In beiden Fällen beginnt die Kodierung immer mit einem kaufmännischen Und (&) und endet mit einem Semikolon (;).
  3. Dazwischen steht entweder ein Kurzwort (HTML) oder eine Raute, gefolgt von einer dreistelligen Zahl (Unicode).
  4. Die Kurzworte entstammen der englischen Sprache und sind oft Abkürzungen, wie etwa „copy“ für das Copyright-Zeichen oder „auml“ (a Umlaut) für das kleine ä.
  5. Mit „Umlauten“ sind jene Zeichen genannt, die oben einen Doppelpunkt haben, wie etwa Ä, Ö und Ü. Sie setzen sich zusammen aus dem jeweiligen kleinen oder großen Buchstaben (etwa a oder A) sowie dem Kürzel „uml“ für „Umlaut“. Das große Ä schreibt man also Ä und das kleine ä als ä.

Der Hauptgrund für diese umständliche Schreibweise liegt darin, dass es in den Anfangszeiten von HTML noch keine eindeutige Zeichenkodierung festlegen konnte. Man konnte also nicht sagen: „Jedes Zeichen in dieser Seite wird im Unicode „UTF-8“ dargestellt“. Darum war es nötig, bei solchen nicht international gebräuchlichen Zeichen eine eindeutige Kodierung zu verwenden.

Heute schreibt man das in den Head-Bereich der HTML-Seite:

<meta http-equiv=“content-type“ content=“text/html; charset=UTF-8″>

Bei HTML5 schreibt man stattdessen:

<meta charset=“utf-8″ />

Hat dir der Beitrag gefallen? Folge uns auf WhatsApp und Google News und verpasse keine Neuigkeit rund um Technik, Games und Entertainment.

Anzeige