Wie man eine Website-Icons für iPhone, iPad und iPod Touch hinzufügen

Favicon.ico - Website-Symbol in Browser

Bevor es eine Website ins Leben gerufen und eine Grafikdatei hinzufügen, FaviconWelche erscheinen im Browser die Adressleiste. In den meisten Fällen ist das Favicon ein Miniatur-Grafik-Logo oder Initialen jeweiligen Webseiten. Das Favicon wird hinzugefügt, dass Benutzer schneller Lesezeichen Web eine Adresse zu identifizieren.

Stealth-Einstellungen Favicon

Stealth-Einstellungen Favicon in Safari

Favicon in Opera

Favicon in Opera

Bis vor kurzem sollte diese Datei von der Form "favicon.ico"Um vom Webbrowser identifiziert zu werden. Chrome, Internet Explorer, Opera, Safari, Firefox usw.
Seit mehreren Jahren mit neuen Web-Sprachen voran, HTML5 si CSS3Favicons kann, sei ein .png-Datei oder . Jpg. Die Bedingung ist, dass der Header des Aufstellungsortes, vor </ head>Seien Sie in dieser Zeile:

<Link rel = "Verknüpfungssymbol" href = "/ images / favicon.ico" type = "image / x-icon" />

Website Icon für iOS - iPhone, iPad und iPod Touch

In iOS Wir können hinzufügen Webseite Verknüpfungen pe Home ScreenCPCiPhone, iPad si iPod touch.

Wie man eine Website Verknüpfung auf iPhone, iPad und iPod Home-Bildschirm hinzufügen

Wir tun dies, indem Sie eine Website auf Ihrem iPhone (Safari, Chrome, Internet-Browser etc.) zu öffnen, klicken Sie auf dem Platz mit dem Pfeil (das Zeichen für „share“ in iOS), dann der Option "Zum Home-Bildschirm".

Wenn die Website ist für Ihren Browser so einstellen Favicon, aber nicht gesetzt iOS-Gerät spezifische Symbol WebsitesAuf dem Bildschirm erscheint, erscheint ein Symbol, bestehend aus einem Bildvorschau Web-Seite.

Wie Web-Icons für iPhone, iPad und Android hinzuzufügen.

Der erste Schritt ist, zuein Bild Symbol erstellenDas erscheint auf Home ScreenCPC idevice Gemeinschaft. Für Web-Symbol ist kompatibel zu allen Geräten und zu deutlich sehen, müssen wir Bild erstellen für alle iPhone und iPad Auflösungen.

Auflösungen und Standardgrößen von Icons für iPhone, iPad, iPod und Android

  • Klassische Modelle von iPhone / iPod = 57 57 ×
  • iPad = 76 76 ×
  • iPhone / iPod-Retina × = 120 120
  • iPad Retina × = 152 152
  • iPhone 6 / 6S Plus-= 180 180 ×

Apfel regelmäßig aktualisiert Empfohlene SymbolgrößeSeiten Anwendungen si Web-Seiten pe diese Seite.

Für die Geräte mit Android, Symbole sind zwei Dimensionen:

  • Android classic × = 128 128
  • Android hoher Auflösung (hallo-res) = 192 192 ×

Symbole

Nachdem wir die Bilder gemacht, auf dem Webserver klettern, fügen Sie den HTML-Quellcode der Website vor dem schließenden </ head>, die folgenden Zeilen:

<link href = "/ apfel-touch-icon.png" rel = "apple-touch-icon" /> <link href = "/ apfel-touch-icon-76x76.png" rel = "apfel-touch-icon" sizes = "76x76" <link href = "/ apfel-touch-icon-120x120.png" rel = "apfel-touch-icon" sizes = "120x120" <link href = "/ apfel-touch-icon-152x152.png" rel = "apfel-touch-icon" sizes = "152x152" <link href = "/ apfel-touch-icon-180x180.png" rel = "apfel-touch-icon" sizes = "180x180" <link href = "/ icon-hires.png" rel = "Symbol" size = "192x192" /> <link href = "/ symbol-normal.png" rel = "icon" sizes = "128x128" />

Für die Geräte von Apple und .png Bildname "rel =" muss das Präfix "Apfel-" enthalten. Für Android, wird der Dateiname "Symbol hires.png"Und"Symbol normal.png"Mit rel =" Symbol ".

Es ist unbedingt notwendig, Bilder separat für jede Auflösung zu erstellen. Sie können ein Bild für die hohe Auflösung machen und die Geräte mit niedriger Auflösung, identifizieren und das Symbol gesetzt.

iPhone Icon Webseite

Das Symbol der Verknüpfung wird aussehen wie die Webseite von jeder Anwendungen für iOS.

Wie man eine Website-Icons für iPhone, iPad und iPod Touch hinzufügen

Über den Autor

Stealth

Leidenschaft für alles, was Gadget und IT gerne stealthsettings.com von 2006 schreiben und Ich mag neue Dinge zu entdecken, mit Ihnen über Computer und MacOS, Linux, Windows, iOS und Android.

Hinterlasse einen Kommentar