Phoenix Contact Web-Panel-Familie WP 4000: Web-Panels für plattformübergreifende Visualisierung

Bildquelle: Antonio Guillem@Shutterstock

Wäre es nicht schön, wenn es eine einheitliche Sprache gäbe, mit der man sich überall auf der Welt mit anderen Menschen verständigen kann? Im Bereich der Automatisierung bietet HTML (Hypertext Markup Language) eine solche Sprache, durch die Steuerungen und HMIs miteinander kommunizieren können. Bei HTML handelt es sich um eine maschinenlesbare Sprache zur Strukturierung und Gliederung von Texten. Die kooperierenden Organisationen World Wide Web Consortium (W3C) und Web Hypertext Application Technology Working Group (WHATWG) legen dabei fest, welche Vokabeln und Grammatik in den Codes verwendet werden müssen. HTML ist somit die Kernsprache des World Wide Web und wird zur Erstellung von Webseiten genutzt. Die Strukturierung einer solchen Seite erfolgt durch Tags. Sie definiert, wo beim Aufrufen über den Browser Inhalte eingefügt werden sollen.

HTML5 hat sich als neuer, offener Web-Standard etabliert.

Kombination von drei Techniken

Die fünfte und aktuelle Version HTML5 ermöglicht die plattformübergreifende Darstellung von Texten, Bildern, Videos und weiteren Elementen in einem Webdokument. Das bedeutet, dass auf jedem Rechnersystem, auf dem ein passend ausgerüsteter Webbrowser – beispielsweise Google Chrome, Mozilla Firefox, Microsoft Edge oder Apple Safari – ausgeführt werden kann, die Anwendung ebenfalls entsprechend angezeigt wird. Auf diese Weise ist der Nutzer im Idealfall unabhängig vom eingesetzten Betriebssystem, wie Windows, Linux, Android oder Mac. Soweit die Theorie. In der Praxis funktioniert Edge jedoch nur mit Betriebssystemen von Microsoft und Safari mit Betriebssystemen von Apple. Die großen Open-Source-Browser Firefox und Chromium sind hier im Vorteil, da sie auf alle wichtigen Betriebssysteme portiert wurden.

Wenn allgemein von HTML5 die Rede ist, wird darunter oftmals auch das Zusammenspiel von HTML mit CSS (Cascading Style Sheets) und JS (JavaScript) verstanden. Während HTML für die Seitenstruktur und den Inhalt einer Webseite verantwortlich ist, gibt CSS das Layout und Design vor. Durch JS lässt sich ein Dokument wiederum interaktiv und dynamisch gestalten. In der Webentwicklung sind diese drei Techniken also unweigerlich miteinander verknüpft und nicht mehr wegzudenken. Das gilt ebenso für die moderne Applikationsentwicklung.

In größeren Anlagen bietet sich das Bedienen und Beobachten über einen Tablet-PC an.

Anpassung an die jeweilige Bildschirmgröße

Im Zuge von Industrie 4.0 und der daraus resultierenden Digitalisierung stellt die webbasierte und plattformübergreifende Visualisierung zahlreiche Vorteile zur Verfügung. Die Nutzung des globalen Standards HTML5 bietet dem Anwender Offenheit und Flexibilität, weil er eine universelle Kommunikation mit jedem HTML5-fähigen Webbrowser erlaubt. Wird zusätzlich CSS verwendet, erhält der Anwender auf einfache Weise ein adaptives System, das sich automatisch an das jeweils eingesetzte Endgerät und dessen Bildschirmgröße anpasst. Der Trend am Markt geht daher zunehmend in Richtung Webdarstellung auf HTML5-Basis. Immer mehr Anwender setzen die Technologien ein, damit sie nicht mehr an proprietäre Systeme einzelner Hersteller gebunden sind. Deshalb baut eine stetig steigende Zahl von Softwareanbietern und Steuerungsherstellern bei ihrer Visualisierung auf Webtechnologien und Cloudanwendungen.

In der Automatisierung wird in sämtlichen Bereichen ein hohes Maß an Bedienbarkeit, Zuverlässigkeit und Sicherheit gefordert. Das schließt neben der Hard- und Software ebenfalls die Kommunikationsschnittstellen ein. Bei Nutzung von HTML5 erfolgt der Zugriff plattformunabhängig und ist über nahezu jedes Endgerät wie PC, Tablet oder Smartphone im jeweiligen Browser möglich. So wird unter anderem die Fernwartung vereinfacht, da sie losgelöst von einer Vor-Ort-Bedienung über eine entsprechende Zugriffsberechtigung geschehen kann. Auf diese Weise lassen sich Stillstandzeiten erheblich reduzieren.

