Flo's Weblog

Welcome to my little world...

  • Homepage
  • iOS
  • App Store
  • About
  • Projekte
  • Privates
  • Fotos
  • Kontakt

Jan 17: Eigene Webclip-Icons für fremde Seiten [UPDATE]

Webclips sind auf dem iPhone mit der neusten Firmware eine feine Sache. Allerdings bieten die meisten Webseiten (noch) kein wirklich schönes Webclip-Icon an. Dies kann man jedoch mit einem kleinen Trick umgehen und sich so für seine Webclips eigene Icons schaffen, die dann deutlisch hübscher und cooler sind als eine Miniaturansicht der jeweiligen Website. Einzige Voraussetzung: Man braucht einen eigenen Webspace.

Ist diese Voraussetzung erfüllt, steht dem Webclips-Spaß nichts mehr im Wege. Damit die Geschichte funktioniert, bedient man sich des Tricks des sogenannten Meta-Refreshs. Dabei ruft man zunächst eine leere Seite auf, die einen dann automatisch auf die gewünschte Seite weiterleitet. Der Übersichtlichkeit halber legt man sich auf seinem Webspace per FTP einen neuen Ordner an, in den man dann seine Umleitungsseiten platziert, z.B. mit dem Namen "iphone". Hierin kann man dann weitere Ordner platzieren, die auf die jeweils gewünschten Seiten weiterleiten. In jedem Ordner wird dann eine (möglichst quadratische) Grafik-Datei mit dem gewünschten Icon und eine weitere Datei mit den Namen "index.html" platziert, die den folgenden Inhalt hat:

<html>
<meta http-equiv="refresh" content="5000; URL=http://www.google.de">
<link rel="apple-touch-icon" href="google.png"/>
</html>

Anschließend ruft man von seinem iPhone diese Seite auf (z.B. http://www.schimanke.com/iphone/google/index.html). Der Eintrag "content="5000"" in unserer Datei sorgt dafür, dass die Weiterleitung verzögert wird. Sobald also unsere leere weiße Seite geladen ist kann man sich seinen personalisierten Webclip anlegen. Dabei wird dann die hochgeladene Grafik-Datei als Icon verwendet. Anschließend müssen wir die Datei "index.html" noch einmal anpassen, damit die Weiterleitung nicht mehr verzögert geschieht. Dafür setzen wir den Wert 5000 auf 0. Wir erhalten also folgende Datei:

<html>
<meta http-equiv="refresh" content="0; URL=http://www.google.de">
<link rel="apple-touch-icon" href="google.png"/>
</html>

Anschließend wird bei einem Tap auf den Webclip zunächst für Bruchteile einer Sekunde unsere eigene Seite aufgerufen, nur um uns dann unmittelbar auf die gewünschte Seite weiter zu leiten. Diese Vorgehensweise ist vielleicht ein wenig umständlich, das Ergebnis lohnt sich aber auf jeden Fall, da man sich so wunderschöne Icons auf sein iPhone zaubern kann. Hier mal ein Screenshot von meinen Webclips:

Abschließend ein paar Beispiele meiner eigenen Webclips. Sollte ich damit gegen irgendwelche Copyrights verstoßen, so möge sich der Betroffene bitte bei mir melden. Ich werde das Icon dann umgehend entfernen.

UPDATE: Eine andere Methode, auch ohne eigenen Webspace beschreiben Drew McLellan und Jordan Dobson in ihren Blogs. Matt Slovig von Blogpotato hat einmal versucht, das Prozedere mithilfe der üblichen Favicons zu automatisieren.

UPDATE: Unter hsicon.com kann man sich nun auch ohne Webspace ein gewünschtes Icon erstellen lassen. Die Vorgehensweise basiert auf der von mir oben beschriebenen. Die Anfragen laufen dabei dann über einen externen Server. Wer also Bedenken in Sachen Datenschutz hat, sollte hier Vorsicht walten lassen.

      
Geschrieben von Florian Schimanke am Donnerstag, 17. Januar 2008 um 16:55 in Apple
Kommentare: (6) Trackbacks: (3)
Tags für diesen Artikel: apple, iphone, webclips
Artikel mit ähnlichen Themen:
  • Ende des Telekom-Exklusivrechts rückt näher
  • iPod-Event Review
  • Ein erster Blick auf iTunes 10 und Ping
  • iPod Event Keynote ist online
  • Apple stellt iTunes 10 vor, heute verfügbar [UPDATE]
  • Apple veröffentlicht GM von iOS 4.1
  • Preise in Deutschland leicht höher als in den USA
  • Apple Stores wieder zu erreichen
  • Apple präsentiert neues Apple TV
  • Neuer iPod shuffle vorgestellt

Trackbacks
Trackback-URL für diesen Eintrag

Homescreen-Icon f&#252;r Web Snippets erstellen
Mit der neuen Firmware 1.1.3 f&#252;r iPhone und iPod touch (wobei &#228;ltere Modelle dazu aber auch noch das Software-Upgrade Januar 2008 ben&#246;tigen) lassen sich Bookmarks zu Webseiten auch auf dem Homescreen ablegen. Als Icon wird dabei standar...
Weblog: apfelquak
Aufgenommen: Jan 18, 15:45
fav-clip.com - Favicons in iPhone-Icons wandeln
Drüben bei Apfelquak kam im Rahmen meines Artikels zum Hinterlegen von Icons für den iPhone/ipod touch Homescreen die Frage auf, was man machen kann, wenn man nicht der Webmaster der Seite ist. Ad hat dazu einige Links ausgegraben, die aber entweder ...
Weblog: Blogpotato
Aufgenommen: Jan 18, 23:29
Speed-Dial Button auf dem iPhone-Homescreen
Da sich das Thema Homescreen-Anpassung auf dem iPhone anscheinend zu meinem Lieblingsthema entwickelt, hier noch ein weiterer kleiner Tipp, der es ermöglicht, sich einen selbsgestalteten Speed-Dial Webclip auf den Homescreen zu legen. Die Vorgehensweise d
Weblog: Flo's Weblog
Aufgenommen: Jan 24, 14:54

Kommentare
Ansicht der Kommentare: (Linear | Verschachtelt)

#1 - Cedric besagt:
21.01.2008 12:10 - (Antwort)

Danke für den Tipp! :-)

