Logo in <head> Bereich?
Hallo,
wie kann man ein Logo ( in HTML ) einfügen welches dann neben dem <title> angezeigt wird.
Wie hier ( in der Tab-Übersicht ):
Danke im Voraus für Antworten.
2 Antworten
Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer
Computer, Technik, Technologie
Das Favicon kannst du im head Bereich der Seite angeben und wird dann vom Webbrowser an der Stelle angezeigt.
<!DOCTYPE html>
<html lang="de">
<head>
<title>Meine Seite</title>
<meta charset="utf-8" />
<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />
<link rel="icon" type="image/png" href="/favicon.png" />
</head>
<body>
<!-- Sonstiger Seiteninhalt -->
</body>
</html>
- https://de.wikipedia.org/wiki/Favicon
- https://wiki.selfhtml.org/wiki/Grafik/Favicon
- https://www.w3.org/2005/10/howto-favicon
Ist kein Favicon im head Bereich definiert guckt der Browser in der Regel im Root Verzeichnis des der Webseite nach ob sich dort eine Datei mit dem entsprechenden Namen befindet.
<link rel="icon" href="logo.png" />
Nur das in den Header reinkopieren,
logo.png natürlich durch den Dateinamen von deinem Logo ersetzen und den richtigen Pfad angeben wenn er nicht in demselben Ordner wie die HTML Datei ist.
Es gibt auch solche Logos/Icons für den iOS Homescreen,
falls du mal eine PWA machen willst
<link rel="apple-touch-icon" href="touch-icon-iphone.png" />
<link rel="apple-touch-icon" sizes="72x72" href="touch-icon-ipad.png" />
<link rel="apple-touch-icon" sizes="114x114" href="touch-icon-iphone4.png" />
<link rel="apple-touch-icon" sizes="144x144" href="touch-icon-retina-ipad.png" />