Webseiten-Titel ändern oder animieren mit JavaScript (mehr Aufmerksamkeit bei Tabs!)
Der Webseiten-Titel wurde früher in der Titelleiste des Browsers angezeigt: Mittlerweile sieht man den Text oft nur noch bei mehreren geöffneten Tabs. Für Besucher, die mehr als einen Browser-Tab geöffnet haben, kann man diesen Bereich aber leicht als zusätzliches, sinnvolles Textfeld nutzen: Hier kann man auf neue Nachrichten oder auch auf neue Angebote hinweisen. Booking.com nutzt die Titelzeile zum Beispiel, um an eine nicht abgeschlossene Buchung zu erinnern.
Da die Titelzeile Teil des angezeigten Dokuments ist, lässt sie sich auch nach Belieben mit JavaScript beeinflussen – und das auch, nachdem die Seite selbst schon geladen ist. Wichtig: Je nach Browser werden dabei Sonderzeichen nicht immer unterstützt, auch deren HTML-Äquivalente wie zum Beispiel • werden in der Regel nicht unterstützt.
Mit diesem kurzen Skript ändert man den Titel von Webseite oder Tab nachträglich:
<script> document.title = "* Computerhilfen.de"; </script>
Durch ein mehrfaches Ändern der Titelzeile lässt sich so auch eine Animation erzeugen. Das sorgt zwar für garantierte Aufmerksamkeit, sollte aber mit Bedacht eingesetzt werden – sonst wird der Tab schnell geschlossen. Für die Animation eignet sich die JavaScript Funktion “setInterval”: Hiermit lassen sich wiederkehrende Ationen mit einem wählbaren Zeitintervall in Millisekunden automatisieren. Je nachdem, ob die aktuelle Titelzeile in dem folgenden Beispiel einen Asterisk (“*”) enthält oder nicht, wird dieser ergänzt oder aus dem Titel gelöscht.
<script> setInterval(function () { if(document.title.includes("*")) { document.title = " Computerhilfen.de"; } else { document.title = "* Computerhilfen.de"; } }, 1000); </script>
Der eigentliche Titel des Dokuments wird mit diesem Skript nicht geändert: Der neue Titel wird erst bei Ausführen des Skriptes bei bestimmten Events direkt im Client, also im Browser des Besuchers, aktualisiert. Für Suchmaschinen, ob intern oder extern, die kein JavaScript unterstützen, bleibt der Titel wie ursprünglich im Dokument angegeben bestehen.
- 8.1 mehr als nur 2 Tabs gleichzeitig?
Hi,ich hab eine Frage bezüglich der Tabs von Windows 8.1. Und zwar soll man mehr als nu...
- Sperrung von Webseiten per Ferndiagnose oder Teamviewer !
- Webseiten laden manchmal nicht oder ewig lange
- wget um einzelne Dateien oder ganze Webseiten lokal zu speichern
- Titel: kann mich nicht mehr bei webcamo einloggen, trotz meines Profil.
- pc-einsteigerkurs-3-1 (2x gelesen)
- pc-einsteigerkurs (2x gelesen)
- pc-einsteigerkurs-4-3 (1x gelesen)
- pc-einsteigerkurs-5-1 (1x gelesen)
- pc-einsteigerkurs-6-2 (1x gelesen)
Mehr Tipps zu Webseiten-Titel ändern oder animier...
-
FHEM: Raum-Name + Infos im Browser-Titel zeigen – statt “Home, Sweet Home”!
In der Standardkonfiguration zeigt FHEM in jedem Browser-Tab oder jedem Fenster nur "Home, Sweet Home". Das ist etwas unübersichtlich, wenn man mehrere Fenster oder Browser-Tabs...
-
Mit iPhone / iPad gekaufte Titel in iTunes laden
Hat man im iTunes Store ein Lied gekauft, kann man es auf alle seine Geräte (auf denen man mit der gleichen Apple ID angemeldet ist!)...
-
Mit iPhone / iPad gekaufte Titel in iTunes laden
Hat man im iTunes Store ein Lied gekauft, kann man es auf alle seine Geräte (auf denen man mit der gleichen Apple ID angemeldet ist!)...
-
Javascript Array leeren – so geht’s!
Ein Array ist eine spezielle Form einer Variable, die gleich mehrere Inhalte aufnehmen und einzeln wieder abrufen kann. Sie lässt sich nicht nur einfach anlegen...
-
Cookies bei Computerhilfen
Cookies (zu englisch eigentlich "Keks") sind kleine Datenpakete, die bestimmte Sachen zu einem Internet-Nutzer über den Browser speichern. Sie wurden von dem einstigen Browser-Pionier "Netscape"...
-
Computerhilfen Update: Wir haben die Startseite erneuert
Als ersten Teil unseres Computerhilfen Updates haben wir unsere Startseite überarbeitet. Sie ist jetzt übersichtlicher, aufgeräumter und auch etwas erwachsener geworden. Gäste sollen sich durch...
Webseiten-Titel ändern oder animieren mit JavaScript (mehr Aufmerksamkeit bei Tabs!)