MENU Mobile menu button

Webtechnologien entwickeln sich rasant – so stellen Sie den Erfolg Ihrer Webanwendung trotzdem sicher

5 Merkmale einer guten Webanwendung

Lassen Sie sich bei Realisierung Ihrer Webapplikation von der rasanten technischen Entwicklung rund um JavaScript, HTML5 und CSS nicht täuschen. Wichtig ist, was dabei rauskommt.

Hier 5 Merkmale einer guten Webanwendung.

  1. Arbeiten Sie mit und nicht gegen den Webbrower – Back-Button, Multi-Tab Browsing und verlinkbare Inhalte sind ein Muss.
  2. Gute Benutzbarkeit – Halten Sie sich an etablierte UX-Konventionen des Web – schauen Sie sich Dinge von etablierten Webanwendungen wie GMail oder Trello ab.
  3. Schnelle Reaktionszeit – Ein überaus wichtiger Akzeptanz-Faktor bei Benutzern Ihrer Webanwendung ist wie schnell diese reagiert.
  4. Wartbarkeit – Die geeignete Frontend-Architektur im Vorfeld eines Webprojekts stellt sicher, dass sich neue Funktionalitäten auch noch in Jahren leicht und schnell umsetzen lassen.
  5. Richtige Technologieauswahl – Oberstes Ziel ist, Technologien auszuwählen, die auch in ein paar Jahren noch Bestand haben und somit Ihre Anwendung von einem teuren Austausch der Basistechnologie bewahren.

Um diese Merkmale zu Beginn eines Projekt mit dem Umsetzungsteam abklären zu können, ist es notwendig, gewisse technische Grundbegriffe und Aspekte aus der Welt der Webentwicklung zu verstehen. Im folgenden Abschnitt finden Sie Wissenswertes, das Ihnen bei der Realisierung Ihrer eigenen Webanwendung hilfreich sein könnte.

Weiter zu wissenswerten Begriffen der Webentwicklung

Wissenswertes zur Entwicklung von Webapplikationen

Was ist der Unterschied zwischen Webanwendungen und Webseiten?

Eine Webseite (Website) ist eine Sammlung von untereinander verlinkten Dokumenten (Pages), die unter einer Internetadresse (Domain) erreichbar ist. Eine typische Webseite ist der Onlineauftritt eines Unternehmens, ein Nachrichtenportal oder die Webseite einer Musikgruppe. Der typische Besucher einer Webseite ruft für gewöhnlich mehrere Seiten pro Besuch ab.

Eine Webanwendung – auch Webapplikation oder Browserapplikation genannt – hingegen ist ein meist Login-geschütztes Programm, das über einen Webbrowser geladen wird und das einen ganz gewissen Zweck erfüllt – zum Beispiel das Schreiben von Dokumenten (Google Docs), das Versenden von E-Mails (Google GMail) oder das Verwalten von Fotos (Flickr). Wichtig: Webanwendungen auf das gleiche technische Fundament wie Webseiten auf, unterscheiden sich jedoch stark im Zweck und Interaktionsmuster. D.h. eine Webapplikation ist aus rein technischer Sicht letztendlich auch nur eine oder mehrere HTML-Seiten (Pages).

Was ist eine Single Page Application (SPA)?

Eine Single Page Application, kurz SPA, ist eine Webanwendung, bei der der Benutzer die anfangs aufgerufene HTML-Seite (Page, siehe Unterschied Webanwendungen und Webseiten) nicht verlässt. Der Vorteil liegt darin, dass Benutzerinteraktionen (z.B. Wechsel von "E-Mails lesen" zu "E-Mail verfassen" oder Eingabe eines neuen Datensatzes über ein Formular) nicht das neuerliche Laden der HTML-Seite erfordern, die Interaktion somit schneller und "weicher" von statten geht und damit die Benutzerfreundlichkeit erhöht wird.

Ein weiteres wichtiges Merkmal ist, dass in einer reinen SPA der entsprechende HTML-Code erst im Webbrowser des Benutzers mittels der im Browser integrierten Programmiersprache JavaScript generiert wird – ganz im Unterschied zu Webseiten und "normalen" Webanwendungen, wo der HTML-Code vom Webserver schon fertig vorbereitet an den Browser geschickt wird.

Wann macht eine SPA Sinn?

Ein Single Page Applikation macht vor allem dann Sinn, wenn eine Webanwendung viel Benutzerinteraktion (Dateneingaben etc.) erfordert. Die Entwicklung in SPA-Bauart ist aber recht aufwendig und damit auch teurer als andere Architekturstile. Erfordert eine Webanwendung größtenteils nur lesenden Zugriff und wenig Benutzerinteraktion (z.B. Monitoring-Applikationen), ist meist eine etablierte, server-lastige Architektur sinnvoller, weil kosteneffizienter.

