事實(shí)證明，F(xiàn)lash 已經(jīng)不再是互聯(lián)網(wǎng)視頻瀏覽的必需……新的開放標(biāo)準(zhǔn)已經(jīng)被創(chuàng)立，比如 HTML5 這樣的標(biāo)準(zhǔn)才會(huì)在移動(dòng)設(shè)備和個(gè)人電腦上同樣取得成功?！?/strong>

喬布斯在 2010年的公開信《關(guān)于 Flash 的一點(diǎn)思考》中說。

在這封公開信中，喬布斯是這樣解釋 HTML5 的：最新的網(wǎng)絡(luò)標(biāo)準(zhǔn)，已經(jīng)為蘋果、谷歌等許多公司所采用，它允許開發(fā)者開發(fā)出更為高級(jí)的圖形、印刷和動(dòng)畫，并且不需要第三方瀏覽器插件（如 Flash ）就能轉(zhuǎn)換。當(dāng)然，也正是蘋果和谷歌這樣的科技公司在推動(dòng)著 HTML5、CSS 和 JavaScript 等開放標(biāo)準(zhǔn)的普及和發(fā)展。

有關(guān) HTML5 的優(yōu)勢(shì)，我在《HTML5是什么鬼？》也進(jìn)行過總結(jié)。

這是2016年朋友圈的新現(xiàn)象：不論是網(wǎng)頁邀請(qǐng)函，節(jié)日游戲，還是品牌廣告，那些被分享出來的 HTML5 頁面不斷嘗試著用更有意思、更流暢的方式來講述每一個(gè)事件。

過去一年，幾乎所有人——你的甲方，你最喜歡的品牌，你朋友任職的互聯(lián)網(wǎng)公司，都意識(shí)到了 HTML5 的作用。它不是一個(gè)簡(jiǎn)單的網(wǎng)頁，而是能夠更加有效地組織互聯(lián)網(wǎng)中的信息，讓視頻、音頻等服務(wù)得到更好的支持；并在減輕開發(fā)者的負(fù)擔(dān)的同時(shí)，讓你在不同的平臺(tái)上有更一致的體驗(yàn)。

對(duì)于用戶來說，通過 HTML5 獲得了前所未有的體驗(yàn)，與品牌產(chǎn)生共鳴或是激起好奇心，這才是最重要的。

一個(gè)月前的天貓雙十一狂歡節(jié) HTML5 推廣頁面《穿越宇宙來看你》，在全景應(yīng)用的基礎(chǔ)之上，添加了上下滑動(dòng)預(yù)覽節(jié)目單的功能，用戶在迅速到達(dá)天貓所在舞臺(tái)的過程中，還可以看到兩側(cè)會(huì)場(chǎng)的各種信息。

相比去年《2015，世界為誰傾倒？》不停180度翻轉(zhuǎn)手機(jī)的折騰，你會(huì)發(fā)現(xiàn)，2016年的HTML5頁面則更加簡(jiǎn)單、粗暴。

225 張內(nèi)置素材，通過拍攝、合成、3D渲染等制作方式，最后以平面圖片的形式導(dǎo)出 HTML5 頁面，最終網(wǎng)站的總體量卻在5MB以內(nèi)。

Durex GO

杜蕾斯在七夕節(jié)開發(fā)出一款類《Pokemon Go》游戲《Durex GO》，只是將捕捉目標(biāo)更換成喜鵲。用戶在地圖上可以看到自己身邊的喜鵲，不同的喜鵲會(huì)在游戲進(jìn)行一段時(shí)間后，進(jìn)化為代金券、杜蕾斯產(chǎn)品或是酒店鑰匙等，捕捉成功的用戶可以將其兌換為相應(yīng)的產(chǎn)品。

一個(gè) HTML5 的成功往往得益于更立體的視覺和聽覺感受，與用戶更有趣的互動(dòng)，就像通過萬花筒來觀察世界一樣，為你呈現(xiàn)出前所未有的景象。

以此為理念，推陳出新的優(yōu)酷萬花筒 HTML5，用萬花筒的成像方式將每一類內(nèi)容中最具代表性的元素進(jìn)行合理地拆分，再重組。在英文中，Kaleidoscope（萬花筒）集合了希臘語 Kalos（美麗），Eidos（形狀）和 Scope（觀看）的意思，這也正是優(yōu)酷想要在這支萬花筒式的 HTML5 中想要傳遞的——豐富的色彩，多樣的表達(dá)。

你不會(huì)想到，僅僅在一個(gè) HTML5 中，制作方就使用了 Web Graphics Library（Web GL）3D 繪圖標(biāo)準(zhǔn)完成繪制，它可以為 HTML5 Canvas 提供硬件3D加速渲染，有效地幫助Web開發(fā)人員借助系統(tǒng)顯卡來瀏覽器里更流暢地展示3D場(chǎng)景和模型，甚至是更為復(fù)雜的導(dǎo)航和數(shù)據(jù)的視覺化。