#1.1 - Flo besagt:
21.01.2008 15:27 - (Antwort)

Gern geschehen... :-)

#2 - heidl besagt:
26.01.2008 23:00 - (Antwort)

thx! funktioniert prima - einziges problem ist noch, dass safari beim klick auf einen webclip immer gleich 2 seiten aufmacht (1x die leere & 1x die zielseite). aber sonst siehts fantastisch aus! hab mir ein paar icons gemacht - falls es dich interessiert http://img264.imageshack.us/my.php?image=webclipsdt2.jpg

#2.1 - Flo besagt:
27.01.2008 02:29 - (Antwort)

Wirklich gelungen die Icons! Hmm, eigentlich sollte Safari die Seite nur einmal aufrufen. So ist es bei mir jedenfalls. Hast du genau den oben beschriebenen Code verwendet?

#2.1.1 - heidl 27.01.2008 13:56 - (Antwort)

ja stimmt, ich hatte da anscheinend noch ne weiße seite offen, deshalb kams mir so vor. funktioniert wunderbar! :-)

#2.1.1.1 - Flo besagt:
27.01.2008 15:45 - (Antwort)

Na dann bin ich ja beruhigt. Falls du ein iPhone besitzt, sei dir auch noch der Artikel zum Thema Speed-Dial Buttons ans Herz gelegt: http://www.schimanke.com/index.php?/archives/157-Speed-Dial-Button-auf-dem-iPhone-Homescreen.html


Kommentar schreiben

Die angegebene E-Mail-Adresse wird nicht dargestellt, sondern nur für eventuelle Benachrichtigungen verwendet.

Um maschinelle und automatische Übertragung von Spamkommentaren zu verhindern, bitte die Zeichenfolge im dargestellten Bild in der Eingabemaske eintragen. Nur wenn die Zeichenfolge richtig eingegeben wurde, kann der Kommentar angenommen werden. Bitte beachten Sie, dass Ihr Browser Cookies unterstützen muss, um dieses Verfahren anzuwenden.
CAPTCHA

Umschließende Sterne heben ein Wort hervor (*wort*), per _wort_ kann ein Wort unterstrichen werden.
Standard-Text Smilies wie :-) und ;-) werden zu Bildern konvertiert.
 
 

Twittern Bookmark bei: Facebook Bookmark bei: Del.icio.us Bookmark bei: Mr. Wong Bookmark bei: Digg Bookmark bei: Google Bookmark bei: Linkarena
Werbung:

Tag Cloud

2006 2008 antennagate apple apple tv apps appstore blog em euro event fußball games ilife internes ios ipad iphone ipod itunes keynote leopard mac macworld mobileme navigon perlen rumor sdk snow leopard sport steve jobs store t-mobile tablet tomtom update volunteer wm wwdc
Werbung:

Kalender

Zurück September '10 Vorwärts
Mo Di Mi Do Fr Sa So
    1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30      
Werbung:

Unterstützung

Alle Links in den Apple Store, AppStore oder iTunes Store sind Partnerlinks. Wer hierüber einkauft, unterstützt Flo's Weblog mit einen kleinen Prozentsatz des unveränderten Kaufpreises. Selbes gilt auch für Einkäufe bei Amazon. Über die Spenden-Funktion innerhalb der App und die Flattr-Buttons unter den einzelnen Artikeln besteht ebenfalls die Möglichkeit, Flo's Weblog finanziell zu unterstützen. Weitere Infos zu Flattr gibt es hier. Ich bedanke mich schon jetzt für die Unterstützung!

Verwaltung des Blogs

Login

Powered by

Serendipity PHP Weblog

Hosted by

Impressum
 

Layout by Andreas Viklund | Serendipity template by Carl
Style by Florian Schimanke | Inspired by Starbucks