Auch aus der Sicherheitsperspektive eröffnet HTML5 Vorteile. In der Webentwicklung hat sich zunächst der Adobe Flash Player etabliert. Analog zu HTML5 dient er dazu, eine Webseite nicht nur statisch anzuzeigen, sondern Animationen und Interaktionen einzubauen. Weil in aktiven Hacking-Kampagnen jedoch immer wieder Sicherheitslücken im Flash Player verwendet werden, gilt Flash mittlerweile als chronisch unsichere und veraltete Software. Adobe stellt den Player daher 2020 ein. Aufgrund der direkten Interpretation durch den Browser benötigt HTML5 keine Plug-ins und bietet deswegen einen deutlich besseren Schutz vor Hackerangriffen. Zudem sind keine manuellen Updates erforderlich.

Das Software-Tool PLCnext Engineer eignet sich für alle Aufgaben der Automatisierung.

Inkompatibilitäten zwischen den verschiedenen Browsern

Aus Visualisierungssicht erweist sich HTML5 allerdings nicht als Universallösung oder Allheilmittel. HTML5 ist eine junge Technologie, die nicht zwangsläufig in jedem Browser gleich dargestellt wird. Es handelt sich um einen offenen Standard. Das heißt praktisch, dass Standardisierungsgremien zwar entscheiden, die konkrete Umsetzung aber bei den Browserherstellern liegt, welche die Spezifikationen implementieren müssen. Im entsprechenden Gremium von W3C arbeiten alle großen Browserhersteller mit. Da die beteiligten Unternehmen jedoch um Marktanteile konkurrieren, zeigt sich die Weiterentwicklung der Standards als spannungsreicher Prozess zwischen individuellen Alleingängen und Konsens im Gremium. Dies liegt teilweise darin begründet, dass die Standardisierung ein langwieriger Prozess ist und den aktuellen Erfordernissen häufig hinterherhinkt. Um im Markt einen Wettbewerbsvorteil zu haben, wird dann doch ein Feature eingeführt, das nicht sämtliche Browser unterstützt.

Der Nachteil einer mangelnden Portabilität macht sich dadurch bemerkbar, dass HTML5-Anwendungen nicht überall gleich aussehen (müssen). Es treten immer wieder Inkompatibilitäten zwischen den verschiedenen auf unterschiedlichen Plattformen genutzten Browsern auf. Soll eine Anwendung dennoch stets gleich angezeigt werden, erhöht das den Entwicklungsaufwand. Gerade bei Web-Panels sehen sich die Softwareentwickler oftmals mit Herausforderungen konfrontiert. Klassische Automatisierungsanwendungen benötigen bei der Visualisierung Funktionen wie Trendkurven oder Alarmlisten. HTML5 könnte das ohne die Layout-Funktionen JS und CSS so nicht darstellen. Hinzu kommen Anpassungen an den Browser und gegebenenfalls an das Betriebssystem. Damit ein Web-HMI funktioniert, müssen im Hintergrund folglich mehrere Technologieräder ineinandergreifen. Im Rahmen der Webtechnologie entwickelt sich jedes dieser Rädchen sehr schnell weiter. In der eher auf Langlebigkeit ausgerichteten Automatisierung führt das zwangsläufig zu den bereits bekannten Problemen. Die steigende Komplexität der Anwendungen erfordert immer mehr Performance, während der Support für ältere Versionen früher eingestellt wird. Durch den sich beschleunigenden technologischen Wandel und Sicherheitsaspekte forciert sich dieser Prozess weiter.

Einsatz im Ecosystem oder als Komponente

Phoenix Contact stellt sich den Herausforderungen der digitalen Transformation und gestaltet diese aktiv mit. Mit der neuen Web-Panel-Familie WP 4000 zur Realisierung anspruchsvoller Applikationen und den Basic Web-Panels BWP 2000 für Basisanwendungen und preissensible Märkte bietet das Unternehmen leistungsstarke HMIs an. Beide Produktserien sind mit einem HTML5-kompatiblen Browser ausgestattet und zeigen somit alle webbasierten Visualisierungen an, die den aktuellen HTML-Standard unterstützen. Die WP 4000- und BWP 2000-Geräte können also mit den meisten modernen SPSen und IPC-basierten Steuerungen kommunizieren. Sie werden lediglich via Ethernet mit der jeweiligen Steuerung verbunden, auf der ein integrierter Webserver läuft. Dieser hostet die Seiten mit der Applikation, die auf dem Panel dargestellt werden.

Im systemischen Einsatz spielen die Web-Panels optimal mit dem Ecosystem PLCnext Technology von Phoenix Contact zusammen. Sie können allerdings ebenfalls als Komponente mit Fremdsoftware und -steuerung genutzt werden. Gleiches gilt für Anwender, die kein Engineering-Tool verwenden, sondern die Benutzeroberfläche selbst mit HTML5, JavaScript und Cascading Style Sheets erstellen.