現(xiàn)如今，利用HTML5和CSS3完成的令人驚艷的技術(shù)，以及適用于手機和平板電腦的原生應用已觸手可及。對移動設備的接受，似乎使其已取代臺式機成為首選的計算設備。想一想每天使用的所有令人難以置信的應用；如果利用這些技術(shù)，實現(xiàn)人機界面(HMI)/監(jiān)控和數(shù)據(jù)采集（SCADA）應用，那會怎么樣？好吧，讓我們來一探究竟。

　　網(wǎng)絡瀏覽器和網(wǎng)絡技術(shù)已經(jīng)足夠成熟，可以用于工業(yè)領(lǐng)域，這些進步推動新方法來實現(xiàn)HMI和SCADA的應用。借助現(xiàn)代HMI和SCADA應用中功能強大的網(wǎng)絡技術(shù)和下一代可視化系統(tǒng)等工具，用戶可以構(gòu)建能夠自動響應特定工況的工業(yè)應用。通過授權(quán)用戶創(chuàng)建可以在任何移動設備和網(wǎng)絡瀏覽器上本地運行的美觀的、響應性移動工業(yè)應用，現(xiàn)代工具還可以動員工廠車間的力量。

　　使用現(xiàn)代的網(wǎng)絡瀏覽器，可以在任何位置訪問HMI和SCADA應用而無需插件。用戶可以在支持現(xiàn)代網(wǎng)絡瀏覽器的任何設備上訪問Google應用。HMI和SCADA應用也是如此。借助HTML5和CSS3以及適用于手機和平板電腦的原生應用，這是可以實現(xiàn)的。

集成了先進移動功能的現(xiàn)代網(wǎng)絡瀏覽器。本文圖片來源：Inductive Automation

　　HTML5是超文本標記語言的第五個版本，用于定義和組織網(wǎng)頁上的內(nèi)容。所有網(wǎng)頁都以一種或另一種方式實現(xiàn)HTML。CSS代表層疊樣式表，而CSS3是其最新版本。CSS徹底改變了如何定義網(wǎng)頁布局，其中大多數(shù)網(wǎng)頁都是基于HTML構(gòu)建的。CSS3具有一些高級樣式功能，可以使用媒體查詢來做出響應。這意味著針對不同的屏幕尺寸和分辨率，此類網(wǎng)頁均具有最優(yōu)的外觀。

　　新的工業(yè)移動可能性

　　這些成熟的技術(shù)為HMI和SCADA應用提供了許多可能性，包括：

　　● 網(wǎng)址友好；

　　● 自定義導航；

　　● 強大的網(wǎng)頁組件；

　　● 手勢和多點觸控；

　　● 移動響應設計；

　　● 不同風格；

　　● 聯(lián)合身份：單點登錄（SSO）和雙因素身份驗證（2FA）；

　　● 適用于蘋果iOS和谷歌安卓的原生應用。

　　工業(yè)網(wǎng)頁應用設計人員，需要控制用戶如何導航和使用應用。沒有兩個HMI和SCADA應用是相同的，因此無法進行任何預裝。某些應用只有一個屏幕。其它的可以從一個屏幕導航到另一個屏幕，并深入探究不同部分，或打開彈出窗口以獲取更多詳細信息。導航時，SCADA應用應易于使用URL并更新URL。

　　網(wǎng)頁應用通過URL工作。它們是用來訪問各種資源的地址。大多數(shù)情況下，它們用來訪問互聯(lián)網(wǎng)上的網(wǎng)站。用戶可以復制URL并將其發(fā)送給另一個用戶，而無需導航到該屏幕或資源。URL還使您易于理解用戶在應用中的位置。

　　強大的用戶界面組件可用于網(wǎng)絡，并且很容易構(gòu)建組件。人們經(jīng)常與這些組件交互，因此很容易將它們帶入HMI和SCADA領(lǐng)域。強大的圖表、菜單、輪播、嵌入式地圖等組件均支持觸摸和手勢，例如滑動和多點觸摸以進行縮放。它們還具有移動響應能力，旨在與臺式機和智能手機配合使用。

