Tutorial:Kapitel3

aus NvuWiki, der freien Wissensdatenbank

Kapitel 3

Inhaltsverzeichnis

1 Erstellen von Hyperlinks

Erstellen von Hyperlinks

Die wichtigste Eigenschaft eines HTML Dokuments ist die Fähigkeit, es mit anderen HTML Dokumenten oder anderen Teilen desselben Dokuments zu verlinken. Mit verlinken ist gemeint, dass wir einen Hyperlink erstellen, welcher wenn wir in anklicken, uns mit einem anderem Dokument oder mit einer Stelle des gleichen Dokuments verbindet, welche dann im Browser angezeigt wird. Ein Web Dokument ohne Hyperlink ist wie eine Werbeanzeige ohne Adresse und Telefonnummer, wo man sich näher über ein Produkt informieren kann. Ohne Links müßten Benutzer die URL für jede einzelne Seite, mit der sie das WWW heimsuchen wollen von Hand eintippen und sich die entsprechende Adresse auch merken.

Ein Link hat zwei Enden, einen Anker und eine Richtung. Der Anfangsanker einer Verbindung wird "Quelle"-Anker genannt, der auf den "Ziel"-Anker zeigt. Der Zielanker kann einer der Web Ressourcen, nämlich eine Grafik, ein Audio-Clip, ein Video-Clip, ein HTML Dokument (eine innerhalb oder extern), oder sonstige Datei sein. Zum Beispiel ist der Text GNU am Ende dieses Satzes ein Link (Anfangsanker), der auf die Website www.gnu.org (Zielanker) ziehlt, GNU.

[bearbeiten]

Erstellen von internen Links

Interne Links sind Links zu Ressourcen, des Dokuments welches bearbeitet wird. Mit internen Links kann man leicht in einem Dokument hin und her navigieren. Interne Links sind sehr hilfreich in langen Dokumenten, wo es mehrere Abschnitte gibt. Ein Inhaltsverzeichnis am Anfang, hilft Benutzern, zum gewünschtem Abschnitt des Dokuments zu gelangen.

Um einen internen Link zu erstellen, müssen Sie zuerst den Zielanker definieren. Wir wollen den Zielanker als einen benannten Anker erstellen. Wählen Sie den Text, welcher der Zielort der Verbindung sein soll und klicken dann auf die Anker Schaltfläche auf der Bearbeitungs-Symbolleiste. Dies öffnet den Dialog für die Eigenschaften des Ankers. Nachdem Sie den Text ausgewählt haben welcher zum Anker werden soll, sehen Sie den Text im Eingabefeld des Anker Namen Eigenschafts Dialog. Sie können hier auch einen anderen Namen eintragen. Fig3.1 zeigt den Dialog der Ankernamen-Eigenschaften. Klicken Sie jetzt auf OK, um den ausgewählten Text als Ankernamen zu kennzeichnen.

<img alt="" src="namedAnchor.png">Fig3.1 Named Anchor Properties dialog box

Das einzige was wir jetzt noch tun müssen, um den internen Link zu erstellen ist den Quellenanker zu definieren. Wählen Sie den Text welcher als Link dienen soll aus und klicken dann auf die Schaltfläche "Link" in der Bearbeitungs-Symbolleiste. Dies öffnet den Link Eigenschafts-Dialog. Wählen Sie aus dem DropDown-Menü des Eingabefeldes den Anker aus, welchen wir gerade erstellt haben. Klicken Sie auf OK und speichern die Änderungen ab. Wenn Sie zum Beispiel das Wort 'Anfang' anklicken, kommen Sie an den Anfang dieses Kapitels zurück.

[bearbeiten]

Erstellen von externen Links

Aktive, mit der Maus überdeckte, und besuchte Link-Farben können mit Hilfe von CSS geändert werden.

Externe Links verbinden Ihre Webseiten mit anderen Web Resourcen z.B. eine andere Webseite, eine Grafik, ein Video-Clip usw. Um einen externen Link zu erstellen, wählen Sie den Text aus der als Link dienen soll und klicken dann auf die Schaltfläche "Link" in der Bearbeitungs-Symbolleiste. Dies öffnet den Link Eigenschafts-Dialog. Im Eingabefeld geben Sie die URL für die Webseite oder sonstige Web Resource ein. Die URL kann relativ sein (wenn sie zu Ihrer Website gehört) oder Absolute wenn Sie auf eine Webseite im WWW verweist. Klicken Sie auf OK, um die Änderungen wirksam zu machen und speichern dann das Dokument ab.

Links, die wir mit dem hier erlernten erstellt haben, sehen Sie in unserem Beispiel-Text. Wenn Sie auf die Links im Abschnitt "Interessante Links" des Beispiel Textes klicken, öffnen sie den "Zielanker" in Ihrem Standardbrowser.

Fig3.2 Link Eigenschafts Dialog

[bearbeiten]

Beispiel Text

Unten steht der Beispiel Text. Der Text, der mit den oben erlernten Regeln formatiert wurde, erscheint in schwarzer Farbe.

[bearbeiten]

Beispiel Text

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc ac massa non enim dictum vulputate. Vestibulum iaculis. Maecenas nisl magna, suscipit quis, vulputate nec, egestas vel, enim. Ut venenatis blandit elit. Aliquam erat volutpat. Nam eros. Morbi imperdiet, diam at lacinia luctus, diam lacus porttitor quam, a posuere nulla sem vel diam. Suspendisse quam felis, scelerisque vel, fringilla sit amet, commodo quis, orci. Etiam at eros. Aenean facilisis adipiscing libero. Phasellus malesuada sem ornare nulla. Sed sit amet elit.

Aenean vel turpis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla rhoncus posuere turpis. Phasellus id ante ac wisi hendrerit bibendum. Etiam a mi. Vestibulum malesuada nisl. Vestibulum eget nulla non quam aliquet mattis. Aliquam molestie lacus sit amet metus. Maecenas sit amet turpis posuere purus cursus cursus. Morbi at sem. Quisque malesuada hendrerit mauris. Cras tincidunt dignissim orci. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Quisque magna urna, auctor consectetuer, tristique sit amet, porta sit amet, dui.

[bearbeiten]

Status

Absätze 2
Worte 168

Bytes 1149

[bearbeiten]

Eine nummerierte Liste

Hier sehen Sie eine geordnete d.h. nummerierte Liste. Ungeordnete Listen können auf die gleiche Weise erstellt werden wie geordnete, nur mit der entsprechend anderen Schaltfläche der Formatierungs-Symbolleiste.