So fügen Sie einer Website Symbole hinzu iPhone, iPad und iPod Touch

Favicon.ico - Website-Symbol im Browser

Bevor es eine Website ins Leben gerufen und eine Grafikdatei hinzufügen, Favicon, um im Browser in der Adressleiste angezeigt zu werden. In den meisten Situationen ist das Favicon eine Miniaturansicht des grafischen Logos oder der Initialen der jeweiligen Website. Dieses Favicon wird hinzugefügt, damit Benutzer eine Webadresse in Lesezeichen schnell identifizieren können.

Stealth Settings Favicon
Stealth Settings Favicon ein Safari
Favicon in Opera
Favicon in Opera

Bis vor kurzem musste diese Datei in Form sein "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, VorSeien Sie in dieser Zeile:

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

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

So fügen Sie einer Website eine Verknüpfung hinzu auf iPhone, iPad und iPod-Startbildschirm

Wir tun dies, indem wir eine Webseite auf öffnen iPhone (Safari, Chrome, etc. Internetbrowser), klicken Sie auf das Quadrat mit dem Pfeil (das Zeichen für „Teilen“ in iOS), dann auf die Option „Add zum Startbildschirm".

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.

So fügen Sie Websymbole hinzu für iPhone, iPad und Android.

Der erste Schritt ist, zu ein 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 Auflösungen von iPhone und iPad.

Auflösungen und Standardsymbolgrößen für iPhone, iPad, iPod und Android

  • Modeklassische Lele von iPhone / iPod = 57 × 57
  • iPad = 76 × 76
  • iPhone / iPod-Netzhaut = 120 × 120
  • iPad Retina = 152 × 152
  • iPhone 6 / 6S Plus = 180 × 180

Apple 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 mit hoher Auflösung (hochauflösend) = 192 × 192
Symbole

Nachdem wir die Bilder erstellt haben, werden sie vor dem Schließen auf den Webserver und in die HTML-Quelle der Website hochgeladen werden die folgenden Zeilen hinzugefügt:

<link href=“/apple-touch-icon.png ”rel =”apple-touch-icon ”/> <link href=“/apple-touch-icon-76 × 76.png ”rel =”apple-touch-icon ”Größen =” 76 × 76 ″ /> <link href=“/apple-touch-icon-120 × 120.png ”rel =”apple-touch-icon ”Größen =” 120 × 120 ″ /> <link href=“/apple-touch-icon-152 × 152.png ”rel =”apple-touch-icon ”Größen =” 152 × 152 ″ /> <link href=“/apple-touch-icon-180 × 180.png ”rel =”apple-touch-icon ”Größen =” 180 × 180 ″ />

Für Geräte Apple, .PNG-Bildname und "rel =" müssen das Präfix enthalten "apple- ". Für Android lauten die Dateinamen "Symbol hires.png"Und"Symbol normal.png”Mit rel =” Symbol ”.

Es ist nicht unbedingt erforderlich, Bilder für jede Auflösung zu erstellen. Sie können ein Bild mit der höchsten Auflösung erstellen. Die Geräte mit der niedrigeren Auflösung identifizieren es und legen es als Symbol fest.

iPhone-Website-Symbol

Das Verknüpfungssymbol zur Website sieht ähnlich aus wie jedes andere Anwendungen für iOS.

Technikbegeistert, schreibe ich seit 2006 gerne auf StealthSettings.com. Ich habe reichhaltige Erfahrung in Betriebssystemen: macOS, Windows und Linux, sowie in Programmiersprachen und Blogging-Plattformen (WordPress) und für Online-Shops (WooCommerce, Magento, PrestaShop).

So erreichen » iHowTo » iHowTo - iOS » So fügen Sie einer Website Symbole hinzu iPhone, iPad und iPod Touch
Hinterlasse einen Kommentar