Trefft Sevenval auf der DMEXCO

Alle reden von der digitalen Transformation – wir bieten Euch die Überholspur.

Wie Ihr Eure Kundenschnittstelle – das Frontend – schnell modernisiert und zu Ergebnissen kommt, ist dieses Jahr unser Schwerpunktthema.

Wenn Ihr uns treffen wollt, schreibt bitte an dmexco@sevenval.com
und macht einen Terminvorschlag.
Je nach Branche meldet sich der richtige Experte bei Euch.

Wir sehen uns dann in Halle 6 am Stand F025 und laden Euch gerne zu einem
Frozen Yoghurt ein;-)

Schon mal viel Spaß und auf bald!

Meet us at DMEXCO to accelerate the digital transformation for your company.

 

Wie der One Web-Ansatz den Webseiten-Betrieb erleichtert

“There is no mobile web. There are plenty of mobile devices. And equally there is no desktop web. It is just the web. So that’s why I always bang this drum: one web.”

Jeremy Keith, BD Conference 2011

 

Beim Surfen im Netz werden viele verschiedene Geräte mit unterschiedlichen Browsern und Betriebssystemen genutzt – die technische Fragmentierung nimmt stetig zu. Dies stellt eine wachsende Herausforderung für Webseiten-Betreiber dar. Wir empfehlen daher langfristig einen One Web-Ansatz umzusetzen, der Silos wie spezifische Seiten für Smartphones und Tablets (M-Dot Sites und T.Dot Sites) auflöst.

Dies erleichtert nicht nur die Auslieferung von Webseiten bei zunehmender mobiler Internetnutzung, sondern erleichtert außerdem den gesamten Betrieb der IT. Vom Marketing Manager bis hin zum Backend Developer – alle Mitwirkenden eines Webseiten-Projektes können ihre Arbeit so effektiver erledigen und die Webseite ist zukunftssicher aufgestellt.

Sevenval_Infographic_OneWeb2015

Your Tools, your Rules – Sevenval auf der Developer Week 2015

Your Tools, Your Rules!

Zufrieden mit euren Tools? Oder mal was Neues ausprobieren? So oder so –
mit Sevenval FIT könnt ihr nutzen, was ihr wollt. Unsere Software vereinfacht das Erstellen und Optimieren von Webseiten und ist mit allen gängigen Entwickler-Tools kompatibel.

Unser Stand auf der Developer Week

Kommt vorbei und tauscht euch mit unseren Entwicklern und unserem CTO, Roland Guelle, über aktuelle Projekte, Technologien und Methoden rund um das Front-End aus. Auch wie ihr HTTP/2 für eure Webprojekte nutzen könnt, erläutern unsere Kollegen am Stand gerne.
Ihr findet uns auf der Developer Week auf Ebene 3. Unsere Standnummer lautet 37.

Unser Vortrag

Außerdem hält Roland Guelle am Dienstag, den 16. Juni, von 10.30 bis 11.30 den Vortrag „Fragmentation of Infrastructure“. Er erklärt, wie ihr bei der zunehmenden Vielfalt von Systemen im Front- und Back-End Herr im eigenen Hause bleibt.

Warum klassisches Responsive Web Design (RWD) nicht das Maß aller Dinge ist!

Nach dem wir zuletzt die Methoden RWD und RESS kurz verglichen haben, vertiefen wir hier die Betrachtung vom klassischen Responsive Web Design. Mit dem Aufkommen einer neuen Generation von Endgeräten mit unterschiedlichsten Spezifikationen und Bildschirmgrößen hat sich Responsive Web Design als Standard bei der Umsetzung eines Webauftritts etabliert. Dennoch ist dieser Ansatz kein Allheilmittel und es gibt Anforderungen und Herausforderungen, welche mit Hilfe von klassischem Responsive Design nicht optimal gelöst werden können. Nachfolgend werden die jeweiligen Vor- und Nachteile des Ansatzes dargestellt und bewertet.

Vorteile RWD

Das RWD-Konzept bietet viele Vorteile gegenüber Einzelentwicklungen, oder „Sonderkanälen“ für dedizierte Endgeräte. Dies sind unter anderem die folgenden Punkte:

  • Es muss nur eine generische Content-Basis für alle Endgeräte erstellt werden
  • Kein Spezialkanal notwendig (t.example.com, m.example.com,…)
  • Einheitliche Inhalte und Prozesse für alle Endgeräte (z.B. synchroner Warenkorb)
  • Gebündelte Suchmaschinen-Optimierung (für eine URL)
  • Querverlinkungen sind möglich (Newsletter von PC, Tablet, Smartphone…)
  • Einmalige Entwicklung für alle Endgeräte
  • Eine zentrale Präsentationsschicht
  • Sparsame Anforderungen an die Serverlandschaft

