 |
 |
Startseite | | | Stichworte | | | | |
|
| |
|
Schriften
Inhalte, auch von Internetseiten, werden über Sprache und Schrift transportiert. Die Schrift sollte zum Inhalt der Seite und zum Medium passen, weshalb ausgefallene Schriften wie z.B. 
sich meist nur für Überschriften anbieten. Für die Texte werden im Internet zumeist serifenlose Schriften, wie Arial oder Verdana bevorzugt >> weiter.
Noch im Jahre 2001 wurden oftmals Formatierungen direkt im Text vorgenommen, was von Webdesignern ein hohes Maß an Disziplin erforderte, sollten doch die Formatierungen der Überschriften in allen Texten gleich sein. Abhilfe schafften externe Style Sheets (CSS) Dateien in denen die relevanten Stilinformationen für alle Dokumente gespeichert werden >> weiter.
In der deutschen Sprache haben wir die Besonderheit der Umlaute. In den Anfängen des Internets musste deshalb oftmals ein "ä" in "ae" umgeändert werden, um beim Empfänger nicht als unleserliches Sonderzeichen dargestellt zu werden. Mittlerweile ist die korrekte Darstellung von Umlauten möglich, allerdings muss hierfür im Kopfteil (Header) einer HTML-Datei definiert werden, welche Kodierung angewandt werden soll >> weiter.
Schriften in HTML |
|||||||||||||||||||||||||||||||
|
Die Schriftgröße kann in HTML einen Wert zwischen 1-7 annehmen, wobei 3 der Standartgröße der im Browser eingestellten Schrift entspricht. Relativ dazu ist die Schriftgröße 1 und 2 kleiner und die Schriftgrößen 4-7 größer. Wurde im Browser eine Standartschriftgröße von 14 Punkt festgelegt, so wird die Schriftgröße relativ dazu vergrößert bzw. verkleinert. Das heißt, die Darstellung des Textes ist von Benutzer zu Benutzer unterschiedlich. Weitere Formatierungsmöglichkeiten siehe >> Parameter. Ebenfalls zu beachten ist, das im Browser nur Schriftarten dargestellt werden können, die auf dem Computer des Betrachters installiert sind. Bei unbekannten Schriften werden vom Browser alternative Schriften genommen, die auf dem heimischen PC installiert sind. Um dies zu umgehen bleibt nur noch die betreffenden Textstellen als Grafik einzubinden, ein Verfahren, das sich nur bei kleineren Texten wie zum Beispiel Überschriften anbietet, weil sich die Ladezeiten ansonsten unangemessen verlängern. |
|||||||||||||||||||||||||||||||
Beispiel |
|||||||||||||||||||||||||||||||
|
Bei einer Standardbrowsereinstellung von 14 Punkt werden Schriften mit dem Wert 3 in 14 Punkt dargestellt: Es handelt sich hier um Verdana Schriftgröße 3 Bei einer Standarteinstellung von 16 Punkt wird daraus: Es handelt sich hier um Verdana Schriftgröße 3 |
|||||||||||||||||||||||||||||||
Parameter |
|||||||||||||||||||||||||||||||
|
|||||||||||||||||||||||||||||||
 |
|||||||||||||||||||||||||||||||
Cascading Style Sheets |
|||||||||||||||||||||||||||||||
|
Mit Cascading Style Sheets (CSS) können alle Arten von Formatierungen festgelegt werden. Am Einfachsten legt man eine externe CSS Datei, z.B meineseite.css an, in der die gewünschten Formatierungen, wie Schriftart, Schriftgröße, Seiteneinzüge und Zeilenabstände, aber auch farbige Scrollbalken oder das gesamte Seitenlayout festlegt werden können. Um diese Stile einer Datei zuzuweisen, muss im Kopfteil (<head>) auf die externe Syle Sheet Datei verwiesen werden; Beispiel: <link href="../meineseite.css" rel="stylesheet" type="text/css" media="all">. Vorteil einer externen CSS Datei ist, dass innerhalb des Textes kaum noch Formatierungen erfolgen müssen. Änderungen können leicht durch die Bearbeitung der zentralen Datei durchgeführt werden. Es können verschiedenen Elementen, wie z.B. einem Absatz, Aufzählungen, Überschriften oder Tabellenzellen in einem Text unterschiedliche Stile zugewiesen werden. Wird Text mit Punktgrößen formatiert, können Menschen mit Sehschwäche die Schriftgröße im Browser nicht ihren individuellen Bedürfnissen anpassen. Um Barrierefreiheit zu gewährleisten sollten die Formatierung immer relativ erfolgen. CSS Dateien können unter dem Link: http://jigsaw.w3.org/css-validator/validator-uri.html validiert werden. Anders als beim "W3C Markup Validation Service" ist dieser Service in deutscher Sprache verfügbar. |
|||||||||||||||||||||||||||||||
Beispiel |
|||||||||||||||||||||||||||||||
| body { background-image: url("grafiken/hinten.jpg"); padding-right: 25px; padding-left: 25px } p { font-size: 80%; font-family: Verdana; line-height: 140%; text-align: justify } td { font-size: 80%; line-height: 140% } h1 { color: #000066; font-size: 120%; font-family: Verdana; font-weight: bold; line-height: normal; margin-top: 5pt } h2 { font-size: 90%; font-family: Verdana; font-weight: bold; line-height: normal; margin-top: 5pt } h3 { color: white; font-size: 80%; font-family: Verdana; font-weight: bold; line-height: normal; margin-right: 5pt; margin-bottom: 5pt; margin-left: 5pt } li { font-size: 10pt; font-family: Verdana; line-height: 13pt; margin-top: 0; margin-bottom: 0 } >> Parameter |
|||||||||||||||||||||||||||||||
|
|||||||||||||||||||||||||||||||
ID Styles |
|||||||||||||||||||||||||||||||
|
Um innerhalb eines Textes einem Textblock, wie z.B. einer Adresse, andere Stile als dem übrigen Text zuweisen zu können gibt es die ID Styles. Hier wird einem Absatz ein Name (ID) gegeben. Beispiel: Zur Hervorhebung der Adresse haben wir die Schriftfarbe "rot" und als Hintergrundfarbe "gelb" gewählt. In der CSS Datei sieht es wie folgt aus: #adresse /* Formatierung für die Adresse */ { color: red; background-color: yellow }. Die Definition kann innrhalb der Datei (interne Style sheets) oder in der externen CSS Datei erfolgen. |
|||||||||||||||||||||||||||||||
Beispiel |
|||||||||||||||||||||||||||||||
Prioritäten |
|||||||||||||||||||||||||||||||
|
Bei der Anwendung von Style Sheets muss auf die Prioritäten geachtet werden. Direkte Formatierungen im Text überschreiben interne Style Sheets. Diese Wiederum haben Vorrang vor Regeln in einer externen Style sheet Datei und externen Style Sheets wird eine Prioritätsstufe im Verhältnis zu anderen zugewiesen. Standardmäßig ersetzt das Style Sheet der Web-Seite die Voreinstellungen des Browsers. |
|||||||||||||||||||||||||||||||
|
|||||||||||||||||||||||||||||||
Kodierung |
|||||||||||||||||||||||||||||||
|
Den Beginn nahm das World Wide Web im englischsprachigen Raum, wo es keine Sonderzeichen gibt, und breitete sich von dort aus. Im ASCII (American Standard Code) gibt es deshalb nur 128 Zeichen, die deutschen Umlaute gehören nicht dazu. In der ISO 8859-1 gibt es die doppelte Anzahl an Zeichen (256, 8-Bit). Mit dieser Kodierung können die meisten westlichen und mitteleuropäischen Sprachen gut dargestellt werden. Für die richtige Umsetzung der Zeichen wurde im <head> einer HTML Seite die betreffende Kodierung definiert: <meta http-equiv="content-type" content="text/html;charset=iso-8859-1"> Allerdings musste im Quelltext aus einem "ä" "ä" werden, um im Browser richtig dargestellt zu werden. Waren die Zeichen nicht definiert wurden in Firefox nur noch Fragezeichen, bzw. im Internetexplorer Vierecke gezeigt. Diese Einschränkungen werden in Unicode beseitigt. Unicode (Dt. etwa: "Einheitsschlüssel") ist eine Form der Kodierung von Zeichensätzen für das Internet mit dem alle weltweit verfügbaren Textzeichen, wie Buchstaben, Silbenzeichen, Satzzeichen, Sonderzeichen und Ziffern, darstellbar gemacht werden sollen. Verantwortlich für den Unicode Standard ist das in Kalifornien ansässige "Unicode Consortium". Unicode wurde vom World Wide Web Consortium" (W3C) in den Standard von HTML 4.0 aufgenommen. Unicode hat mit seinen 100 000 Zeichen den Anspruch alle bekannten Schriftsysteme darstellen zu können. Die wichtigsten Unicode Kodierungen zur Zeit sind UTF-16 (16 Bit) und UTF-8, die die Unicode Zeichen in 8 Bit darstellt. Die betreffende Zeile im Header sieht wie folgt aus: <meta http-equiv="content-type" content="text/html;charset=utf-8"> |
|||||||||||||||||||||||||||||||
Links zum Thema |
|||||||||||||||||||||||||||||||
|
|
|||||||||||||||||||||||||||||||
|
| Startseite | | | Kontakt | | | Impressum | | | Letzte Aktualisierung: Sonntag 23.12.2007 |