How to create a custom iPhone and iPod touch icon for your web site如何創建一個自定義iPhone和iPod的觸摸圖標為您的網站

by Ross McKillop on August 11, 2008 羅斯麥奇洛 2008年8月11號

網頁設計與開發蘋果

This brief tutorial will explain out how to create a custom icon to display on the iPhone and/or iPod touch springboard for your web site.這份簡短的教程將解釋如何創建自定義的圖標以顯示在iPhone和/或iPod的觸摸跳板,您的網站上。

自訂的網站simplehelp.net圖標在iPhone上的跳板

  1. When a user adds a site to their springboard by using the Add to Home Screen feature, by default, the iPhone or iPod touch will use a thumbnail of the visible part of the page being displayed in Safari.當用戶增加了網站的跳板使用添加到主屏幕功能,默認情況下,在iPhone或iPod將採用觸摸縮略圖可見的一部分,該網頁顯示在Safari 。
  2. 默認站點圖標為iPhone和iPod觸摸跳板
    click to enlarge點擊放大

  3. If you’d like your site to have a much nicer icon appear on the springboard when people add it, create a 57px by 57px PNG icon, name it apple-touch-icon.png , and upload it to the root folder of your site. Note: Apple themselves actually use a 129×129px icon, so you may want to experiment to see what size looks best for yours (it will scale to the default iPhone/iPod touch springboard icon size).如果您想您的網站,有一個更好的圖標出現在跳板當人們加入,建立一個57px的57px巴布亞新幾內亞圖標,命名為蘋果觸摸icon.png ,並把它上傳到根文件夾中您的網站。 注:蘋果自己的實際使用129 × 129px圖標,所以你可能想實驗看看大小看起來最適合你(它將規模為默認iPhone / iPod的觸摸跳板圖標大小) 。

    If you don’t have access to the root folder of your site, or you’d like to put the icon elsewhere, add the following line to the <head> of your site:如果您沒有進入根文件夾中您的網站,或者您想要把其他地方的圖標,添加以下行的<head>您的網站:

    <link rel="apple-touch-icon" href="/path/to/file.png" /> (and upload the file.png to that folder). <link rel="apple-touch-icon" href="/path/to/file.png" /> (並上傳file.png到該文件夾) 。

  4. Now when someone adds your site, it will have a nice icon associated with it.現在,當有人加入您的網站,它將有一個美觀大方的圖標與此相關。
  5. 新增網站到iPhone和iPod觸摸跳板
    click to enlarge點擊放大

  6. Done!做完!
  7. 自定義圖標的simplehelp.net為iPhone和iPod觸摸跳板
    click to enlarge點擊放大

Related Posts: 相關文章:
  • How to customize the music icons (buttons) on your iPhone or iPod Touch如何自定義的音樂圖標(按鈕)在您的iPhone或iPod觸摸
  • How to reorder the icons on your iPhone or iPod Touch springboard如何重新排列圖標在您的iPhone或iPod觸摸跳板
  • How to accurately relocate the cursor in Notes for your iPhone or iPod Touch如何準確地搬遷光標在為您的筆記iPhone或iPod觸摸
  • How to take screenshots of your iPhone or iPod Touch screen如何採取截圖的iPhone或iPod觸摸屏
  • Screenshot Tour: Crash Bandicoot Nitro Kart 3D for iPhone/iPod Touch截圖賽:古惑狼賽車硝基三維的iPhone / iPod的觸摸
  • Get Simple Help tutorials just like this one in your email inbox every day - for free!獲取簡單的幫助教程就這樣一個在您的電子郵件收件匣每一天-是免費的! Just enter your email address below:只要輸入您的電子郵件地址如下:

    You can always opt out of this email subscription at any time.您可以隨時退出這個郵件訂閱在任何時候。


    Bookmark and Share 書籤和共享

    { 1 trackback } 1 )引用

    iPhone/iPodTouch: Creiamo un'icona personalizzata per il nostro sito web | DelfinsBlog (Guido Arata) iPhone / iPodTouch : Creiamo un'icona personalizzata每一nostro sito網頁| DelfinsBlog (吉磯)
    08.13.08 at 5:57 am 08.13.08在上午05點57

    { 1 comment… read it below or 1評論...閱讀低於或 add one添加一個 }

    1 1 Jeffrey 10.08.08 at 7:20 am 杰弗裡 10.08.08在上午07點20分

    How to create a custom iPhone and iPod touch icon for your web site如何創建一個自定義iPhone和iPod的觸摸圖標為您的網站

    I am not sure what you are referring to.我不知道你指的是。 Where is the ROOT?哪裡是根? and WHAT Site.和哪些網站。 On my local computer?在我的本地計算機上? On a website?在一個網站嗎? Is this for developers or just for anyone?這是開發商或任何人?
    Thanks謝謝

    If you don’t have access to the root folder of your site, or you’d like to put the icon elsewhere, add the following line to the of your site:如果您沒有進入根文件夾中您的網站,或者您想要把其他地方的圖標,添加下面一行到您的網站:

    (and upload the file.png to that folder). (並上傳file.png到該文件夾) 。

    Leave a Comment發表您的評論

    You can use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> 您可以使用這些HTML標記和屬性: href="" title="">的<a <abbr title=""> <acronym title="">的<b> <blockquote cite=""> <cite>的<code> <del datetime="">的<em> <i> <q cite=""> <strike>的<strong>