隨著智慧型手機、平板電腦漸趨普及，不僅使觸控一躍成為主流輸入方式，為使用者形塑新穎的網路瀏覽體驗，也為開發者開啟寬廣大門，只要巧妙運用HTML5與CSS3技術，即可走進一個更自由無拘、更易於展現創意的嶄新世界！
以往人們要遨遊網路世界，至少得倚賴三種元素－鍵盤、滑鼠、螢幕；所以只見電腦使用者，長時間坐定在固定位置，聚精會神緊盯螢幕，配合滑鼠移動、鍵盤敲擊，沈浸在自己的一片天地。
只不過，鮮少歷經電腦薰陶的年長人士，無奈被隔絕在繽紛網路世界之外，只能靠著傳統的報章書籍，填補求知渴望。
但最近這2~3年，所有的事情，開始變得不一樣！人們連結網路的主要載具，從個人電腦變成行動裝置，輸入方式由鍵盤及滑鼠變成了觸控；隨著這個轉變，使用者不再受限於時空疆界，無論身處何地，只要能連網，都可恣意翱翔數位天空，即使年長人士，都因為觸控打破層層壁壘，得以融入缺席已久的數位情境。
身處這個嶄新世界，人們啟動數位應用的第一個接觸點－瀏覽器，無疑顯得格外重要，因此它身繫重任，必須引領人們突破過往的網頁使用模式，營造快速飆網、流暢觸控、安全無虞的瀏覽體驗。譬如隨著微軟新一代作業系統Windows 8聯袂現身的Internet Explorer 10(以下簡稱IE10)，便以此為主要訴求。
藉由IE10，我們清楚看到顛覆傳統的「無邊框」設計、直觀實用的釘選網站(Pinned Sites)功能，或透過常用工具列(Charm bar)，輕鬆啟用網頁分享功能，一切的一切，都足以匯聚為深刻的感觸，讚嘆現今瀏覽技術之進步飛快！
更值得一提的，Windows 8為求因應不同裝置屬性，分別提供最美好的操作體驗，所以特別內建「雙版本」IE10，一是適用傳統環境的桌面版IE10，另一則是適用觸控環境的Modern IE10。
當然，要真正孕育完美的網路使用經驗，固然需要快速、直覺、安全的瀏覽器服務來牽成，更重要的，仍有賴開發人員展現絕佳設計成果。為此微軟在IE10悉心新增許多實用功能，幫助開發人員實現創意巧思，挑戰無限可能。且看IE10如何引領開發者進入全新的紀元？而開發者如何善用創新功能，開闢另一個嶄新世界？
更加完整支援HTML5
從IE9開始，微軟已展現支援HTML5技術的決心，到了IE10，支援範圍則更加完整徹底，一些過去仍須倚靠外掛程式(例如Plugins、ActiveX等)、或圖片技巧才能營造的效果，如今都能獨立完成。
首先，它引進HTML5視訊增強功能，採用
再者，它開始支援draggable屬性，使得套用與屬性相關的任何HTML元素，都能在頁面上拖曳，不僅如此，IE10也在dataTransfer物件中新增files屬性，得以從桌面拖放一或多個檔案到網頁，相當方便。
另外，IE10也新增了對WebSocket API的支援，此後開發者只需動用少許程式碼，就能輕易利用低延遲的雙向資料交換，建立快速的線上遊戲、即時社交網路通知、即時顯示股票和天氣資訊等即時資料，打造迅捷流暢的網頁顯示效果。
大量支援CSS規格
對開發者的另一大福音,即在於IE10增加支援許多新的「階層式樣式表(CSS)」規格，包括了新的進階配置、視覺效果、移動瀏覽與縮放功能。譬如開發者可利用CSS3 Animation製作網頁動畫，也可利用CSS3 Transition設定網頁元素過場特效。
不僅如此，開發者還可使用CSS3 Transformation改變網頁元素的縮放、位移或旋轉，輕鬆創造各種變形效果；至於CSS Grid Layout、CSS Multi-column layout或CSS Flexible Box，則有助開發者快速進行排版。也就是說，開發者過去「辦不到」或「很難辦到」的特效，都不再是難解習題。
因IE10大力支持HTML5，也使它擁有一項重要特質，不再只是單純的網頁顯示工具，可搖身一變成為APP平台。誠如多奇數位創意技術總監黃保翕所說，IE10的誕生，讓開發者得以運用HTML5單一技術標準，快速打造跨瀏覽器、跨行動裝置的應用成果。
台灣微軟應用開發技術經理上官林傑呼應這個說法，有了HTML5的加持，開發者的想像力不會框限於網頁，可同時展現在眾多平台。
「HTML5時代真的到了！」悠邁科技共同創辦人劉詩雁說，IE10讓HTML5真正進入開發者的主流世代，堪稱是重要分水嶺！
擁抱開發新世界
挾著「網頁無邊框」、「快速瀏覽」、「安全」、「流暢觸控」及「跨平台裝置」等嶄新特色，再加上HTML5及CSS3技術助陣，IE10將大幅顛覆開發者對IE瀏覽器的想像，讓無窮的創意巧思，得以跨越瀏覽器、行動裝置等疆界，揮灑在一個美麗新世界！
Touch時代新整合
無論是多奇數位創意技術總監黃保翕、悠邁科技共同創辦人劉詩雁，或台灣微軟的應用開發技術經理上官林傑，三人都有渾厚的技術底蘊，擁有豐富的開發實務經驗，對於IE10不管是形諸於外、甚或看不見的功能特質，都有深刻體悟。
接下來的篇幅，將透過與三人的對談(註：黃保翕簡稱『黃』、劉詩雁簡稱『劉』、上官林傑簡稱『上官』)，帶領開發者深入探索IE10，領略Touch時代的新整合內涵，使得想像力一飛衝天！
《趨勢面》
問：消費者未來使用資訊產品樣貌是什麼？
黃：未來資訊產品將是多元的，不論滑鼠、鍵盤、觸控，甚至Kinect 3D立體輸入，任何以使用者為中心所設計的輸出入方式，都可能蓬勃發展。
上官：未來有無限可能，不會拘泥在某一種型式，人類操控機器的方式，將會不斷進步與改良，除了觸控外，其餘包括實體按鍵、聲控、手勢控制等等，都將朝著最符合人們習慣使用的方向持續演進，想像空間無窮大。另由「無邊框」設計帶動的全新網站體驗，使用者只需輕鬆撥動手指就能啟用許多功能，更蘊含無限可能。
劉：據我的觀察，現在每一節捷運車廂內，至多可同時看到10~15台平板電腦，只見人們聚焦會神地閱讀或使用即時通訊，顯見觸控功能深植人心，今後會有更多以觸控為基礎的應用誕生。
問：消費者使用經驗與使用方式改變，帶動哪些事情？哪些商機？
黃：使用經驗改變，但有一點肯定不會變，那就是連網！透過網路，將使人與人的互動更為即時，另外拜觸控所賜，以往不擅長電腦打字的中老年族群，也得以加入這場互動體驗，可望帶動一些與人際相關的應用商機，我估計這個商機，起碼是現在的2~3倍大。
劉：隨著智慧型手機普及，預期未來結合手機、LBS定位服務、擴增實境(AR)等新興應用商機將會陸續現身；例如當人們走進賣場，開啟該商場的App，並將手機鏡頭朝著某個專區拍攝，很快的，屬於該專區的商家介紹及相關Campaign，就會呈現在手機螢幕。此外，一些結合心跳、血糖等偵測機制的客製化平板裝置，可望隨著中高齡者對於健康照護的殷切需求，找到不錯利基。
上官：我提出一個另類商機，當人們隨身攜帶的裝置變多且頻頻觸摸，類似像擦拭布等保養工具，理應具有不錯的銷售潛力。另外，未來行裝動置會更加聰明，甚至藉由使用者的手指觸控或聲控，感知其身心狀態，例如從聲紋辨識出使用者為老年人，瀏覽器便自動放大字體，營造更完美的體驗，此類商機頗具看頭。
問：這些改變，對開發者，又帶來哪些機會？有哪些挑戰？
黃：多元性的裝置與輸出入方式，使得應用格局擴大，開發者可發揮的機會變多，但有鑑於長尾效應，研判市場上最為大宗的應用需求，恐怕只會由1~2家少數業者掌控，多數開發者唯有朝向獨特的創新應用發展，才不致被市場洪流淹沒。
劉：網路創業圈成功案例其實不多，因為不管是Web或APP應用，不過是服務通路的型式，很難變成主要業務，因此開發者恐怕得好好經營網站營運、社群人脈，才有利於創造商機。
上官：儘管隨著Web與行動裝置崛起，已觸動社會運作方式之轉變，使開發者有機會直接接觸閱聽眾，但不變的是，仍需結合行銷與業務助力，才可望吸引閱聽眾的眼球；因此開發者鑽研技術研發之餘，必須透過異業結盟或其他方式，補足這部分的能量。
《效益面》
問：IE10對開發者，帶來哪些契機？
上官：我經常用平板展示一款Atari網頁遊戲，若不特別說明，大家都以為它是APP，因為觸控流暢度實在太棒；此套遊戲是以IE10為基礎開發而成，看到這裡，似已無須多言，開發者理應體認到，這其中實在蘊藏莫大契機。
從前若不靠Flash等外掛程式，單單以JavaScript或CSS開發網頁遊戲，想做到類似Atari的煙霧特效，難度非常高，就算勉強做出，順暢度也不佳；現在透過IE10對HTML5等新技術的支援，再配合強大的硬體加速功能，所有難題終告化解。更重要的是，拜HTML5所賜，網頁程式可直接轉換為APP，開發者只須做一次工，不必多寫任何一行Code，既可放到Web、又可放到APP市集，兼顧不同市場需求，何樂而不為？不論上述的Atari，或是Cut the Rope、Contre Jour等知名遊戲，全都是「既IE10又APP」的成功案例。
黃：就像Cut the Rope，每一條擺動的繩子，皆由1萬多個三角形組成，過去只能用DIV與CSS來做，然一旦超過幾百個Pixels，就開始出現明顯的Lag，導致效能不佳，現在那怕更複雜的物件，在IE10都能順暢運行。
其中有兩大關鍵，第一是HTML5 Canvas技術，充分利用硬體顯示卡的加速效果，將2D繪圖運算交由繪圖加速晶片處理，不再成為CPU的負擔；第二是IE10內建Chakra引擎，大幅提升JavaScript效能。而IE10所提供的Pointer API，訴求可用一次設計，同時滿足滑鼠、觸控、筆控等不同輸入裝置，對開發者亦是一大福音。
劉：前對滑鼠、觸控、筆控等不同輸入，以往需要各自撰寫大量程式，譬如採用複雜的運算式，判斷touchstart、touchmove與touchend等運行軌跡，辛苦程度不在話下。現在透過Pointer API，讓許多原本繁瑣的動作，得以大幅簡化為單單一行程式。
問：請分享實際使用IE10的幾個最棒功能。
上官：IE10的精髓，就在於對HTML5的擴大支援，使一些棘手任務變得輕而易舉；畢竟從1999年過後，Web標準的進步有限，迫使開發者必須套用一些「怪招」，或採取複雜計算、使用Plugins，才能滿足某些需求，但現在不管要做格線對齊、影音播放、2/3D繪圖、增加觸控功能，或是進行RWD(Responsive web design)設計，只要下幾個標準語法就輕鬆搞定，負擔頓時減輕大半。
我認為，開發人員應將心力聚焦於產品研發，而非將大把時間花在調整行距等瑣事，與其做得辛苦且效果不佳，倒不如讓IE10代為自動處理。
劉：IE10提供不少精采功能，例如CSS Regions、Grid System都頗具代表性。CSS Regions打破以往頁面區塊的線性排列慣性，可讓各個區塊不規則分佈排列，即使如同雜誌型態的複雜排版，都能做得到；Grid System則讓開發者不再需要運用複雜程式，不斷計算絕對定位，即可補足過去Table或CSS所欠缺的版面配置彈性，自動根據不同螢幕尺寸放大或縮小。
黃：IE10也支援多欄位排版(Multi-column Layout)功能，開發者只需動用2~3行CSS屬性設定，就能解決從前無解的文章斷句難題。假設某網頁內容，當平板採取橫向顯示(Landscape Mode)適合以三欄呈現，若調整為直向顯示(Portrait Mode)，即適合以兩欄呈現；現在只要設好CSS屬性，兩欄或三欄不管如何切換，都能維持斷句的正確性。
Modern IE10另提供一項可直連Windows 8 APP的功能，讓使用者能在網頁、APP之間隨意切換，甚至透過Modern IE10引導下載互相關連的APP。而IE10支援影片播放的字幕顯示功能，也是歷代IE之首見。
問：推薦與IE10相關論壇、相關社群。
上官：我首先推薦Internet Explorer Test Drive，這是一個專屬於IE瀏覽器的火力展示平台，不僅陳列各項功能，也提供完整的技術參考文獻。此外，開發者也可以在MSDN官網上獲取豐富素材。
劉：個人覺得IEBlog非常棒，文章質量相當高，不論是技術原理的詳盡解釋，或是範例碼的完整提供，相信都會讓開發者獲益良多。
黃：CodeProject也相當不錯，同樣分享許多技術文章與程式碼；而微軟也在這個網站開闢專欄，專門講述HTML5。
《工具面》
問：開發者如何選平台？如何看待不同開發工具？
劉：我服務的公司，也承接Web開發專案，依專案的實現面，自然需要廣泛支援不同瀏覽器平台，特別是位居主流的IE，一定加以支援。其次就看專案本身的需求，若涉及轉場效果，即使IE9都需要靠Flash等其他程式來填充需求缺口，IE10則不必，此時IE10就是當然的首選。
黃：若是消費性Web應用，任何瀏覽器都得支援，但如果是企業內部Web應用，則會有所選擇，但不妨可考慮幾個要素，一是部署的方便性，IE10內建於Windows，可結合AD進行軟體派送，方便性最佳；二是參考文件的完整性，IE10相關的教學文件、範例碼資源眾多，也有專業的論壇，而且都由官方支援，足以滿足開發者各項需求；三是安全性，IE10提供SmartScreen篩選工具，可協助攔阻惡意網站，其餘瀏覽器並未見到類似功能。
最後則是開發工具考量。微軟Visual Studio 2012程式碼編輯器功能強大，外掛的Web Essentials實用性甚高，也可望為IE加分。
上官：我針對Web Essentials補充，它可以快速輔助開發者使用正確語法，甚至以CSS語法描述顏色時，也會立即在一旁顯示真實顏色，頗具實用價值。
隨著HTML5等開放標準演進，開發工具選項變得更加多元，亦出現許多來自開放原始碼社群的Package或外掛程式，但其實很多東西，Visual Studio 2012都能予以整合，不見得必然互斥。我想呼籲的是，不少HTML5功能規格，在2~3年前都還只是草案，因此通常由瀏覽器供應商以附加前置詞方式搶先提供，但隨著草案陸續底定，開發者大可從語法中拿掉前置詞，以免在跨瀏覽器的開發上出現問題。
IE10的工具
1. Internet Explorer Test Drive
http://ie.microsoft.com/testdrive/
2. MSDN
http://msdn.microsoft.com/zh-TW/ie
3. IEBlog
http://blogs.msdn.com/b/ie/
4. CodeProject
http://www.codeproject.com/
