Verwenden iOS-spezifische Meta-Tags in HTML5

In HTML5, können Sie Meta-Tags speziell für iOS (Apple-Betriebssystem für das iPhone, iPod touch und iPad) umfassen. Diese Tags können Sie steuern, wie Sie Ihre Website erscheint oder wie die Benutzer interagieren mit ihm über den Touchscreen auf einem iPhone oder iPad.

Wenn ein Besucher auf Ihre Website kommt ein Gerät, das diese Funktionen nicht unterstützt, einfach den Browser ignoriert sie. Hier ist eine kurze Einführung in die iOS-spezifischen Tags:

  • Ansichtsfenster - Wenn Sie die meisten Web-Seiten auf einem iPhone oder iPad zu besuchen, können Sie die Seite und Zoom, indem Sie Prise und strecken Fingergesten schwenken um zu verkleinern oder die Seite und deren Inhalt vergrößern. Diese Funktion hilft Websites zu machen, die für Desktop-Computer-Bildschirme möglich entworfen wurden, auf dem kleineren Bildschirm auf einem iPhone zu lesen.

    Allerdings, wenn Sie Ihr Design für diese Geräte in erster Linie optimiert haben, können Sie Benutzer von Schwenken und Zoomen zu verhindern, weil es nicht notwendig ist und kann sie verwirren.

    So blockieren die Schwenk- und Zoom-Funktionen auf einer Seite, die Sie entworfen haben, um perfekt das iPhone oder den iPad-Bildschirm passen, verwenden Sie die Meta Ansichtsfenster tag, die das Fenster auf die Breite des sich setzt und verhindert Skalierung:

     

    Dies Ansichtsfenster Meta-Tag-Einstellung wird am besten, wenn Ihre Website konzipiert ist perfekt auf dem kleinen iPhone-Bildschirm zu passen. Wenn Ihre Website für kleine Bildschirme nicht optimiert ist, ist es am besten nicht diese Meta-Tag zu verwenden, da Sie werden den Besuchern erlauben, Bereiche der Seite zu vergrößern, und blättern Sie um, als notwendig, um Ihre Inhalte zu lesen.

  • apple-mobile-web-app-fähig - Diese Meta-Tag teilt dem Safari-Browser, es muss nicht am oberen und unteren Rand des Bildschirms auf dem iPhone oder iPod touch die Navigationsoptionen zu haben. Es beseitigt auch die Navigationsoptionen an der Spitze des iPad-Bildschirm.

    Diese Funktion ist nicht das erste Mal, wenn jemand eine Webseite besuchen. Es funktioniert nur, wenn ein Besucher Ihrer Website die Seite über einen Web-Clip-Symbol Speichern vorgemerkt hat. Wenn jemand den Link aus dem Web-Clip-Symbol verwendet Ihre Website, das Meta-Tag versteckt die Navigation zu besuchen.

    Wenn Sie diesen Tag zu verwenden, müssen Sie sicherstellen, dass Ihre Website nicht die typischen Navigationsmöglichkeiten benötigt, die der Browser zur Verfügung stellt. Wenn Sie die Balken am oberen und unteren Rand des iPhone und iPad zu entfernen, gewinnen Sie wertvolle Immobilien für Ihre Entwürfe, aber Sie verlieren den Rücken und nach vorn Pfeile und andere in diese Geräte eingebauten Navigationsfunktionen.

    Wenn Sie diese Option verwenden, stellen Sie sicher, dass Ihre Website-Navigation-Elemente enthält Besuchern zu helfen durch Ihre Website zu bewegen.

  • apple-mobile-web-app-Status-Bar-Stil - Der Standardstil der Symbolleiste auf einem iPhone oder iPad ist undurchsichtig schwarz. Wenn Sie den Stil der Statusleiste zu einem durchscheinenden schwarzen ändern möchten, können Sie ein anderes iOS-spezifischen Meta-Tag verwenden noch. Diese Meta-Tag funktioniert auch nur, wenn der Benutzer eine Website über den Link von einem Web-Clip-Symbol besucht.

Wenn Sie beide der Schnittstelle Bars entfernen und die Statusleiste auf scheinend, haben Sie eine zusätzliche 124 horizontale Pixelzeilen Bildschirm Immobilien in Safari auf dem iPhone und iPod touch. Das sind über 25 Prozent mehr Platz auf dem kleinen Bildschirm! Eine lichtdurchlässige schwarze Statusleiste ermöglicht auch Inhalt der Seite unterhalb der Statusleiste zu fließen.

Menü