Nachteile RWD

Bereits 2011 hat Luke Wroblewski die Nachteile von RWD dargestellt und gilt als „Mitbegründer“ des RESS Ansatzes (Responsive Web Design mit server-seitigen Komponenten). Die Nachteile stellen sich wie folgt dar:

Generell:

  • Es wird eine allgemeingültige Basis für alle Endgeräte vorgesehen – die Qualität der Anpassung ist nicht optimal.
  • Die Darstellung übernimmt das Endgerät, bzw. der Browser. Mittels unterschiedlicher Techniken muss dieser Client entscheiden, welche Inhalte wie angezeigt werden können.
  • Die Adaption kann und muss allein auf dem Client erfolgen.
  • Die Prozesse sind auf allen Endgeräten gleich – und werden ohne Anpassung aus dem Backend übernommen
  • Es werden immer alle Daten übertragen, unabhängig davon ob sie dargestellt werden können oder nicht.

Sichtweise Business:

  • Durch die einheitliche Content-Auslieferung für alle Endgeräte, werden mehr Daten übertragen als für das jeweilige Endgerät nötig sind. Aufgrund der längeren Übertragungszeiten und intensiveren Rechenleistungen verzögert sich die Darstellung auf dem Endgerät.
  • Funktionen werden auf allen Endgeräten gleich abgebildet (keine optimierte Version für das Endgerät des Anwenders, z. B. Touch Eingaben wie Slider o. ä.).
  • Wegen der schlechteren Performance sinkt erfahrungsgemäß die Akzeptanz beim Kunden – die Folge sind Abbrüche, oder eine rückläufige Entwicklung der Conversion Rate (potenzieller Umsatzverlust!)
  • Hohe Investitionen, wenn RWD unternehmensweit eingeführt werden soll. Prozesse müssen neu definiert und aufgesetzt werden. Die Konzeption über sämtliche Ausgabekanäle hinweg ist aufwändig, insbesondere die Harmonisierung der Backendlandschaft (CRM, CMS, ERP, etc.) stellt eine große Herausforderung dar.
  • Durch die steigende Anzahl von neuen Endgeräten, Browsern und Betriebssystemanbietern gestaltet sich die Pflege der RWD Lösung aufwändiger (erhöhte Maintenance).
  • Dadurch, dass immer die komplette Webseite an die anfragenden Endgeräte ausgeliefert wird, muss sichergestellt werden dass keine unerwünschten Nebeneffekte bei neuen Endgeräten auftreten.
  • Die Analyse, wo die Inkonsistenz auftritt und wie der Fehler behoben werden kann führt zu erhöhtem Entwicklungs- und Testaufwand.
  • Die Wartbarkeit der Webseite wird sukzessive erschwert, da der Code durch neue Adaptionsregeln immer komplexer wird.

Fazit

Nach Lesen des Artikels macht es den Anschein, dass das klassische Responsive Web Design ein Auslaufmodell sei, was jedoch so nicht stimmt. Vor allem für Blogs, kurzfristige Kampagnenseiten oder den Webauftritt für KMUs  ist dieses Konzept nach wie vor passend und zeitgemäß.

Größeren Konzernen sowie Unternehmen, welche über den Webauftritt Transaktionen abwickeln, könnte eine solche Umsetzung jedoch Schwierigkeiten bereiten.  Mangelhafte Anpassungen und schlechte Performance einer Webseite werden von E-Commerce-Kunden umgehend bestraft: Laut Kissmetrics verlassen 40 % aller Nutzer eine Webseite, die länger als drei Sekunden lädt. Jede Sekunde Verzögerung verringert die Conversion Rate eines Webshops um sieben Prozent. Infolgedessen führt dies natürlich auch zu einem Imageverlust des Unternehmens.

Des Weiteren sollte man vor der Umsetzung eines Webprojekts die Gesamtkosten betrachten und sich nicht von Initialkosten blenden lassen. Es stellt sich die Frage, welche Betriebskosten anfallen. Welche Kosten entstehen, wenn die Webseite an ein neues Smartphone oder ein Browser-Update angepasst werden muss? Welche Bugs und Anpassungen können inhouse gelöst werden und was muss manuell gemacht werden?

Wer für alle Geräte eine optimale Darstellung ohne Bugs anstrebt, braucht eine RESS-Lösung, um die Betriebskosten für diese Ansprüche niedrig zu halten.

