Autor: Karsten Otto

Responsive Retrofitting am Beispiel einer Webanwendung

| Karsten Otto

oder Warum Standard-Frameworks nicht für Web-Anwendungen geeignet sind

Responsive Design ist heute in aller Munde, wenn es um die Entwicklung von Webseiten geht. Mobile Geräte wie Smartphones und Tablets erfreuen sich immer größerer Beliebtheit, darum soll natürlich jede neue Webseite auf diesen Plattformen auch genauso gut benutzbar sein wie auf dem klassischen PC-Desktop. Entsprechend gibt es eine Vielzahl an Libraries, Tools und Frameworks, die responsive und fluide Techniken unterstützen und versprechen, dass sich damit responsive Webseiten geradezu kinderleicht entwickeln lassen. Doch was geschieht, wenn es sich einmal nicht um eine Webseite handelt, sondern um eine Webanwendung?

Weiterlesen →

Interaktive SVG mit AngularJS – Teil 2

| Karsten Otto

Bei der Entwicklung von mobilen Web-Anwendungen mit Responsive Design bieten SVG eine praktikable Lösung zur Realisierung flexibler Bilder (flexible images).
AngularJS ermöglicht seinerseits, komplexe UI-Logik in individuellen HTML-Direktiven zu kapseln, was eine saubere und wartbare Modularisierung ermöglicht.
Die Kombination dieser Technologien stellt eine gute Basis für interaktive Steuerungs- und Status-Elemente dar. Sie ist sowohl dazu geeignet, hochgradig komplexe Spezial-Bedienelemente zu erstellen, als auch einfachere Anwendungsfälle in generischer Weise zu behandeln.

Teil 1 dieses Artikels untersucht verschiedene Methoden, SVG als flexible Bilder in browser-übergreifender Weise zu verwenden.

Teil 2 beschreibt die Verwendung von AngularJS zur Steuerung von SVG-Bildern, um individuelle Kontroll- und Status-Elemente zu realisieren.
Weiterlesen →

Interaktive SVG mit AngularJS – Teil 1

| Karsten Otto

Bei der Entwicklung von mobilen Web-Anwendungen mit Responsive Design stellen flexible Bilder (flexible images) ein besonderes Problem dar.
SVG bieten eine gangbare Lösung: Sie sind deutlich kompakter als Bitmaps vergleichbarer Größe, und können über ihre DOM-API gesteuert werden.
AngularJS ist wiederum gut dafür geeignet, die Logik komplexer UI-Elemente in individuellen HTML-Direktiven zu kapseln.
Die Kombination der beiden erscheint attraktiv, allerdings gilt es dabei diverse Stolpersteine zu vermeiden.

Teil 1 dieses Artikels untersucht verschiedene Methoden, SVG als flexible Bilder in browser-übergreifender Weise zu verwenden.

Teil 2 beschreibt die Verwendung von AngularJS zur Steuerung von SVG-Bildern, um individuelle Kontroll- und Status-Elemente zu realisieren.

Weiterlesen →