點(diǎn)擊閱讀原文體驗(yàn)這個(gè) HTML5 前你可能還需要知道，它最終展現(xiàn)了優(yōu)酷的“煥新”計(jì)劃：如果曾經(jīng)的優(yōu)酷是一家視頻網(wǎng)站，那么現(xiàn)在的優(yōu)酷就要成為一家很酷的視頻網(wǎng)站。

在視頻漸漸成為互聯(lián)網(wǎng)內(nèi)容主流載體的時(shí)代到來時(shí)，作為用戶的你每時(shí)每刻都能夠知曉世界各地正在發(fā)生的事情，視頻幫助我們記錄每一個(gè)短暫的、偉大的時(shí)刻，也正是這些時(shí)刻，帶給你一次次的感動(dòng)、震撼。

總之，你將逐漸看到一個(gè)嶄新的優(yōu)酷。

這個(gè)世界當(dāng)然很酷，優(yōu)酷正在做的是努力讓你看到這個(gè)很酷的世界、世界的每一面，就像在萬花筒中看到繽紛的顏色、妙不可言的幾何圖形，從內(nèi)心深處被打動(dòng)?！盁ㄐ隆庇?jì)劃或許只是優(yōu)酷作為這個(gè)行業(yè)的一份子向前邁出的一小步，但這也讓作為用戶的你看到了，優(yōu)酷想要為你呈現(xiàn)一個(gè)更美好的世界的心愿。

一鏡到底的萬花筒，大劇熱綜都藏在里面了，點(diǎn)擊【閱讀原文】，打開音樂，用手指觸碰出一個(gè)更炫的世界。

烏 云 裝 扮 者

To see behind walls.To draw closer.To find

each other and to feel.That is the purpose of life.

世界、黑色趣味和明亮內(nèi)心

EADTOOLS提供了屢獲獎(jiǎng)項(xiàng)的文字識(shí)別OCR開發(fā)包。使用全新的HTML5查看器和RESTful Web服務(wù)，你可以創(chuàng)建一個(gè)令人難以置信的識(shí)別應(yīng)用程序，它能夠運(yùn)行在任意的臺(tái)式電腦、平板電腦或移動(dòng)設(shè)備上。無需犧牲移動(dòng)設(shè)備的速度和功能，開發(fā)者現(xiàn)在可以享受到強(qiáng)大桌面應(yīng)用程序擁有的所有好處。由于應(yīng)用程序本質(zhì)上是跨平臺(tái)的，因此程序員可以節(jié)省很多時(shí)間以及測(cè)試的成本，在更新和維護(hù)應(yīng)用程序時(shí)擁有一個(gè)更平和的心態(tài)。

LEADTOOLS SDK HTML5&OCR的主要功能

· 用于跨平臺(tái)圖像查看的HTML5/JavaScript Viewer控件。

· 支持HTML5，可以運(yùn)行在任何臺(tái)式機(jī)、平板電腦或移動(dòng)設(shè)備上的瀏覽器。

· 支持鼠標(biāo)和多點(diǎn)觸控（手勢(shì)）輸入。

· 交互模式包括：

a. 平移

b. 縮放

c. 區(qū)域縮放

d. 以點(diǎn)為中心縮放

e. 放大鏡

f. 合攏分開手指進(jìn)行縮放

g. 回彈效果

· 基于物理和邏輯單元顯示圖像。

· 圖像操作內(nèi)置以下動(dòng)作：

a. 旋轉(zhuǎn)

b. 翻轉(zhuǎn)

c. 縮放

· 本地化的圖像注釋和標(biāo)記。

· 包含源碼，易于定制和品牌化。

· 擴(kuò)展LEADTOOLS RESTful Web服務(wù)，添加高級(jí)功能，如擴(kuò)展后文件格式支持（TIFF、PDF、DOC、DICOM等），OCR和條碼。

· 快速、準(zhǔn)確、多線程的OCR文字識(shí)別引擎，用于桌面應(yīng)用程序或高性能的服務(wù)器環(huán)境。

· 整頁和區(qū)域OCR。

· 支持廣泛的語言和字符集，包括拉丁文、斯拉夫字母、東亞語言和阿拉伯語。

· 強(qiáng)大的文檔圖像清理和預(yù)處理功能

· 從任意顏色、灰度或黑白圖像中提取文本。

· 使用LEADTOOLS Cloud SDK輕松創(chuàng)建靈活的、強(qiáng)大的和高效的分布式OCR應(yīng)用程序。

包含 HTML5 & OCR文字識(shí)別技術(shù)的SDK產(chǎn)品

HTML5 / JavaScript Viewer控件

這個(gè)例子我們使用到HTML5 Image Viewer控件，展示了如何調(diào)用OCR RESTful web服務(wù)。文章中的示例并沒有包含所有代碼。

OCR RESTful Web服務(wù)

