Beitrag wurde zuletzt am aktualisiert

HTML-Weiterleitung

HTML Redirect (Meta Refresh)

Besucher auf eine Webseite automatisch weiterleiten ➤ auch als Meta-Refresh oder HTML-Redirect bezeichnet

Eine zeitgesteurte, clientseitige Website-Weiterleitung auf ein beliebiges Dokument – oder wohin auch immer der Browser den Besucher bzw. den Suchmaschinen-Crawler automatisch leiten soll. Das ganze ließe sich sicher auch als HTTP Redirect, HTML Weiterleitung, HTML Umleitung, URL Refresh, URL Forwarding oder Meta Redirect usw. bezeichnen.

Gemeint ist hier immer das selbe: Der Browser soll dazu veranlasst werden, automatisch eine neue Adresse aufzurufen.

Und genau das ist auch das Problem, denn der Browser ist für diese Weiterleitung zuständig und ob er dies auch macht oder ob bei einer zeitgesteuerten Umleitung der Besucher die Inhalte bereits erfasst und gelesen hat, entzieht sich der Kenntnis des Programmierers.

Automatische Weiterleitung per HTML

Für die Umsetzung wird lediglich eine Zeile HTML-Code benötigt, welcher im Kopfbereich einer HTML-Seite zwischen <header> … </header> eingefügt wird. Diese Zeile beginnt mit meta http-equiv=“refresh“. Nach content wird eine Zeitangabe in Sekunden erwartet, im unteren Beispiel somit 20 Sekunden. Ein Wert 0 (Null) würde den Browser anweisen, ohne Wartezeit zum hinter URL angegeben Ziel zu springen.

? Code-Beispiel für eine automatische HTML-Weiterleitung

<html>
<head>
<title>Hier erfolgt in 20 Sekunden eine Weiterleitung</title>
<!-- weitere Angaben im Header, z.B. Metatags -->
<meta http-equiv="refresh" content="20; URL=https://www.redirect301.de/meta-refresh/">
<!-- weitere Angaben im Header wie CSS und JavaScript -->
</head>
<body>
<p>Inhalte der Webseite, Hinweis auf bevorstehende Umleitung auf eine anderes Dokument sowie einen klickbaren <a href="#">Link</a></p>
</body>
</html>

Hier testen:

Nach 20 Sekunden wird der Besucher von www.meta-refresh.redirect301.de/weiterleitung-20-sekunden.html auf diesen Beitrag weiter geleitet. In dieser Zeit kann man dem Besucher einen kurzen Hinweistext zur bevorstehenden Weiterleitung präsentieren oder auch Werbung einblenden.

Unter der Adresse www.meta-refresh.redirect301.de/sofortige-weiterleitung.html erfolgt eine HTML-Weiterleitung zu diesem Artikel ohne Wartezeit, hier ist content=“0 …“ im Quellcode hinterlegt.

Die Angabe der Ziel-Adresse kann bei einer lokalen Verwendung auch mit relativen Pfadangaben umgehen. Ansonsten darf das Protokoll, z.B. http:// oder https:// nicht fehlen, also bitte nicht einfach nur www.redirct301.de/meta-refresh.html angeben, das würde nicht funktionieren.

<meta http-equiv="refresh" content="0; URL=/thema/clientseitige-weiterleitung" />

oder

<meta http-equiv="refresh" content="5; URL=../../code-metarefresh.pdf" />

Browserkompatibilität

Die meisten Browser unterstützen diese Art der Weiterleitung. Trotzdem sollte im body-Bereich der Website, also im angezeigten Text, immer auch ein klickbarer Link zur Zielseite angegeben werden. Mit diesem Link gibt man auch Besuchern, die die Funktionalität einer solchen Umleitung deaktiviert haben, die Möglichkeit, auf die Zielseite zu gelangen.

Einsatzmöglichkeiten für einen Meta-Refresh