Den Browser entlasten: Responsive Web Design mit serverseitigen Komponenten (RESS)

Responsive Web Design (RWD) – endlich in den Unternehmen angekommen und als Begriff etabliert ist die Technologie auch schon wieder überholt. RESS ist das neue Schlagwort mit dem man sich auseinandersetzen muss, will man seine Webseite nutzerfreundlich über alle verschiedenen Kanäle ausspielen. RESS, genauer gesagt Responsive Web design with server side components – was ist das? Was sind die Vorteile sowie die etwaigen Nachteile? Diese Fragen wollen wir in einer kleinen Serie von Blogeinträgen beantworten, indem der vergleichsweise junge Ansatz RESS mit dem klassischen RWD verglichen wird.

Im ersten Schritt möchten wir die beiden Konzepte definieren und die jeweilige Architektur dahinter vorstellen:

Definition Responsive Web Design (RWD)

Responsive Web Design bezeichnet ein Konzept, bzw. Vorgehensmodell, das die Ansätze wie liquid Design, Adaptive Images und Media Queries kombiniert, um abhängig vom Endgerät bzw. Browser die Darstellung der Webseite anzupassen.

Ziel ist es, eine Web-Ausgabe für alle Endgeräte zu realisieren. Die Web-Ausgabe wird dabei möglichst generisch gehalten – das heißt, dass es keine unterschiedlichen Prozesse auf den Endgeräten gibt und diese immer den vollen Inhaltsumfang erhalten. Der Browser des Endgeräts ermittelt und entscheidet „eigenständig“ welche Inhalte dargestellt werden. Diese werden via HTML5, Media Queries, JavaScript und CSS3 auf dem Client verarbeitet.

Architekturüberblick:

Bei der klassischen RWD Architektur wird aus den Backendsystemen ein einheitliches Frontend erzeugt, welches als Datenpaket einheitlich an die Endgeräte ausgeliefert wird. Es wird vollständig übertragen und auf dem Endgerät „ausgepackt“ und verarbeitet. Bei einer generischen Ausgabe werden die Prozesse aus dem Backend übernommen und endgeräteübergreifend dargestellt. Eine Adaption kann nur auf dem Endgerät erfolgen und setzt somit eine umfangreiche Applikationslogik im Frontend voraus. Hieraus ergeben sich Abhängigkeiten, die sich auf die Performance und Stabilität negativ auswirken.

Definition Responsive Web Design + server side components (RESS)

Bei RESS handelt es sich um eine Weiterentwicklung des klassischen RWD-Konzeptes hin zu einer RWD-Lösung mit serverseitigen Komponenten. Hier werden bestimmte Prozesse vom Server übernommen und damit der Browser entlastet, dazu gehören eine Clienterkennung, Aufbereitung und Modifikation von Bildern und die Anpassung der Inhalte. Durch diese serverseitigen Komponenten wird eine Client-Server-Kommunikation abgebildet, welche die spezifischen Eigenschaften des Endgeräts mit Hilfe einer Device Database ermittelt und mit dem Server austauscht. Somit ist der Server in der Lage die angefragten Inhalte endgerätespezifisch auszuliefern. Frontend- und Backendprozesse können sauber gekapselt werden – wodurch eine kontextabhängige Auslieferung an das Endgerät ermöglicht wird.

Bei der RESS Architektur wird in der Regel ein Progressive Enhancement Ansatz gewählt, um eine Basisversion für alle Endgeräte zu definieren. Aufbauend auf dieser Version wird mittels der Device und Feature Detection der Delivery Context ermittelt. Der Delivery Context setzt sich aus den folgenden Parametern zusammen: Hardwarehersteller, Betriebssystem und Browser inkl. der entsprechenden Version. Ausgehend vom jeweiligen Delivery Context kann der Server alle Features für das Endgerät unterstützen.

RESS_Chart_IllustrationB

Architekturüberblick:

Bei der RESS Architektur wird mittels der Device Database der Delivery Context aufgebaut, um Inhalte möglichst optimal für das jeweilige Endgerät aufzubereiten und auszuliefern. Durch die exakte Kenntnis der Eigenschaften des jeweiligen Clients werden nur die Elemente ausgeliefert, die vom Gerät dargestellt werden können. Dazu gehören zum Beispiel Bilder, die bereits auf dem Server passend skaliert wurden.

Damit wird nicht nur die Anzahl der übertragenen Daten deutlich reduziert sondern auch die Performance signifikant erhöht. Zudem müssen auf dem Gerät keine aufwendigen Prozesse gestartet werden – die rechenintensiven Operationen erfolgen ausschließlich auf dem Server. Dies führt zu einer schnelleren Übertragung, weniger Rechenleistung auf dem Endgerät und somit auch zu einem niedrigeren Stromverbrauch.

Material Design unter der Lupe

material designCredit: Google
http://www.google.com/design/spec/material-design/introduction.html#introduction-goals

Ende Juni 2014 hatte Google im Zuge des Updates auf Android 5 Lollipop Material Design vorgestellt. Damit hat Google zum ersten Mal eine umfassende Designrichtlinie heraus gegeben und für viel Echo gesorgt.
Material Design basiert eindeutig auf bestehenden Trends wie Flat Design und Content First, geht aber noch einige Schritte weiter.
Mein erster Eindruck von den Richtlinien war sehr gut. Und tatsächlich hatte ich auch als bekennender Apple-Fan zum ersten Mal das Gefühl, dass ein Designansatz von Android dem von Apple überlegen sein könnte.

Deshalb wollte ich mir im Folgenden die vier, meiner Meinung nach, wichtigsten Aspekte von Material Design einmal genauer ansehen. Dabei möchte ich herausfinden was sie besonders macht, und wie sinnvoll sie im praktischen Einsatz sind. Continue reading

Sevenval FIT 14.0.3 out now – here is our Changelog

Our new release Sevenval FIT 14.0.3 brings RESS to SLES! We are happy to announce that Suse Linux Enterprise 12 is now among the supported operating systems. Check the installation instructions for more details.

Frontend developers now have access to our image scaling features from JavaScript through the URL API. ac-stage provides more API functions and better interoperability with ac-scroll.

The core components have received some love, too: Our HTML parser supports more HTML5 elements, the JavaScript minifier is more robust and respects license comments, more WebP images for everyone, faster page loading thanks to less inline code. Last but not least, we hunted down a lot of bugs and updated third party libs.

As always, please read the full changelog and pay attention to the Changed and Removed keywords.

If you do not use our latest software yet, don’t hesitate to contact our staff at
developer.sevenval.com to learn why FIT 14 is good for you.

Software-Update: Sevenval FIT mit neuen Performance Features

Unser aktueller Release Sevenval FIT 14.0.2 enthält eine große Anzahl von Features, Verbesserungen und Fixes, die ihr im Changelog nachlesen könnt.
Besonders zu erwähnen sind die Verbesserungen an der AC Stage: Neben dem neuen fallback effect swap bei nicht vorhandenem slide, unterstützt die Stage nun autosize und funktioniert im OSS Browser.
Des Weiteren haben wir ein neues Performance Feature: Automatisches JavaScript und CSS Inlining, welches sich ganz einfach über die config.xml einschalten lässt. Darüber hinaus haben wir den Delivery Context um request properties wie frontend-url, host und port sowie pointer events und einen allgemeinen CSS prefix erweitert.

 

Your Tools, Your Rules! Heute Start von Sevenval FIT14

developer Logo

  • Sevenval FIT14 ermöglicht Responsive Webdesign mit Performance-Optimierung
  • Effiziente Erstellung und Betrieb von Multi-Device-Webseiten
  • Alle Freiheiten: Kompatibel mit jedem Editor, CMS, Framework und Shop-System

Köln / Berlin, 02. September 2014 – Die Sevenval Technologies GmbH stellt heute das wichtigste Release ihrer Firmengeschichte vor: Mit Sevenval FIT14 kommt ein Software-Produkt auf den Markt, das alle Komponenten für die Erstellung und den Betrieb von Multi-Device Webseiten in einem Paket bündelt. Die Wandlung des Unternehmens vom reinen Mobile-Optimierer hin zum Frontend-Entwickler ist damit abgeschlossen. Continue reading

Your Tools, Your Rules – Sevenval Announces FIT14

A Revolutionary Software for Responsive Web Design Projects

  • Sevenval FIT14 accelerates and improves responsive multi-channel websites while reducing required maintenance
  • The software optimizes quality and performance of websites using any browser on any device

Berlin, Germany, August 19, 2014 – In order to have a leg up on the competition, website operators have to deliver their customers an error-free quality online experience across all devices. Responsive Web Design is no longer enough due to device and browser fragmentation, as well as the ever-changing standards in web. Sevenval’s solution enables automatic browser and device detection. FIT 14 ensures websites perform strong, for all users, in any situation. Sevenval’s clients are both well-prepared for future trends and benefit from the reduced demand on maintenance. Continue reading