Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>See the <strong><a href="http://developer.apple.com/safari/library/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW4" rel="nofollow noreferrer">Specifying a Webpage Icon for Web Clip</a></strong> section of the <em>Configuring Web Applications</em> page of the <em>Safari Web Content Guide</em> in the <em>Safari Reference Library</em>...</p> <blockquote> <h2>Specifying a Webpage Icon for Web Clip</h2> <blockquote> <p><strong>iPhone OS Note:</strong> The Web Clip feature is available in iPhone OS 1.1.3 and later. The <code>apple-touch-icon-precomposed.png</code> filename is available in iPhone OS 2.0 and later.</p> </blockquote> <p>You may want users to be able to add your web application or webpage link to the Home screen. These links, represented by an icon, are called Web Clips. Follow these simple steps to specify an icon to represent your web application or webpage on iPhone OS.</p> <ul> <li><p>To specify an icon for the entire website (every page on the website), place an icon file in PNG format in the root document folder called <code>apple-touch-icon.png</code> or <code>apple-touch-icon-precomposed.png</code>. If you use <code>apple-touch-icon-precomposed.png</code> as the filename, Safari on iPhone OS won’t add any effects to the icon.</p></li> <li><p>To specify an icon for a single webpage or replace the website icon with a webpage-specific icon, add a link element to the webpage, as in:<br> <code>&lt;link rel="apple-touch-icon" href="/custom_icon.png"/&gt;</code><br> In the above example, replace <code>custom_icon.png</code> with your icon filename. If you don’t want Safari on iPhone OS to add any effects to the icon, replace <code>apple-touch-icon</code> with <code>apple-touch-icon-precomposed</code>.</p></li> </ul> <p>See <a href="http://developer.apple.com/safari/library/documentation/InternetWeb/Conceptual/iPhoneWebAppHIG/MetricsLayout/MetricsLayout.html#//apple_ref/doc/uid/TP40007900-CH6-SW31" rel="nofollow noreferrer">"Create an Icon for Your Web Application or Webpage"</a> in <a href="http://developer.apple.com/safari/library/documentation/InternetWeb/Conceptual/iPhoneWebAppHIG/Introduction/Introduction.html#//apple_ref/doc/uid/TP40007900" rel="nofollow noreferrer">iPhone Human Interface Guidelines for Web Applications</a> for webpage icon metrics.</p> </blockquote>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload