Seite 1 von 1

Wie erstelle ich dieses Web-Icon???

Verfasst: 16.11.2015 11:40
von dieter99
Hallo,
wenn ich auf dem Handy im UC-Browser einen Link als Shortcut abspeichere, dann wird automatisch ein Icon generiert. Siehe hier:

[ externes Bild ]

Wenn ich aber meine eigene Homepage verknüpfe, dann bekomme ich nur ein leeres Kästen angezeigt (obwohl ich ein favicon generierte). Was muss ich tun, um so ein tolles Bild zu bekommen?

Re: Wie erstelle ich dieses Web-Icon???

Verfasst: 16.11.2015 14:15
von tas2580
Lege dir eine Datei mit dem Namen apple-touch-icon.png (144px * 144px) direkt unter deiner Domain, also da wo auch das Favicon liegt.

der Meta-Tag dazu wäre:

Code: Alles auswählen

<link href="http://www.example.com/apple-touch-icon.png" rel="apple-touch-icon" />
Gruß Tobi

Re: Wie erstelle ich dieses Web-Icon???

Verfasst: 17.11.2015 08:36
von dieter99
Danke für den Tipp, aber es funktioniert nicht.
Ist das mit Apple richtig, obwohl ich ein Windows Handy nutze?

Das Icon wurde direkt unter der Domain abgelegt.
Der Code wurde in overall_header eingefügt und der Cache wurde gelöscht.

Re: Wie erstelle ich dieses Web-Icon???

Verfasst: 17.11.2015 14:35
von tas2580
Ich habe bei mir in den Logfiles bis jetzt nur apple-touch-icon gesehen. Schau mal unter http://web-stuebchen.de/ da kannst du dir eine ganze reihe Icons erstellen.

Gruß Tobi

Re: Wie erstelle ich dieses Web-Icon???

Verfasst: 17.11.2015 18:57
von dieter99
Ich habe den Code jetzt über http://web-stuebchen.de/ generieren lassen, doch ich bekomme im UC-Browser immer noch kein Touch-Icon angezeigt (bzw. nur ein leeres).

Der Foren-Cache wurde gelöscht, und ich kann über den Quelltext auch die Icons aufrufen. Ich testete sowohl relative als auch absolute Adressen.

Auf der Seite http://www.t-online.de steht im Quellcode nur das hier:

Code: Alles auswählen

<link rel="apple-touch-icon" sizes="57x57" href="http://img.toi.de/mo/apple-touch-icon-57-57.png" />
<link rel="apple-touch-icon" sizes="72x72" href="http://img.toi.de/mo/apple-touch-icon-72-72.png" />
<link rel="apple-touch-icon" sizes="114x114" href="http://img.toi.de/mo/apple-touch-icon-114-114.png" />
Hier bekomme ich im UC-Browser komischerweise ein Touch-Icon angezeigt.

Mein Code lautet:

Code: Alles auswählen

<link rel="apple-touch-icon" sizes="57x57" href="http://www.domainNameTestweiseEntfernt.de/images/apple-touch-icon-57-57.png" />
<link rel="apple-touch-icon" sizes="60x60" href="http://www.domainNameTestweiseEntfernt.de/images/apple-touch-icon-60-60.png" />
<link rel="apple-touch-icon" sizes="72x72" href="http://www.domainNameTestweiseEntfernt.de/images/apple-touch-icon-72-72.png" />
<link rel="apple-touch-icon" sizes="76x76" href="http://www.domainNameTestweiseEntfernt.de/images/apple-touch-icon-76-76.png" />
<link rel="apple-touch-icon" sizes="114x114" href="http://www.domainNameTestweiseEntfernt.de/images/apple-touch-icon-114-114.png" />
<link rel="apple-touch-icon" sizes="120x120" href="http://www.domainNameTestweiseEntfernt.de/images/apple-touch-icon-120-120.png" />
<link rel="apple-touch-icon" sizes="128x128" href="http://www.domainNameTestweiseEntfernt.de/images/apple-touch-icon-128-128.png" />
<link rel="apple-touch-icon" sizes="144x144" href="http://www.domainNameTestweiseEntfernt.de/images/apple-touch-icon-144-144.png" />
<link rel="apple-touch-icon" sizes="152x152" href="http://www.domainNameTestweiseEntfernt.de/images/apple-touch-icon-152-152.png" />
<link rel="apple-touch-icon" sizes="180x180" href="http://www.domainNameTestweiseEntfernt.de/images/apple-touch-icon-180-180.png" />
<meta name="msapplication-TileImage" content="http://www.domainNameTestweiseEntfernt.de/images/win8-tile-144x144.png"> 
<meta name="msapplication-TileColor" content="#ffffff"> 
<meta name="msapplication-navbutton-color" content="#ffffff"> 
<meta name="application-name" content="Forum"/> 
<meta name="msapplication-tooltip" content="Forum"/> 
<meta name="apple-mobile-web-app-title" content="Forum"/> 
<meta name="msapplication-square70x70logo" content="http://www.domainNameTestweiseEntfernt.de/images/win8-tile-70x70.png"> 
<meta name="msapplication-square144x144logo" content="http://www.domainNameTestweiseEntfernt.de/images/win8-tile-144x144.png"> 
<meta name="msapplication-square150x150logo" content="http://www.domainNameTestweiseEntfernt.de/images/win8-tile-150x150.png"> 
<meta name="msapplication-wide310x150logo" content="http://www.domainNameTestweiseEntfernt.de/images/win8-tile-310x150.png"> 
<meta name="msapplication-square310x310logo" content="http://www.domainNameTestweiseEntfernt.de/images/win8-tile-310x310.png"> 
Wo ist der Hund begraben? Der Cache des UC-Browsers wurde ebenfalls gelöscht. Der Browser wurde sogar neu installiert.

Re: Wie erstelle ich dieses Web-Icon???

Verfasst: 18.11.2015 17:43
von dieter99
Wenn ich beispielsweise die mobile Seite des Focus (http://m.focus.de/) als Touch-Link in meinem UC-Browser (Lumia Gerät) abspeichere, dann erhalte ich folgendes Touch-Icon:

http://p5.focus.de/mobile-bookmark-152x152.png

Im Quelltext finde ich dazu nur folgenden Code:

Code: Alles auswählen

<link rel="apple-touch-icon-precomposed" href="http://p5.focus.de/mobile-bookmark-152x152.png" type="image/ico"/>
Ich habe den exakt gleichen Code in meiner Homepage eingebaut (nur die URL http://.... ist anders), doch beim abspeichern meiner Homepage im UC-Browser als Touch-Link bekomme ich das Touch-Icon NICHT angezeigt.

Wie ist sowas möglich???

Der Cache wurde gelöscht und die URL stimmt definitiv.