Wie erstelle ich einen Link in HTML?

Inhaltsverzeichnis:

Wie erstelle ich einen Link in HTML?
Wie erstelle ich einen Link in HTML?
Anonim

Websites, Blogs, Webseiten - in unserer Zeit bereits geläufige Begriffe. Mit der Entwicklung des Internets sind Websites zum Hosten von Webseiten unglaublich beliebt geworden, und das ist nicht verwunderlich: Für manche Menschen ist es eine Notwendigkeit, eine eigene Website zu haben, für andere ist es eine angenehme Unterh altung. Im ersten Fall sprechen wir normalerweise von Firmen, Körperschaften, Privatunternehmern, wenn sie für ein nachgefragtes Produkt oder eine Dienstleistung werben. Der zweite handelt von Bloggern.

Außerdem gibt es Internetnutzer, die einfach nach Informationen suchen, Blogs lesen, Videos ansehen und so weiter.

Um eine qualitativ hochwertige Website zu erstellen, gibt es viele Möglichkeiten. Wir werden uns auf die Webprogrammierung über HTML konzentrieren.

Was ist HTML

HTML steht für Hyper Text Mark-Up Language. Aus dem Englischen übersetzt bedeutet dies "Hypertext Markup Language".

Mit anderen Worten, HTML ist eine Reihe von Codes, mit denen Sie die Hauptelemente der Website erstellen können, z. B. ihren Rahmenwie Wörter aus Sätzen bestehen.

HTML-Codes werden ausschließlich in lateinischen Buchstaben geschrieben und werden Tags genannt, und jeder Code wird in spitze Klammern eingeschlossen. Einige Tags sind gekoppelt, andere sind nicht gekoppelt.

Paired bedeutet, dass sie unbedingt paarweise verwendet werden müssen. Beispielsweise gibt das öffnende Tag an, wo es auf einer Webseite beginnt, und das schließende Tag zeigt an, wo es aufhört. Letzteres unterscheidet sich von ersterem durch das Vorhandensein eines Schrägstrichs nach der öffnenden spitzen Klammer. Beispielsweise ist das öffnende Tag,das schließende Tag.

Ungekoppelte Tags benötigen keinen Partner.

Viele Tags können Attribute haben - zusätzliche Elemente, die ihnen eine spezifischere Bedeutung verleihen. Zum Beispiel das Tag.

Webdesign
Webdesign

Wo HTML verwendet wird

Das klassische Verständnis dafür, wo HTML benötigt wird, ist das Erstellen von Websites.

In der Praxis kann dies ausreichen, da HTML es Ihnen ermöglicht, die Hauptelemente der Website zu erstellen, Menüs (einschließlich mehrstufiger), den Hintergrund festzulegen, Text, Bilder, Audio, Video einzufügen und Schriftarten zu bearbeiten und vieles mehr.

Es gibt jedoch auch andere Sprachen, mit denen Sie einer Webseite interessantere und oft notwendige Elemente hinzufügen können:

  • CSS legt Stile für die gesamte Seite fest, ohne dass ständig Stilmerkmale einzelner Elemente per Tags vorgegeben werden müssen - zum Beispiel Farbe und Schriftart des Textes.
  • Die Skriptsprache ermöglicht es Ihnen, Miniprogramme (Skripte) zu entwickeln und auf der Website einzubetten, vonbanale ästhetische Dinge (Ändern der Farbe des Links beim Überfahren mit der Maus) und enden mit funktionalen (Sammeln von Kunden-E-Mail-Adressen, Telefonnummern).
  • Mit PHP können Sie Ihr eigenes Gästebuch oder Kommentarsystem entwickeln.

Auch HTML wird bei der Erstellung von E-Mails zur Verteilung verwendet.

Internet-Mailingliste
Internet-Mailingliste

Was ist ein Link

Sie ermöglichen es Ihnen, zu einer anderen Webseite zu navigieren, sowohl innerhalb als auch außerhalb der Website.

HTML-Links werden häufig verwendet:

  • Um zu einer externen Webressource zu gehen.
  • Zum Navigieren durch die Seiten innerhalb der Site.
  • Um zu Google Formularen zu gelangen.