Welches JavaScript-Framework sollen wir verwenden?

Eine Frage, die auch aufgrund der ständig neuen Entwicklungen in diesem Bereich nicht leicht und pauschal beantwortet werden kann. Wie es der Misserfolg von früheren server-seitigen Frameworks (z.B. ASP.NET, Java Server Faces) beweißt, ist ein Framework, das versucht, die zugrundeliegenden Webtechnolgien (HTML, CSS) hinter Abstraktionen zu verstecken, mit kritischen Augen zu betrachten. Eine weiterer Aspekt, den es zu betrachten gilt, ist, welche Ziele die Macher des Frameworks verfolgen. Denn steht eine kommerzielle Firma hinter einem Open Source Projekt, läuft man immer auch Gefahr, dass erstens, ein bewusst geschürter Marketing-Hype über Schwächen hinwegtäuscht und zweitens, firmenpolitische Entscheidungen die Richtung aller anderen Anwender negativ beeinflusst.

Welches server-seitige Framework sollen wir verwenden?

Auch hier gilt wie bei JavaScript-Frameworks die Faustregel, dass Frameworks, die das Web nicht zu verstecken versuchen, zu bevorzugen sind. Die Geschwindigkeit neuer Entwicklungen in diesem Bereich hat in den letzten Jahren an Fahrt verloren und es haben sich solide Frameworks wie Spring MVC, ASP.NET MVC, Ruby on Rails und Django herauskristallisiert.

Auch das Framework node.js hat einen großen Hype unter Entwicklern erfahren, kann aber laut Berichten wie diesen, nicht immer die gesteckten Erwartungen erfüllen – wohl auch wegen dem speziellen Programmiermodell, das eher für besondere Anwendungsfälle geeignet ist.

Referenzprojekte Webentwicklung

teamvergleich.de

Sportdatenvisualisierung Statistik Deutsche Bundesliga teamvergleich.de, Vorschau Screenshot

Interaktive Visualisierung von Teamstatistiken im Fußball.

OEE KPI Dashboard

OEE KPI Dashboard zum Monitoring der Effizienz von Maschinen, Vorschau Screenshot

Monitoring der Anlageneffektivität mit der OEE-Kennzahl.

Leistungen im Bereich Webanwendungen

Entwicklung von Webanwendungen

  • Anwendungsarchitektur
  • Technolgieauswahl
  • Datenbank
  • Server-Programmierung
  • Frontend-Programmierung
  • Java, JavaScript, .NET, PHP

Entwicklung von Single Page Applications

  • JavaScript Framework Auswahl
  • Frontend Rendering-Architektur
  • CSS Framework / Template Auswahl
  • CSS Layout und Style
  • Integrität mit Standard-Browserfunktionalität (Back Button, verlinkbare Inhalte etc.)

Migration von Desktop-Anwendungen ins Web

  • Konzeption der initiale Anwendungsarchitektur, um kostspielige Folgefehler zu vermeiden
  • Hilfe bei Technologieauswahl unter Berücksichtigung bereits eingesetzter Technologien
  • Implementierung Applikationsgerüst auf Basis von Architektur und Technolgieauswahl
  • Forcierung von Code Reuse mit der vorhandenen Desktop-Applikation

Coaching des vorhandenen Entwicklerteams in Webtechnolgien

  • Einführung in wartbares CSS
  • Responsive Design Techniken
  • Layouting und Templating
  • Architektur von client-seitigen Frontends (Single Page Applications)
  • JavaScript
  • HTTP Request Response Modell
  • d3.js und SVG

Technische Support-Stelle für Entwicklerfragen im Bereich Webanwendungsentwicklung

  • On-demand Support für Enwickler via remote
  • Hilfe bei CSS Layout und Style Problemen
  • Unterstützung bei JavaScript Bugs
  • Beratung in Design-Entscheidungen
  • Hilfe bei Usability Fragen

Wartung von bestehenden Webapplikationen

  • Entwicklung von dringend notwendigen Zusatzfunktionalitäten
  • Aufbau einer fehlender Entwicklerdokumentation um Ausfallsrisiko zu mindern
  • Einführung eines Versionsverwaltungssystems wie git
  • Fehlerbeseitigung - Projektrettung
  • Schnellere Umsetzung von neuen Anforderungen durch Code-Restrukturierung und Qualitätsverbesserungen
  • Einführung eines strukturierten Versionsierungssystems
  • Technologische Modernisierung

Gerade dabei, eine neue Webanwendung zu planen oder mit dem Fortschritt Ihrer bestehenden Webapplikation nicht zufrieden?

Erzählen Sie uns davon!