Einen Anwendungsfall für diese Art einer Weiterleitung gibt es sicherlich immer dann, wenn im Hosting-Paket keine htaccess-Dateien mit „richtigen Redirects“ möglich sind. Vielleicht auch noch dann, wenn man seinen Besuchern (wie im vergangenen Jahrhundert oftmals zu sehen) eine eigentlich inhaltslose und meist überflüssige „Willkommensseite“ präsentieren möchte, die nach einigen Augenblicken zur eigentlichen Startseite führt.

Auch für den Fall, dass direkt aus der Navigation heraus auf eine PDF oder eine andere Datei verwiesen wird. Ein plötzlich beginnender Download würde so manchen Webseiten-Besucher überraschen. Auf einer so untergebrachten Zwischenseite könnte ein kurzer Hinweistext sowie die Angabe der Dateigröße stehen und erst dann beginnt nach ein paar Sekunden der Download.

Meta-Refresh im SEO-Umfeld

Wenn möglich sollte man auf einen Meta-Refresh aber verzichten, auch wenn die Suchmaschinen diese Weiterleitung weitgehend als einen 301-Redirect betrachten. Wie man eine solche permanente Weiterleitung richtig anwendet, beschreibt der Artikel Redirect 301 in der htaccess-Datei. Viele Suchmaschinenoptimierer gehen übrigens davon aus, dass Webseiten, die eine Meta-Weiterleitung nutzen, erst nach einer minimalen Wartezeit von 5 Sekündigen bis zur automatischen Umleitung diese im Suchindex aufnehmen.

Schaut euch die oben genannten Beispiele einfach mal an! Es erfolgt eine Weiterleitung zurück zu diesem Beitrag. Auf den HTML-Seiten gibt etwas beschreibenden Inhalt und natürlich fehlt auch der erwähnte Link zum manuellen Klicken nicht. Ist vielleicht etwas, was ihr euch einfach kopieren könnt.

Bei SelfHTML wird das Thema „Automatische Weiterleitung zu anderer Adresse (Forwarding)“ umfänglich beschrieben. Wer sich diese Informationen noch mal in einem Video anschauen möchte, wird natürlich auch bei Youtube fündig.

5 Kommentare zu "HTML-Weiterleitung"

  1. Hallo! Vielen Dank für die ausführliche Beschreibung der HTML-Weiterleitung und auch die Demo dazu!
    Dieser Beitrag ist genau die Erklärung, die ich gesucht habe!

    Gibt es auch einen Beitrag, der den Unterschied zwischen der Header- und der Frameweiterleitung etwas beleuchtet?
    Ich würde gerne Besucher über eine Zwischenseite auf ein Ziel weiterleiten um mit dem Facebook-Pixel die Besucher trocken zu können. Kann ich das mit der Frameweiterleitung auch ?

    Liebe Grüße
    Arno

  2. Hallo!

    Ich habe Deinen Beitrag noch einmal angesehen und bin etwas verunsichert!
    Im Codebeispiel gibst Du den Code:

    [CODEBEISPIEL]

    an, im Text darüber schreibst Du jedoch, dass dieser zwischen head … /head eingefügt wird.

    Sind das nicht 2 völlig unterschiedliche Orte, die Du da beschreibst?

    • Wenn du das hier in deinen Header setzt, dann erfolgt die automatische Weiterleitung nach 20 Sekunden, oder habe ich dich falsch verstanden?

      <head>
      ...
      <meta http-equiv="refresh" content="20; URL=https://www.redirect301.de/meta-refresh/" />
      ...
      </head>
      
  3. Danke, jetzt ist es auch für mich eindeutig und das war auch genau meine Aufgabenstellung!

    Super!

  4. Vielen Dank für das Beispiel, hat mir geholfen drei meiner Seiten mit nicht mehr gültigen Links in aller Kürze zu einer mit gültigen Links umzuleiten!

Hinterlasse einen Kommentar

E-Mail Adresse wird nicht veröffentlicht.