Zurück || Weiter Index Startseite
HTML Einführung: Sonstige HTML-Tags
Allerhand Kleinigkeiten

Verweise

In diesem Kapitel finden Sie Informationen über:

  1. Trennlinien
  2. weitere Textattribute
  3. Kommentare im Dokument
  4. E-Mail versenden, Links auf FTP, Telnet usw.
  5. Verweise auf Daten ohne HTML-Aufbau
  6. Scrolling - Explorer spezifisch!
  7. Farben fürs HTML-Dokument
  8. Zeichengröße, -aussehen und -farbe verändern

Allgemeines

In diesem Kapitel wollen wir uns mit den Tags beschäftigen, die nicht so recht in eines der bisherigen Kapitel passten oder aus Gründen der Übersicht ausgelassen wurden. Ausgenommen davon sind Formulare, denen noch ein eigenes Kapitel gewidmet sein wird.

Diese Einführung wurde mit Netscape Communicator 4.5™ getestet und auch mit MS Internet Explorer™, den zwei bislang weitverbreitetsten Web-Browsern. Mathematischen Formelsatz unterstützt keiner der beiden Browser (und dieser ist nicht einmal in HTML 4.0 vorgesehen!). - Oje, Wissenschaft, vernachlässigtes Geschöpf!

Netscape und Internet Explorer interpretieren leider überhaupt viele unterschiedliche Nicht-Standard-HTML Tags (z.B. <marquee>), worauf man bei der Erstellung von HTML-Seiten zusätzlich Acht geben muss: Vernachlässigt man dieses Faktum, kann es passieren, dass man HTML-Seiten erstellt, die die Benutzer des einen Browsers nicht oder nur teilweise lesen können! - (Anm.: Der Autor empfiehlt daher Browser-spezifische Tags erst gar nicht zu verwenden).

Trennlinien

Zunächst einmal das wohl wichtigste der restlichen Formattags: <hr> (engl. Horizontal Rule). Dieses Tag beendet einen Absatz und zieht eine waagerechte Linie über die Seite hinweg. Folgende Optionen stehen zur Verfügung:

  • align=left | center | right  (Ausrichtung)
  • size= (Dicke/Höhe in Pixel)
  • width= (Breite in Pixel oder Prozent)
  • noshade (ohne Schatteneffekt)
Beispiele:
<hr>
<hr width=400 align="right">
<hr align="left" size=1 width="80%" noshade>

Weitere Textattribute

Fehlen noch einige Tags für die Hervorhebung von Text:

weitere Tags zur Hervorhebung von Text
Befehl Auswirkung
 <address>...</address>  Eine Hervorhebung für e-mail Adressen:
peter.bittner@gmx.net
 <blink>...</blink>  Lässt den Text blinken!   (Netscape™ spezifisch!)
 <em>...</em>  Betonung, Hervorhebung, von engl. emphasize
 <strike>...</strike>  Text durchgestrichen, von engl. strikeout
 <strong>...</strong>  Starke Betonung, Hervorhebung, von engl. strong
 <sub>...</sub>  Stellt den Text tiefgestellt dar.
 <sup>...</sup>  Stellt den Text hochgestellt dar.

Kommentare

Das Tag <!--  --> erlaubt es, Kommentare in das HTML-Dokument aufzunehmen, um Sachverhalte zu erklären, Anmerkungen im Quellcode zu plazieren, die dem Betrachter nicht angezeigt werden sollen, oder einfach Teile des Dokuments auszukommentieren:

<!-- ... Das ist ein Kommentar ... -->
<!-- Mehrzeilige Kommentare schauen
  so aus... (mit 2 Slashes vor dem Kommentar-Ende)
//-->

E-Mail versenden, FTP, Newsgroups, Telnet

Oft ist es hilfreich, wenn der Leser dem Verwalter des HTML-Dokumentes per e-mail Kommentare und Informationen zuschicken kann. Dazu dient erneut das Tagpaar <a href="Option">...</a>. Ist Option vom Format mailto:email-adresse, so wird beim Anklicken des Verweises der systemeigene Mail-Client (Postprogramm) aufgerufen. - Von der Adresse mit dem Zeichen ? getrennt, können Sie dem Benutzer Teile der e-mail sogar vorgeben bzw. diverse Optionen einstellen: (alle mit & kombinierbar!)

  • "mailto:name@adresse?subject=Text" (subject vorgeben)
  • "mailto:name@adresse?body=Text" (Text der e-mail vorgeben)
  • "mailto:name@adresse?Cc=name2@adresse" (Kopie an ...)
  • "mailto:name@adresse?Bcc=name2@adresse" (Blind Carbon Copy an ...)
  • "mailto:name@adresse?subject=Feedback&body=Lieber Peter," (Kombination von Optionen!)
Beispiele:
<a href="mailto:mutti@daham.at">E-mail an Mama</a>
<a href="mailto:peter.bittner@gmx.net?subject=Feedback">
  peter.bittner@gmx.net</a>

Geben Sie mir doch ein Feedback, wie Ihnen diese Einleitung gefällt!

Hinweis: Für einen Zeilenumbruch im body der e-mail notieren Sie bitte "%0D%0A" im Text.

ACHTUNG!  Manche Mail-Clients (an die leitet der Browser die mailto:-Anweisung ja weiter) verstehen u.U. die Notation mit ? nach der Adresse nicht. Es empfiehlt sich deshalb dem Benutzer sicherheitshalber auch eine "blanke" E-Mail Adresse anzubieten.

Weitere Optionen für <a href="Option">...</a>:  (siehe auch: URL)

  • "ftp://ftp_adresse" (Link auf FTP-Server oder Dokument darauf)
  • "gopher://gopher_adresse" (Link zum Gopher-Server)
  • "http://www_adresse" (Link zu HTML-Dokument; absolute WWW-Adresse)
  • "news:newsgroup_adresse" (Link zur angegebenen Newsgroup)
  • "telnet://telnet_adresse" (startet Telnet-Programm mit angegebener Adresse) 

<a href="ftp://ftp.netscape.com">Netscape FTP-Server</a>
<a href="gopher://gopher.greenpeace.org:70/00/gpi">Textdatei
  auf Greenpeace Gopher-Server</a>
<a href="http://www.gesundheitsfoerderung.at">GGF-Homepage</a>
<a href="news://news.tu-graz.ac.at/tu-graz.telematik">
  Telematik-Newsgroup</a>
<a href="telnet://pluto.tu-graz.ac.at">Telnet auf pluto</a>

Verweise auf Daten ohne HTML-Aufbau

Der Aufbau des Verweistags wurde bereits im vorletzten Kapitel ausführlich besprochen. Allerdings bezogen sich die dortigen Beispiele ausschließlich auf andere HTML-Dokumente.

Gibt man nun andere Dokumenttypen an, so schaut der Browser nach, ob er den Typ erkennen kann und, falls ja, ob er (oder das System) für diesen Dokumententyp ein Ausgabeprogramm hat. Ist dies der Fall, so werden die Daten an das entsprechende Programm weitergeleitet und von diesem bearbeitet. - Bei "unbekanntem" Dateityp (d.h. wenn keine Verknüpfung mit einem Anwendungsprogramm vorliegt) zeigt der Browser einen "Speichern unter"-Dialog an; damit können Sie eine Datei zum Download anbieten!

Beispiele:
<a href="song.wav">Spiel mir ein nettes Lied...</a>
<a href="brazil.mid">Braziiil, nana nana nana nanaaa...</a>
<a href="readme.txt">Textdatei README.TXT</a>
<a href="Nets45cm.exe">Download Netscape now!</a>
<a href="htmlkurs.zip">gezippten HTML-Kurs downloaden</a>

Ein paar Wave- und Midi-Files:

Scrolling

Bei MS Internet Explorer™ (und nur dort!) besteht als kleine Zugabe noch die Möglichkeit, einen Scrollingbereich zu definieren, in dem ein Text durchläuft. Dazu dient das Tag <marquee> bzw. </marquee>. Das Format sieht wie folgt aus:

<marquee bgcolor="Red" width="60%" behavior=scroll direction=left>
 Ich bin der Text, der gescrollt werden möchte! </marquee>

Der Text, der durchlaufen soll, steht zwischen dem Anfang- und Ende-Tag. Folgende Optionen stehen zur Verfügung:

  • behavior=alternate | scroll | slide (Art des Effektes)
  • bgcolor= (Hintergrundfarbe des Textes)
  • direction=left | right (Laufrichtung)
  • scrollamount=, scrolldelay= (Scrollgeschwindigkeit: Pixel pro Zustand, Verzögerung)
  • hspace=, vspace= (Abstand des Scrollbereichs zum "normalen" Text: horzontal, vertikal)
  • hight=, width= (Höhe bzw. Breite des Textfeldes; in Pixel oder Prozent)

Ich bin ein netter Text, der gescrollt werden möchte. - Da ich aber ein bößartiger Text bin, vertrage ich mich nur mit MS Internet Explorer! - Netscape Communicator grenze ich mit bößer Absicht aus. Ich will ihn zerstören!!! Mit freundlichen Grüßen, Bad boy Billy.

ACHTUNG!  Beachten Sie bitte, dass dieses Beispiel bei Netscape™ und anderen Browsern nicht funktioniert! - Dort steht der Text ganz ordinär mitten im Dokument...

Farben für das HTML-Dokument

Im <body>-Tag kann auch die Farbe von Hintergrund, Text und Links des HTML-Dokuments bestimmt werden. Dazu existieren für dieses Tag (neben der uns schon bekannten background-Option) zusätzliche Farboptionen mit dem allgemeinen Format:
    Option="Farbe"
Farboptionen für das <body>-Tag
Option Bedeutung/Auswirkung
 bgcolor  Hintergrundfarbe des Dokuments
 text  Farbe des normalen Textes (außer Verweise)
 link  Farbe der unbenutzten Verweise
 vlink  Farbe der benutzten Verweise
 alink  Farbe der Verweise, wenn sie angeklickt werden

Farbe kann dabei ein englischer Farbname sein oder eine Werteangabe im Format #RRGGBB. - Dabei stellen RR GG BB die roten, grünen und blauen Farbanteile laut additiver Farblehre an der definierten Farbe dar und sind als hexadezimale Werte von jeweils 00 bis FF zu definieren.

HTML-Textkonstanten für RGB-Farben
Farbname Farbe hexadezimal
 Aqua   #00FFFF
 Black   #000000
 Blue   #0000FF
 Fuchsia   #FF00FF
 Gray   #808080
 Green   #008000
 Lime   #00FF00
 Maroon   #800000
 Navy   #000080
 Olive   #808000
 Purple   #800080
 Red   #FF0000
 Silver   #C0C0C0
 Teal   #008080
 White   #FFFFFF
 Yellow   #FFFF00

Eine gültige Farbangabe innerhalb eines kompletten Body-Tags wäre z.B.:

<body bgcolor="black" text="white" link="#00FF40"
  vlink="#0000EE" alink="#FFFF00">

Hinweis: Abhängig von der Anzahl der Farben, die der Grafikmodus darstellen kann, ist es möglich, dass der Browser die definierte Farbe an eine der laut Grafikmodus verfügbaren Farben annähert.

Zeichengröße, -aussehen und -farbe verändern

Mit dem Tagpaar <font>...</font> kann das Aussehen der Schrift, die zur Darstellung des Textes verwendet wird, festgelegt werden. Neben Größe und Farbe kann man auch die zu verwendende Schriftart vorschreiben. Format:
    <font Option="Wert"> Text </font>
Für Option kommen hierbei folgende Belegungen infrage:

  • color= (Farbe des Textes)
  • face= (Namen der Schriftart(en); z.B. "Arial, Helvetica, ...")
  • size= (Größe des Textes)
Beispiel:
<font face="Times New Roman" size=3 color="green">
  Grüner Text in Times New Roman und Gr&ouml;&szlig;e 3... </font>

Bemerkung zur Option face:
Ist die erstgenannte Schriftart am Zielcomputer nicht vorhanden, wird die nächste Schriftart nach dem Beistrich verwenden. Ist keine der Schriften zu finden, verwendet der Browser seine Standard-Schriftart zur Darstellung. - Die Schrift kann also anders aussehen als bei Ihnen am Computer!!!

Tip: Schriften, die auf den gängisten Plattformen (PC/Windows, Unix/Linux, Macintosh) in etwa gleich aussehen, erhalten Sie mit folgenden Tags:
  • Serifenlose Schrift:
  • Serifen-Schrift:
  • Festbreiten-Schrift:
<font face="Helvetica,Sans-Serif" size=2> ... </font>
<font face="Times,Serif" size=3> ... </font>
<font face="Courier New,Courier" size=2> ... </font>

Beispiel für absolute (size=n) und relative (size=±n) Größenangaben:
Dies ist Fontgröße 5
Dies ist Fontgröße 4
Dies ist Fontgröße 3
Dies ist Fontgröße 2
Dies ist Fontgröße 1
Dies ist Fontgröße +2
Dies ist Fontgröße -1

Zusammenfassung und Beispiel

Da alle Tags bereits mit Beispielen erläutert wurden, gibt es an dieser Stelle kein Beispiel. - Ätsch!

Im nächsten Kapitel wollen wir uns mit Formularen beschäftigen.

 

Zurück || Weiter Index Startseite
Version 1.2, Jänner 2000 - Copyright © 1999-2000 by Peter Bittner