1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>SELFHTML: HTML/XHTML / Allgemeine Regeln fr HTML / Zeichenvorrat, Sonderzeichen und HTML-eigene Zeichen</title>
<meta name="description" content="Was Sie ber Zeichen in HTML-Texten wissen sollten, wie Sie deutsche Umlaute und scharfes S umschreiben, wie Sie das Euro-Zeichen in HTML notieren knnen und welche HTML-eigenen Zeichen Sie in jedem Fall umschreiben mssen.">
<meta name="keywords" content="SELFHTML, HTML, Zeichen, Zeichenkodierung, Unicode, ISO 8859-1, Latin-1, ISO 10646, Umlaute, Sonderzeichen, Euro, Euro-Zeichen, Eurozeichen, Euro-Symbol, HTML-eigene Zeichen">
<meta name="author" content="Redaktion SELFHTML, selfhtml81@selfhtml.org">
<meta name="robots" content="noindex, nofollow">
<meta name="DC.Publisher" content="SELFHTML e. V.">
<meta name="DC.Date" content="2005-11-16T01:48:05+01:00">
<meta name="DC.Identifier" content="http://de.selfhtml.org/html/allgemein/editieren.htm">
<meta name="DC.Language" content="de">
<meta name="DC.Rights" content="../../editorial/copyright.htm">
<meta name="DC.Date.created" content="2001-10-27T08:00+01:00">
<meta name="SELF.Pagetype" content="page">
<link rel="stylesheet" type="text/css" href="../../src/selfhtml.css">
<link rel="alternate" type="application/atom+xml" title="SELFHTML-Weblog (Atom, gesamt)" href="http://aktuell.de.selfhtml.org/weblog/atom-feed">
<link rel="alternate" type="application/rss+xml" title="SELFHTML-Weblog (RSS, Auszge)" href="http://aktuell.de.selfhtml.org/weblog/rss-feed">
<link rel="shortcut icon" type="image/x-icon" href="../../src/favicon.ico">
<link rel="author" title="Impressum" href="../../editorial/impressum.htm">
<link rel="contents" title="Inhaltsverzeichnis" href="../../navigation/inhalt.htm">
<link rel="index" title="Stichwortverzeichnis" href="../../navigation/stichwort.htm">
<link rel="search" title="Suche" href="../../navigation/suche/index.htm">
<link rel="help" title="Hilfe" href="../../editorial/index.htm">
<link rel="copyright" title="Urheberrecht" href="../../editorial/copyright.htm">
<link rel="top" title="SELFHTML" href="../../index.htm">
<link rel="up" title="Allgemeine Regeln fr HTML" href="index.htm">
<link rel="next" title="Farben definieren in HTML" href="farben.htm">
<link rel="prev" title="Regeln beim Editieren von HTML" href="editieren.htm">
<link rel="first" title="Textauszeichnung" href="textauszeichnung.htm">
<link rel="last" title="Guter HTML-Stil" href="stil.htm">
</head>
<body>
<table cellpadding="4" cellspacing="0" border="0" width="100%">
<tr>
<td colspan="2" class="nav"><a class="an" name="top"><img src="../../src/refkap.gif" width="16" height="13" alt="Teil von"></a> <a href="../../index.htm">SELFHTML</a>/<a href="../../navigation/index.htm" target="_parent" class="navh">Navigationshilfen</a> <img src="../../src/refkap.gif" width="16" height="13" alt="Teil von"> <a href="../index.htm">HTML/XHTML</a> <img src="../../src/refkap.gif" width="16" height="13" alt="Teil von"> <a href="index.htm">Allgemeine Regeln fr HTML</a></td>
</tr>
<tr>
<td class="doc" width="110"><a href="../../index.htm"><img src="../../src/logo.gif" width="106" height="109" border="0" alt="SELFHTML"></a></td>
<td class="docbot" width="100%"><h1 class="ph1">Zeichenvorrat, Sonderzeichen und HTML-eigene Zeichen</h1></td>
</tr>
<tr>
<td class="doctop">
<img src="../../src/dokx.gif" width="30" height="20" vspace="6" alt="Informationsseite">
</td>
<td valign="top" nowrap="nowrap">
<p>
<img src="../../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#allgemeines">Allgemeines zu Zeichen in HTML</a><br>
<img src="../../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#umlaute">Deutsche Umlaute und scharfes S</a><br>
<img src="../../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#euro">Das Euro-Zeichen in HTML</a><br>
<img src="../../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#html_eigene">HTML-eigene Zeichen maskieren</a><br>
</p>
</td>
</tr>
<tr><td colspan="2" class="doc"> <a href="#bottom"><img src="../../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a> </td></tr>
</table>
<h2><a class="an" name="allgemeines">Allgemeines zu Zeichen in HTML</a></h2>
<p>Wenn Sie Ihre Texte - sagen wir in deutscher Sprache - einfach in einen HTML-Editor eintippen, den Text mit Hilfe von HTML-Elementen strukturieren und sich das Ganze dann im Web-Browser anzeigen lassen, wird in der Regel der gesamte eingegebene Text korrekt angezeigt. Das klingt selbstverstndlich - ist es aber nicht. In der HTML-Datei stehen nmlich nicht Ihre eingegebenen Buchstaben und anderen Zeichen, sondern nur Bytes, also letztlich Einsen und Nullen.</p>
<p>Beim Speichern der Buchstaben muss Ihr HTML-Editor nun einen bestimmten Algorithmus anwenden, um die Zeichen in Bytes umzuwandeln. Der Web-Browser muss dieselbe Methode rckwrts anwenden, um alle Zeichen im HTML-Dokument korrekt zu erkennen. Diese Methode wird <b>Zeichenkodierung</b> genannt. Es gibt viele verschiedene davon, z.B. speziell zur Speicherung von westeuropischen, kyrillischen oder arabischen Zeichen. Genaueres ber Zeichenkodierungen erfahren Sie im Kapitel <img src="../../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../../inter/sprache.htm">Computer und geschriebene Sprache</a>.</p>
<p>Eine solche Zeichenkodierung greift auf eine bersetzungstabelle (<b>Codetabelle</b>) zurck, die jedem Zeichen, das verwendet werden kann, eine fortlaufende Nummer (einen <b>Code</b>) zuweist. So hat z.B. der lateinische Buchstabe "a" in der <img src="../../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../../inter/unicode.htm">Unicode</a>-Zeichentabelle die (dezimale) Nummer 97, "b" 98, "c" 99 und so weiter. Die Menge der Zeichen in einer solchen Tabelle wird <b>Zeichenvorrat</b> genannt.</p>
<p>Da unzhlige Kodierungen fr HTML-Dateien verwendet werden knnen, ist es unbedingt notwendig, dass der Browser diejenige Kodierung anwendet, mit welcher der Editor die HTML-Datei gespeichert hat. Sie sollten daher einen Editor verwenden, in dem Sie beim Speichern die Kodierung whlen knnen. Zudem sollte die HTML-Datei eine Angabe zur verwendeten Zeichenkodierung enthalten oder sie sollte zumindest durch den Webserver in der HTTP-Antwort bermittelt werden. Wenn eine solche Angabe fehlt, dann ist die HTML-Datei gem dem HTML-Standard fehlerhaft. Ein Web-Browser darf die verwendete Kodierung strenggenommen nicht "erraten".</p>
<p>Allerdings sind die Browser in diesem Punkt uerst tolerant und greifen zumeist auf die voreingestellte Kodierung zurck. In Ihrem Browser, der wahrscheinlich eine englische oder deutschsprachige Benutzerfhrung hat, ist vermutlich
<img src="../../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../../inter/zeichenkodierungen.htm">ISO 8859-1</a> (Latin-1) eingestellt, die verbreitete Kodierung fr westeuropische Sprachen. Weil der Editor, den Sie beim Eintippen benutzen, vermutlich ebenfalls ISO 8859-1 beim Abspeichern verwendet, klappt scheinbar alles problemlos. Nun kann es aber, wenn Ihre Seiten im Web stehen, auch passieren, dass Besucher aus Osteuropa, Asien usw. vorbeikommen, deren Browser standardmig eine andere Kodierung annehmen. Solche Besucher werden dann lauter Zeichen aus der Codetabelle ihres eigenen, vertrauten Zeichencodes sehen - aber es wird ein wilder, sinnloser Zeichensalat sein.</p>
<p>HTML bietet Ihnen deshalb die Mglichkeit an, dem Browser mitzuteilen, welche Zeichenkodierung die Datei verwendet. Im Kopf einer HTML-Datei notieren Sie dazu in einem so genannten Meta-Tag eine <img src="../../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../kopfdaten/meta.htm#zeichenkodierung">Angabe zur Zeichenkodierung</a>. Eine solche Angabe ist unbedingt zu empfehlen, da Sie dem Browser die Entscheidung leichter macht, wie die Bytes der HTML-Datei in Zeichen umzuwandeln sind. Dann liegt es am Browser, die von Ihnen gemeinten Zeichen auf dem Bildschirm beispielsweise eines Seitenbesuchers aus Fernost so anzuzeigen, wie Sie sie eingetippt haben.</p>
<p>Die verbreiteten ISO-Kodierungen arbeiten mit einem Zeichenvorrat von 256 Zeichen. Dies hat den Vorteil, dass ein Zeichen immer genau mit einem Byte dargestellt wird. Somit lassen sich mit solchen Kodierungen nur 256 unterschiedliche Zeichen speichern. Trotzdem ist der Zeichenvorrat von HTML - das heit die Menge aller verwendbaren Zeichen, unabhngig von der Art, wie sie in Bytes gespeichert werden - nicht auf den Zeichenvorrat der verwendeten Kodierung beschrnkt. In einem HTML-Dokument knnen grundstzlich alle Zeichen aus <img src="../../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../../inter/unicode.htm">Unicode</a> verwendet werden. Fortschrittliche Kodierungen wie UTF-8 knnen alle Zeichen des Unicode-Standards direkt in Bytes bzw. Byteketten kodieren.</p>
<p>Wenn Sie im Text einzelne Zeichen eingeben wollen, die nicht im Zeichenvorrat der verwendeten Kodierung enthalten sind, knnen Sie zwischen zwei Mglichkeiten whlen: Entweder Sie verwenden eine spezielle numerische Notation. Fr hufiger verwendete Sonderzeichen stellt HTML aber auch so genannte <b>benannte Zeichen</b> zur Verfgung. Fr beide Mglichkeiten sollten Sie sich mit der <img src="../../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../referenz/zeichen.htm">HTML-Zeichenreferenz</a> beschftigen.</p>
<p class="doc"><a href="#top"><img src="../../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="umlaute">Deutsche Umlaute und scharfes S</a></h2>
<p>Wenn Sie Kodierungen wie ISO 8859-1 oder UTF-8 verwenden, knnen Sie die deutschen Umlaute direkt in Ihrem Editor eintippen. Sofern Sie die besagte Angabe zur Zeichenkodierung im Kopf der HTML-Datei notieren, knnen Sie davon ausgehen, dass aktuelle und auch ltere Browser die Datei korrekt verarbeiten.</p>
<p>Dennoch gibt es einige Sonderflle, in denen es sinnvoll ist, sich auf die <img src="../../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../../inter/zeichenkodierungen.htm#iso8859">ASCII-Zeichen</a> zu beschrnken, um mgliche Probleme bei der Verarbeitung zu vermeiden. In diesem Fall knnen Sie deutsche Umlaute sowie das scharfe S durch <b>benannte Zeichen</b> umschreiben. Das gilt fr den gesamten Inhalt einer HTML-Datei.</p>
<table class="reftable" cellpadding="3" cellspacing="0" border="1">
<tr>
<th>Zeichen</th>
<th>Ersetzung</th>
</tr>
<tr>
<td class="tabxpl"><code></code></td>
<td class="code"><code>&auml;</code></td>
</tr>
<tr>
<td class="tabxpl"><code></code></td>
<td class="code"><code>&Auml;</code></td>
</tr>
<tr>
<td class="tabxpl"><code></code></td>
<td class="code"><code>&ouml;</code></td>
</tr>
<tr>
<td class="tabxpl"><code></code></td>
<td class="code"><code>&Ouml;</code></td>
</tr>
<tr>
<td class="tabxpl"><code></code></td>
<td class="code"><code>&uuml;</code></td>
</tr>
<tr>
<td class="tabxpl"><code></code></td>
<td class="code"><code>&Uuml;</code></td>
</tr>
<tr>
<td class="tabxpl"><code></code></td>
<td class="code"><code>&szlig;</code></td>
</tr>
</table>
<h3 class="xmp">Beispiel:</h3>
<pre>
In M&uuml;nchen steht ein Hofbr&auml;uhaus.
Dort gibt es Bier aus Ma&szlig;kr&uuml;gen.
</pre>
<h3 class="xpl">Erluterung:</h3>
<p>Die deutschen Sonderzeichen werden durch die entsprechenden benannten Zeichen ersetzt. Auch wenn die Zeichenfolgen irritieren mgen - keine Sorge, die Web-Browser verstehen das und zeigen die Zeichen korrekt an.</p>
<h3 class="inf">Beachten Sie:</h3>
<p>Es gibt eine Menge weiterer Sonderzeichen, die durch solche Umschreibungen dargestellt werden sollten. Diese finden Sie in der <img src="../../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../referenz/zeichen.htm">HTML-Zeichenreferenz</a> aufgelistet.</p>
<p class="doc"><a href="#top"><img src="../../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="euro">Das Euro-Zeichen in HTML</a></h2>
<p>Auch fr das Euro-Zeichen gibt es ein <b>benanntes Zeichen</b> in HTML. Das Euro-Zeichen ist nicht im Zeichenvorrat von ISO 8859-1 enthalten, sodass Sie das benannte Zeichen an dessen Stelle nutzen mssen, wenn Sie diese Kodierung verwenden mchten.</p>
<h3 class="xmp">Beispiel:</h3>
<pre>
Preis: &euro; 199,-
</pre>
<h3 class="xpl">Erluterung:</h3>
<p>Notieren Sie an der Stelle, wo das Euro-Zeichen stehen soll, die Zeichenfolge <code>&euro;</code>.</p>
<h3 class="inf">Beachten Sie:</h3>
<p>Wenn Sie unter Microsoft Windows das Euro-Zeichen ber die Tastenkombination <kbd>AltGr + e</kbd> in die HTML-Datei eintippen, sollten Sie vorsichtig sein. Einige Editoren nutzen standardmig die Kodierung Windows 1252. Diese gleicht ISO 8859-1 weitestgehend. Doch an der Stelle der Codetabelle, wo in ISO 8859-1 einige in HTML nicht verwendete Steuerzeichen liegen, liegen in Windows 1252 unter anderem typographische Anfhrungszeichen, Gedankenstriche und eben das Euro-Zeichen. Ein Browser, der Windows-1252-kodierte HTML-Dateien gem ISO 8859-1 verarbeitet, wird nmlich kein Euro-Zeichen anzeigen, sondern z.B. ein Fragezeichen oder ein kleines Quadrat. Denn an der Stelle des Euro-Zeichens in Windows 1252 liegt in der Codetabelle von ISO 8859-1 ein nicht druckbares Steuerzeichen.</p>
<p>Wenn Sie ISO 8859-1 verwenden wollen und Ihre HTML-Dateien eine entsprechende Angabe zu Kodierung enthalten, sollten Sie es daher vermeiden, das Euro-Zeichen direkt einzugeben. Verwenden Sie entweder beim Speichern eine Kodierung, in deren Zeichenvorrat das Euro-Zeichen vorkommt (z.B. UTF-8 oder ISO 8859-15), sowie einen Editor, der diese Kodierungen korrekt anwendet. Andernfalls knnen Sie einfach das oben beschriebene <code>&euro;</code> notieren. Eine weitere Alternative ist die numerische Notation. Im Unicode-Standard hat das Euro-Zeichen den Dezimalwert 8364 oder den Hexadezimalwert 20AC. In HTML knnen Sie das Euro-Zeichen demnach numerisch so referenzieren: <code>&#8364;</code> oder <code>&#x20AC;</code>.</p>
<p class="doc"><a href="#top"><img src="../../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="html_eigene">HTML-eigene Zeichen maskieren</a></h2>
<p>Wenn in Ihrem Text Zeichen vorkommen, die in HTML eine bestimmte Bedeutung haben,
mssen Sie diese Zeichen maskieren. Die folgenden Zeichen mssen Sie
wie folgt maskieren:</p>
<p>Ersetzen Sie das Zeichen <code>&</code> durch die Zeichenfolge <code>&amp;</code> ("Ampersand")<br>
Ersetzen Sie das Zeichen <code><</code> durch die Zeichenfolge <code>&lt;</code> ("lower than")<br>
Ersetzen Sie das Zeichen <code>></code> durch die Zeichenfolge <code>&gt;</code> ("greater than")</p>
<p>Des Weiteren ist es ratsam, an bestimmten Stellen das Zeichen <code>"</code> durch die Zeichenfolge <code>&quot;</code> ("Quote") zu ersetzen. Dies ist vor allem in Attributwerten sinnvoll.</p>
<h3 class="xmp">Beispiel:</h3>
<pre>
Das ist ein &lt;HTML-Tag&gt;
GmbH &amp; Co. KG
<strong title="bekannt durch den Ausspruch &quot;Ich wei&szlig;, dass ich nichts wei&szlig;!&quot;">
der griechische Philosoph Sokrates</strong>
</pre>
<h3 class="xpl">Erluterung:</h3>
<p>Ersetzen Sie die HTML-eigenen Zeichen wie im obigen Beispiel durch die entsprechenden Zeichenfolgen.</p>
<h3 class="xpl">Beachten Sie:</h3>
<p>Am gefhrlichsten ist die spitze ffnende Klammer (<code><</code>). Wenn Sie dieses Zeichen nicht wie vorgeschrieben maskieren, bringen Sie den Web-Browser mit ziemlicher Sicherheit durcheinander, weil er glaubt, nun wrde ein HTML-Tag folgen. Die anderen HTML-eigenen Zeichen fhren zwar meistens nicht zu Anzeigefehlern, dennoch sollten Sie sie mglichst maskieren.</p>
<table cellpadding="4" cellspacing="0" border="0" width="100%">
<tr><td colspan="2" class="doc">
<a href="#top"><img src="../../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a>
</td></tr>
<tr><td class="doc"><a href="farben.htm"><img src="../../src/next.gif" width="10" height="10" border="0" hspace="10" alt="weiter"></a></td>
<td width="100%"><img src="../../src/dok.gif" width="15" height="10" alt="Seite"> <a href="farben.htm">Farben definieren in HTML</a>
</td></tr>
<tr>
<td class="doc"><a href="grundgeruest.htm"><img src="../../src/prev.gif" width="10" height="10" border="0" hspace="10" alt="zurck"></a></td>
<td><img src="../../src/dok.gif" width="15" height="10" alt="Seite"> <a href="editieren.htm">Regeln beim Editieren von HTML</a>
</td>
</tr>
<tr><td colspan="2" class="doc"> </td>
</tr>
<tr>
<td colspan="2" class="nav"><a class="an" name="bottom"><img src="../../src/refkap.gif" width="16" height="13" alt="Teil von"></a> <a href="../../index.htm">SELFHTML</a>/<a href="../../navigation/index.htm" target="_parent" class="navh">Navigationshilfen</a> <img src="../../src/refkap.gif" width="16" height="13" alt="Teil von"> <a href="../index.htm">HTML/XHTML</a> <img src="../../src/refkap.gif" width="16" height="13" alt="Teil von"> <a href="index.htm">Allgemeine Regeln fr HTML</a></td>
</tr></table>
<p>© 2007 <img src="../../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../../editorial/impressum.htm">Impressum</a></p>
</body>
</html>
|