LEADTOOLS OCR RESTful Web 服務(wù)是將OCR功能添加到任意應(yīng)用程序中的簡(jiǎn)單方法，無需下載龐大的語言識(shí)別庫和可執(zhí)行程序。它只需要一組簡(jiǎn)單的參數(shù)（原始圖像和識(shí)別區(qū)域），并將結(jié)果以容易解析的JSON結(jié)構(gòu)返回。

在這個(gè)示例中，我們?yōu)槟故玖巳绾问褂脀eb服務(wù)執(zhí)行兩種類別的識(shí)別：部分的或整頁的。第一種通過使用查看器內(nèi)置的rubber band事件選擇一塊小區(qū)域完成。使用鼠標(biāo)單擊拖動(dòng)或手指觸摸屏幕滑動(dòng)，用戶可以在圖像中選擇一個(gè)矩形，觸發(fā)事件然后將它們的坐標(biāo)傳遞給后臺(tái)的web Service。

一旦服務(wù)按照onReadyStateChanged事件處理完成，你就可以使用JSON解析響應(yīng)，根據(jù)應(yīng)用程序的需要顯示或使用識(shí)別出的文本。在下面的例子中，我們會(huì)在一個(gè)警告框中顯示文字。

_selectRecognizeArea_RubberBandCompleted$1: 
 function HTML5DemosLibrary__ocrDemo$
_selectRecognizeArea_RubberBandCompleted$1(sender, e) {
   // 獲取選中的區(qū)域，將它作為OCR文字識(shí)別的一個(gè)區(qū)域
var searchArea = Leadtools.LeadRectD.fromLTRB(e.get_point1.get_x, 
   e.get_point1.get_y, e.get_point2.get_x, e.get_point2.get_y);
   var visibleRect = _viewer.imageControlRectangle(true);
   searchArea.intersect(visibleRect);
   searchArea = _viewer.convertRect(Leadtools.Controls.CoordinateType.control, 
                Leadtools.Controls.CoordinateType.image, searchArea);
   if (searchArea.get_width > 3 && searchArea.get_height > 3) {
      this._recognize$1(searchArea);
   }
},

 
_recognize$1: function HTML5DemosLibrary__ocrDemo$_recognize$1(searchArea) {
   // 當(dāng)?shù)却龝r(shí)，顯示正在加載的圖片
   this.beginOperation;
   
   // 創(chuàng)建請(qǐng)求   
   var rest = this.buildServiceUrl('ocr.svc');
   rest += '/GetText?uri=';
   rest += _viewer.get_imageUrl;
   var imageSize = _viewer.get_imageSize;
   rest += '&width=';
   rest += parseInt(imageSize.get_width);
   rest += '&height=';
   rest += parseInt(imageSize.get_height);
   if (!searchArea.get_isEmpty) {
      // 沒有選擇，則識(shí)別整個(gè)頁面
      rest += '&left=';
      rest += parseInt(searchArea.get_left);
      rest += '&top=';
      rest += parseInt(searchArea.get_top);
      rest += '&right=';
      rest += parseInt(searchArea.get_right);
      rest += '&bottom=';
      rest += parseInt(searchArea.get_bottom);
   }
   
  // 創(chuàng)建請(qǐng)求和事件句柄
   var request = new XMLHttpRequest;
   var _this = this;              
   var readyStateChanged = function {
      if (request.readyState === 4) {
         if (request.status === 200) {
            var results = null;
            if (request.responseText != null && request.responseText.length > 0) {
               results = JSON.parse(request.responseText);
            }
            else {
               alert('No text was found in the specified area, 
               please select another area that contains text and try again.');
            }
            request.onreadystatechange = null;
            request = null;
            _this.endOperation(false);
            if (results != null) {
               alert (results);
            }
         }
         else {
            _this.showRequestError(request);
         }
      }
   };
   
   // 發(fā)送請(qǐng)求
   request.onreadystatechange = readyStateChanged;
   request.open('GET', rest, true);
   request.send;
},

你可能注意到了如果沒有給識(shí)別函數(shù)傳遞矩形，它會(huì)為整個(gè)圖像創(chuàng)建一個(gè)矩形，然后調(diào)用web服務(wù)。因此程序員需要做的只是創(chuàng)建一個(gè)簡(jiǎn)單的按鈕事件處理器完成整個(gè)頁面的OCR。

var recognizeButton = document.getElementById('recognizeButton');
recognizeButton.addEventListener('click', function(e) {
   // 發(fā)送一個(gè)空區(qū)域，識(shí)別整個(gè)圖像   
   _this._recognize$1(Leadtools.LeadRectD.get_empty);
}, false);

總結(jié)

LEADTOOLS為開發(fā)者提供了世界一流的穩(wěn)定圖像庫。易用的高級(jí)編程接口使業(yè)務(wù)關(guān)鍵型應(yīng)用程序的快速開發(fā)變?yōu)榭赡堋?/p>

HTML5和OCR RESTful Web服務(wù)是LEADTOOLS諸多功能中的一個(gè)。

本站文章除注明轉(zhuǎn)載外，均為本站原創(chuàng)或翻譯