　　移動響應設計是HTML5和CSS3最重要功能之一。它允許用戶構(gòu)建一個可以自動更改以匹配屏幕尺寸的應用，無論是臺式機、筆記本電腦、平板電腦還是手機。所有現(xiàn)代網(wǎng)站均以移動響應設計為基礎(chǔ)，并根據(jù)設備以不同的形式呈現(xiàn)相同的數(shù)據(jù)。

　　用戶在臺式機上可以獲得更多細節(jié)的視圖，而在智能手機上獲得針對手機顯示進行了優(yōu)化的視圖。例如，如果用戶正在查看表格數(shù)據(jù)，那么他們將在臺式機上獲得一個具有多列的傳統(tǒng)表格，但是在移動設備上，每一行都會有一張卡片。在移動設備中該表不再縮小，從而失去了列的可見性。HMI和SCADA的每個部分都可以用這種方式構(gòu)建，這在考慮應用時需要一種新的方法。為移動設備構(gòu)建單獨的應用已經(jīng)成為歷史。

　　CSS為網(wǎng)頁提供樣式。用戶可以開發(fā)可重復使用樣式類（對象），但只需要在一處定義。樣式可以是背景顏色、前景色、字體、邊框和設計元素。這使用戶可以即時切換樣式或更新樣式的某些部分，而不必轉(zhuǎn)到每個屏幕。定義樣式是HMI和SCADA開發(fā)的重要組成部分，可確保在多個應用中保持一致的樣式。

　　CSS3還提供動畫。動畫樣式類會在一段時間內(nèi)通過兩個或多個樣式配置過渡。例如，使用動畫樣式類可能是一種強大的方式，可以顯示組件上數(shù)據(jù)隨時間的變化（例如警報狀態(tài)或機器狀態(tài)）。

移動感應式設計節(jié)省了開發(fā)時間，并且可以無縫適應不同的屏幕尺寸。

　　保護SCADA系統(tǒng)

　　安全性是任何HMI和SCADA應用中最重要的部分之一，尤其是在越來越多的用戶獲得訪問權(quán)限時更是如此。大多數(shù)公司已經(jīng)使用了多個云應用，例如電子郵件、文檔共享和客戶跟蹤。這些應用使用具有現(xiàn)有公司憑證的SSO，并允許在同一處訪問所有應用。這可以使用受信任的聯(lián)合識別技術(shù)，如安全斷言標記語言（SAML）和OpenID連接。這些技術(shù)可以與SCADA系統(tǒng)一起使用。無需共享帳戶，每個人都可以登錄以安全地訪問他們所需的數(shù)據(jù)。

　　這些系統(tǒng)可以通過雙因素驗證（2FA）來驗證身份，這需要憑據(jù)和附加步驟，例如將PIN發(fā)送到手機。出于安全考慮，許多公司不允許在智能手機上使用SCADA應用。但是，使用該技術(shù)可以使用戶有效而安全地從不同的應用中獲取數(shù)據(jù)。

　　智能手機也是令人難以置信的硬件技術(shù)。智能手機內(nèi)置了數(shù)量驚人的傳感器，例如GPS、攝像頭、加速度計、藍牙等?？梢酝瑫r將應用提供給網(wǎng)絡瀏覽器和智能手機。但是，使用智能手機可以在應用中訪問這些傳感器，從而可以釋放大量機會。

　　想象一下，當用戶在工廠周圍走動或通過輸入數(shù)據(jù)來標記他們的位置時，利用GPS可以自動切換到適當?shù)钠聊弧l形碼放置在重要區(qū)域，用戶可以掃描條形碼以獲得機器手冊、操作程序或其它信息。甚至能夠?qū)⒐に囘^程的圖片或視頻流，傳輸?shù)焦局С謭F隊以進行遠程故障排除?，F(xiàn)在，是在HMI和SCADA應用中利用現(xiàn)代網(wǎng)絡技術(shù)的時候了，而且從未如此簡單。（作者：TravisCox）