Ein Link zur Quelle in HTML wird ebenfalls oft angegeben, zumal man beim Kopieren von Material von einer anderen Seite den Autor angeben muss. Andernfalls kann das Kopieren ohne Namensnennung unter die Definitionen von Urheberrechtsverletzung, Inh altsdiebstahl und Fehlzündung fallen. Darüber hinaus verringert die Verwendung von geliehenen, nicht eindeutigen Materialien die SEO-Leistung, und die Angabe eines Links zur Quelle verringert die Risiken.

Arten von Links

Im klassischen Sinne ist ein Link die Adresse einer Webressource, die Sie durch Anklicken aufrufen können.

Arten von Links
Arten von Links

Außerdem gibt es Hyperlinks: Text und Bilder. In diesen Fällen ist der HTML-Link unter einem Satz (Wort) oder Bild „versteckt“, und um ihm zu folgen, müssen Sie auf den Text oder das Bild klicken.

Andere Arten von Links:

  • Unvisited – ein Link, auf den während einer bestimmten Sitzung noch nicht geklickt wurde. Wenn Sie beispielsweise gestern diesem Link gefolgt sind, dann Ihren Computer ausgesch altet und heute wieder eingesch altet haben, wird der Link jetzt wieder nicht besucht, da eine neue Sitzung gestartet wurde.
  • Aktiv - In diesem Zustand wird der Link für eine sehr kurze Zeit gespeichert: die Zeitspanne zwischen dem Klicken auf den Link und dem Folgen.
  • Besucht - ein Link, der während einer Sitzung bereits mindestens einmal besucht wurde.

Bei normalen Text-Links neigen besuchte dazu, die Farbe zu ändern, sofern nicht anders angegeben.

Ein verlinktes Bild ändert sein Aussehen nicht, egal ob es besucht wird oder nicht.

So fügen Sie einen normalen Link ein

Viele Webressourcen nehmen die Site-Adresse als Link wahr, machen sie sofort anklickbar und heben sie farblich hervor. Wenn die Adresse beispielsweise in einem Messenger oder per E-Mail gesendet wird, können Sie durch Klicken darauf zur Website gehen.

Wenn Sie selbst eine Website mit HTML erstellen, müssen Sie einen Link mit einem speziellen Tag einfügen. Es sieht so aus: Website-Adresse. Linktext in HTML muss vollständig mit Protokoll angegeben werden.

So fügen Sie einen Text-Hyperlink ein

Es wurde früher gesagt, dass ein Text-Hyperlink die gleiche Funktion wie ein normaler Link erfüllt, aber ästhetisch ansprechender aussieht: Anstelle einer Website-Adresse, die oft unnötig lang ist, wird ein Wort oder eine Phrase angezeigt. Beispielsweise können Sie im Satz „Hier nach Informationen suchen“den Link ausblendendas Wort „hier“. Es wird hervorgehoben und durch Anklicken gelangt der Benutzer zur gewünschten Seite.

Einfügen eines Hyperlinks
Einfügen eines Hyperlinks

Wie man einen HTML-Link erstellt, wurde bereits früher besprochen. Sie können einen Text-Hyperlink mit demselben Tag einfügen. Der einzige Unterschied besteht darin, dass Sie zwischen den Tags den Text angeben müssen, unter dem der Link versteckt werden soll: sichtbarer Text.

So fügen Sie einen Bild-Hyperlink ein

Hier ist es etwas komplizierter. Wir verwenden dasselbe Tag, aber anstelle von Text müssen Sie den Pfad zum Bild angeben.

Der Pfad ist der Speicherort des Bildes. Wenn sich das Bild (Foto) auf einem Dateifreigabedienst befindet, müssen Sie alle Ordner entlang des Pfads zum Bild durch einen Schrägstrich angeben. Wenn möglich, können Sie auch einen Link zu einem Bild einfügen.

Markieren

Zusätzlich zu src sind auch andere Attribute anwendbar, mit denen Sie die Höhe, Breite und Position des Bildes und vieles mehr anpassen können. Einige von ihnen:

  • Src - gibt den Pfad zum Bild an.
  • Lowsrc - identisch mit dem vorherigen Attribut, aber spezifiziert für Bilder mit niedriger Qualität.
  • Height - Bildhöhe.
  • Breite - seine Breite.
  • Alt - Bildbeschreibung. Wenn Sie den Mauszeiger über ein Foto oder Bild bewegen, wird der in diesem Attribut angegebene Text angezeigt.
  • Border - legt die Dicke des Rahmens um das Bild fest.

Attribute werden nach dem Tag angegeben und in eingeschlossenseine Zusammensetzung. Dem Attribut muss sein Wert folgen. Beispielsweise gibt für die Attribute „height“oder „width“(Höhe, Breite) die Höhe des Bildes auf der Webseite an. Die Maßeinheit ist Pixel, sofern nicht anders angegeben.

Das sieht dann so aus: <a href="web page address"

. Diese Attribute helfen dabei, die geeignete Größe für das Bild festzulegen. Border hilft dabei, einen unsichtbaren Rahmen um das Bild zu erstellen.

einem Link folgen
einem Link folgen

Die obigen Attribute gelten separat für das Bild-Einfügungs-Tag. Zum Beispiel:.

Was sind Ankerlinks

Das Erstellen von Ankerlinks ist eine sehr nützliche Fähigkeit. Oft besteht die Notwendigkeit, eine Webseite mit einem langen Textblock oder mit mehreren Unterabschnitten auf einer Seite zu gest alten. In diesem Fall können Sie sofort mit einer Liste von Links zu Unterabschnitten des Textes oder der Webseite beginnen, und wenn Sie darauf klicken, gelangt der Benutzer direkt zum gewünschten Abschnitt.

Das Erstellen von Ankerlinks erfordert mehr Verwendung von Attribut-Tags als andere Arten von Links.

Link-Anker
Link-Anker

Zunächst müssen Sie den Gesamtwert für jeden Informationsblock oder Unterabschnitt des Textes mithilfe des top-Attributs festlegen und ihn dann mit dem entsprechenden Link verknüpfen.

Ihre Funktionen sind umfangreicher, daher ist es ratsam, zuerst die Erstellung einfacherer Links zu beherrschen und dann mit der Bildung von Ankerlinks fortzufahren.

Tipps

Platzierung verschiedener Informationsblöcke auf einer Webseite
Platzierung verschiedener Informationsblöcke auf einer Webseite

Hilfe von erfahrenenProgrammierer:

  • Sie können festlegen, dass Informationen zu einem Link beim Hover in HTML angezeigt werden. Dabei kann das Alt-Attribut hilfreich sein, das wir auch für grafische Elemente verwenden.
  • Es ist möglich, eine Linkliste mit HTML zu erstellen. Dies kann insbesondere für Ankerlinks nützlich sein, sowie wenn Sie eine Liste von Webressourcen erstellen müssen, denen ein Link direkt von der aktuellen Webseite folgen kann.
  • Mit Hilfe von CSS und JavaScript sowie einigen HTML-Funktionen können Sie Textlinks und Hyperlinks anders als gewohnt gest alten. Wenn Sie beispielsweise den Mauszeiger über einen Link bewegen, kann dieser seine Farbe ändern und zum vorherigen Link zurückkehren, wenn der Cursor von ihm weg ist. Dies kann mit einem benutzerdefinierten JavaScript-Skript erfolgen. Außerdem kann die Linkfarbe auf etwas anderes als Blau für nicht besucht oder Lila für besucht eingestellt werden. Das ist die Aufgabe von CSS.
  • Links nicht missbrauchen. Eine Webseite mit vielen unangemessenen Links sieht schlampig und schlampig aus.
  • Stellen Sie sicher, dass der Benutzer versteht, dass der Hyperlink mit dem Bild wirklich ein Bild ist und nicht nur ein Bild.

Schlussfolgerung

Es ist sehr einfach, in HTML auf eine Seite zu verlinken. Es ist wichtig, alle Hauptpunkte dieser Sprache zu befolgen, da selbst ein kleiner Fehler dazu führen kann, dass kein Ergebnis angezeigt wird und der Code nicht funktioniert.

Empfohlen: