最近將全部精力都放在由JavaScript驅(qū)動的Web應(yīng)用程序開發(fā)上，JavaScript負(fù)責(zé)驅(qū)動前端和后端，這是一個很奇特的方法，特別是那些在傳統(tǒng)服務(wù)器端技術(shù)(如PHP)沉浸了十多年的技術(shù)老人感覺有點(diǎn)不可思議，幾個***技術(shù)的出現(xiàn)打開了構(gòu)建真正身臨其境的交互式Web應(yīng)用程序的大門，這種Web應(yīng)用程序和桌面應(yīng)用程序在很多方面都有相似之處。

即使有這些很有潛力的新功能，但要忽視房間里的大象(iPad，以及不斷增多的競爭對手，如XOOM)還是相當(dāng)困難的，在不到三年的時間里，其應(yīng)用程序銷售額就超過了10億美元，很明顯，單純通過瀏覽器訪問網(wǎng)絡(luò)內(nèi)容的日子已經(jīng)結(jié)束了。

iPad/iPhone應(yīng)用程序開發(fā)和開發(fā)網(wǎng)站相比，需要完全不同的技巧，也許你過去多年的技術(shù)積累現(xiàn)在一點(diǎn)用場也派不上。但我們必須明白一個道理，只有接受改變才能獲得成功，你可能會想，如果能使用現(xiàn)有的技能為iPad開發(fā)Web應(yīng)用程序該多好，恩，這個真可以，不信的話請接著往下看。

向iPad圖標(biāo)菜單添加一個圖標(biāo)

我想以一個本末倒置的方式開始，因?yàn)楹芏嚅_發(fā)人員開始都喜歡問一個問題，如何將Web應(yīng)用程序和iPad界面緊密集成?這個問題其實(shí)就是問，在應(yīng)用程序菜單上，單擊某個應(yīng)用程序的圖標(biāo)，如何啟動這個應(yīng)用程序?不管你信不信，答案比你想象的要簡單，因?yàn)閕Pad的Safari瀏覽器已經(jīng)內(nèi)置了這樣的功能，如圖1所示。

▲圖 1 向iPad啟動菜單添加一個Web應(yīng)用程序

點(diǎn)擊“Add to Home Screen(添加到主屏幕)”選項(xiàng)時，iPad將會為網(wǎng)站創(chuàng)建一個應(yīng)用程序圖標(biāo)，使用當(dāng)前頁面的截屏，然后使用網(wǎng)站域名作為圖標(biāo)的標(biāo)題，如圖2所示。

▲圖 2 在iPad上創(chuàng)建一個Web應(yīng)用程序啟動圖標(biāo)

創(chuàng)建好圖標(biāo)后，它將會添加到應(yīng)用程序菜單中，如圖3所示。

▲圖 3 iPad Web應(yīng)用程序啟動圖標(biāo)

從邏輯上講，你可能希望給你的Web應(yīng)用程序關(guān)聯(lián)一個自定義啟動圖標(biāo)，當(dāng)然這也是可以辦到的，通過apple-touch-ico鏈接元素，你可以指定一個自定義圖標(biāo)來覆蓋iPad的默認(rèn)行為，但這個功能只對Safari瀏覽器開放，例如，將下面的鏈接元素嵌入到WJGilmore.com布局模板將會導(dǎo)致使用名為wjgilmore.png的圖標(biāo)，不管用戶是否決定將站點(diǎn)添加到他們的應(yīng)用程序啟動菜單。

順便提一句，iPad標(biāo)準(zhǔn)圖標(biāo)大小是72x72像素。

由于安全原因，Web開發(fā)人員不能自動化這個過程，但是，你可以使用友好的提醒提示用戶如何做。#p#

從iPad移除Safari界面元素

即使通過啟動圖標(biāo)可以方便地訪問Web應(yīng)用程序，但iPad應(yīng)用程序和Web應(yīng)用程序之間的脫節(jié)還是一目了然的，當(dāng)Safari瀏覽器啟動時，你的Web應(yīng)用程序在熟悉的瀏覽器界面區(qū)域內(nèi)打開，這個感覺是不是有點(diǎn)坑爹呢，有辦法，你可以使用apple-mobile-web-app-capable元數(shù)據(jù)元素告訴iPad以全屏模式啟動應(yīng)用程序，圖4顯示了WJGilmore.com在iPad上全屏運(yùn)行的狀態(tài)，注意屏幕頂端的工具欄永遠(yuǎn)都會顯示，不會被網(wǎng)頁給擋住了。

▲圖 4 全屏模式運(yùn)行Web應(yīng)用程序

在iPad上查看HTML源代碼

iPad Safari瀏覽器與其桌面版本相比，缺少了很多功能，甚至連查看網(wǎng)頁源代碼的功能都木有，在測試Web應(yīng)用程序時，如果沒有這個功能那是相當(dāng)讓人郁悶的，你通常希望與特定瀏覽器相關(guān)的功能被正確地包含進(jìn)來，并正確地得到了渲染，雖然Safari沒有開放查看網(wǎng)頁源代碼的功能，但我們還有其它解決辦法，讓你可以閱讀任何頁面的HTML，辦法就是創(chuàng)建一個書簽，當(dāng)它啟動時執(zhí)行一段JavaScript代碼就可以看到網(wǎng)頁源代碼了。具體步驟請移步這里。

iPad瀏覽器注意事項(xiàng)

Safari瀏覽器移動版本在擁抱***標(biāo)準(zhǔn)方面一直處于領(lǐng)先地位，因此，它所支持的一些功能可能會讓你大吃一驚，我們一般都認(rèn)為移動設(shè)備基本上都是步履蹣跚的設(shè)備，但是，Safari移動版讓人意想不到地加入了連桌面版也沒有的功能，例如，iOS 4.2附帶的Safari包括對HTML 5和WebSocket的增強(qiáng)支持。

iOS 4.2也增加了對iPad加速計的支持，它使構(gòu)建真正***界面的Web應(yīng)用程序成為可能，Alberto Sarullo發(fā)布了一個加速計Demo(只支持iPad和iPhone)，真正把這個功能演示到家了，我也建議你閱讀一下他對新加速計功能的分析。

從iOS 3.0開始就內(nèi)置了地理定位功能，這些JavaScript擴(kuò)展讓開發(fā)人員可以輕松識別用戶的位置，原理就是根據(jù)用戶如何連接到互聯(lián)網(wǎng)來判斷的。

如何開始?

基于Web的iPad應(yīng)用程序開發(fā)是一個充滿機(jī)遇的領(lǐng)域，但它得到的關(guān)注卻太少，如果你對這個話題感興趣，我建議你從蘋果公司的Safari官方開發(fā)文檔開始，其中包含了大量與Safari移動版相關(guān)的信息。