My Program ::

'Safari'相關日誌共 3 篇

iphone safari的書籤icon如何設定?

手機大未來 2010/01/05 19:06

views: 20745 times
iphone上的 safari 瀏覽器一直有著很不錯的使用者經驗的手機瀏覽器.

而且可以很方便的把常用的網站 bookmark 到桌面上, 但是那個 icon 若是沒有經過設定的話, 將會是一個小的預覽縮圖放在桌面上(應該說主畫面上).

那如何設定這個 icon 呢? 可以參考這篇資料: http://vjarmy.com/archives/2008/01/howto_iphone_webclip_icons.php , 其實就是建立一個 57*57 的 PNG 圖, 並且檔名命名為 apple-touch-icon.png 放在 web 目錄的根目錄下即可. 這個 57*57 的 PNG 圖就會是"加入主畫面螢幕"上的那個 icon 了.

若不方便放這個檔案到 web server 的網站根目錄, 也可以使用 meta tag 來指定, 如下:

<head>
    ...
    <link rel="apple-touch-icon" href="/images/my.png"/>
    ...
</head>

這樣的效果也是一樣的. 在 apple.com 開發者網站上也有詳細的說明:
http://developer.apple.com/safari/library/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html

http://developer.apple.com/safari/library/codinghowtos/Mobile/UserExperience/index.html

http://developer.apple.com/safari/library/documentation/InternetWeb/Conceptual/iPhoneWebAppHIG/MetricsLayout/MetricsLayout.html

[補充說明 2010/1/6 11:15]
在上面的關於 apple-touch-icon.png 這個檔名, 若是命名為 apple-touch-icon-precomposed.png 的話, 則加入主畫面螢幕時, 不會再對該圖做任何特效處理, 已知的特效應該是一個 3d 效果的圓弧及加上 4個角的圓角. 可以參考這篇上面有圖做比較: http://uxhero.com/how-to/how-to-keep-mobile-safari-from-adding-gloss-to-home-screen-bookmark-icons/

FAV

TAG apple, icone, iphone, Safari, webclip

Trackback 0 : Comment 0

IE6還這麼多人用耶

程式技術 2009/08/02 23:24

views: 16332 times
剛在看這篇文章: IE 6在臺市占率仍超過5成 (http://www.ithome.com.tw/itadm/article.php?c=56054), 發現其實我的想法比較偏向所謂的用戶原始的瀏覽器用什麼, 就會持續用下去的這個狀況, 也就是說, 用戶應該在 XP 就會用 IE6, 在 Vista 就會用 IE7, 在 Windows 7自然用 IE8, 而其中的許多數據也都相當耐人尋味.

用戶自己會選擇使用什麼瀏覽器的, 自然是比較了解電腦, 或是會自己安裝軟體的用家, 而且通常應該要原來固定使用的瀏覽器發生什麼大問題, 或效能不好, 或速度慢等原因, 才會面臨升級或是換瀏覽器的狀況.

不過這也讓我想看一下這個網站的比例狀況(2009/07), 我列出來給大家參考:
狀況如下:
IE6    29.1%
IE7    17.9%
IE8    9.6%
FX3.5    6.8%
FX3.0    10%
SAFARI    3.5%
OTHER    23.1%
其中果然 IE6 佔了大多數, 到 29.1% (相對於上文的報導是沒有那麼高), 而整個 IE 也有 56.6%, 另外 Firefox 則是有 16.8%, Safari 則是 3.5%, 其他的部分包含較小量版本的 IE, FX, 及一些有的沒的, 共有 23.1% (這個也還蠻多的, 真有趣), 整理或圖形如下:

基本上, 網站其實就是要照顧到所有用戶使用的環境來設計功能及呈現, 才不會影響用戶的來訪, 不過, 最重要的是大家都要依照標準來做就對了, 才不會顧此失彼, 這樣也就沒什麼太大的相容性問題!

順便附上 OS 比例也供參考:

FAV

TAG browser, Firefox, Internet Explorer, Safari

Trackback 0 : Comment 0

在IE下也能用FireBug!?

好用軟體 2008/07/26 23:33

views: 38163 times
FireBug, 有在用 FireFox 也在寫網頁程式的人應該不陌生, 若還是真的不清楚, 可以先看看本站之前的介紹:

很好用的javascript除錯工具FireBug (firefox)
FireBug更新功能-Network Monitoring

但是這是一個 FireFox 的網頁工具, 在 IE 下, 甚至 Opera, Safari 下都沒有這麼方便好用的工具, 現在 FireBug Lite 版本提供了這樣的功能了, 可以在 IE 下使用 FireBug 的精簡功能, 請參考官方資料說明:

FireBug Lite

它的使用方式有幾種, 一種是掛入他的 javascript ,

第二種方式是使用 Bookmarklet 的方式, 將它的一組 javascript bookmark 起來備用
第三種方式是 Offline 方便使用, 其實就是把第一種方式的相關 javascript 及 css 整個拿回來, 放在自家網站下使用.

若對 End User 來說, 其實是第二種最為方便, 因為不需要做任何前置作業即可直接使用. 說到這裡, 其實這組 FireBug Lite 是利用 javascript 撰寫的, 所以可以直援 IE, 而且是在 runtime 下執行, 真的很不錯的設計, 不過是這樣的工作原理, 所以功能也相對較少了(所以叫做 Lite), 而 Network Monitoring 也沒有 (當然不會有, 因為它是後來才執行的), 不過 XHR (XML HttpRequest) 仍然有支援囉, 另外觀察 html, css, javascript 等功能也都有.

不過實際上使用時, 仍會有相當多的狀況, 因為原始頁面的內容會影響這個 FireBug Lite 的執行狀況, 導致許多問題發生, 不過也已經相當方便了!

繼續閱讀:
http://www.stevesouders.com/blog/2008/07/25/firebug-lite-12-released/