Titelbild Screenguide 31: Start einer Rakete

Screenguide #31: Google AMP

Mit seinen „Accelerated Mobile Pages“ (AMP) möchte Google Webseiten spürbar schneller machen. Markus Werner beschreibt im Titelthema ausführlich, welche Vorteile AMP zu bieten hat, wie es sich von dem bekannten HTML unterscheidet, was möglich ist und was nicht.

Auch andere Tools wollen Webworkern die Arbeit erleichtern. In dieser Ausgabe zeigen Ihnen unsere Autoren etwa, was das Shopsystem Magento 2 sowie Adobes neues Experience Design zu bieten haben, wie ally.js Ihre Webprojekte barrierefreier macht oder wie Sie Atomic Design und Pattern Lab einsetzen. Außerdem dabei: Social-Listening-Tools, Open Data, Bildlizenzen, Layout-Testing, NativeScript, Node und Docker.

  •  

    Editorial

    von Nicolai Schwarz

    Google hat seine „Accelerated Mobile Pages“ (AMP) mittlerweile für alle geöffnet. Damit sollen Webseiten spürbar schneller geladen werden. Wer teilnehmen möchte, stellt seine Inhalte zusätzlich im neuen, proprietären Format AMP HTML ins Netz. Dem Diktat der Geschwindigkeit müssen sich eben alle unterordnen, notfalls auch Webstandards.

  • Illustration: Das Wort »Social« vor einem unscharfen Hintergrund 

    Social Listening

    von Stefan Evertz

    Millionen Menschen tauschen sich in Social Media aus – über Persönliches, aber auch über Produkte und Unternehmen. Diesen digitalen Gesprächen zuzuhören, darauf zu reagieren und damit Kundenbeziehungen zu stärken, ist Aufgabe des Social Listenings. Und das wird immer häufiger mit Tools unterstützt.

  • Illustration: abstrakte Elemente für Infografiken, geometrische Formen 

    Daten für alle

    von Jan Kaden

    Benutzerfreundlich aufbereitete, öffentlich zugängliche Informationen. Das ist ein Ziel der Open-Data-Bewegung. Und tatsächlich stellen immer mehr Behörden in aller Welt ihre Daten ins Netz. Doch sind die Angebote wirklich nützlich oder nur Halden für Datenmüll? Wie sieht es in Deutschland im internationalen Vergleich aus?

  • Hand, die eine Computermaus und einen Einkaufswagen gezeichnet hat 

    Magento 2

    von Alexander Steireif

    Magento ist weltweit die am meisten verwendete reine Onlineshopsoftware. Mittlerweile gibt es die Open-Source-Plattform in Version 2, die auf einer neuen Systemarchitektur basiert und eine bessere Performance und Skalierbarkeit verspricht.

  • Collage aus mehreren Polaroid-Bildern 

    Bilder mit Haken

    von Jörg Morsbach

    Sie kennen sich mit den Themen Bildrechte und Bildlizenzen gut aus? Dann studieren (und dokumentieren) Sie sicherlich auch immer die Lizenzbedingungen der verschiedenen Bilddatenbanken. Wenn nicht, sollten Sie diesen Artikel genau lesen.

  • Frau mit ausgestreckter Hand. Über der Hand schwebt ein großes, illustriertes Atom 

    Atomic Design

    von Patrick Lobacher

    Die Metapher der „Seite” hat langsam ausgedient. Immer mehr Geräte mit immer mehr Auflösungen verlangen vor allem im Designprozess ein radikales Umdenken. Das klassische Vorgehen liefert nicht nur suboptimale Ergebnisse, sondern funktioniert oft auch schlicht nicht mehr. Eine mögliche Antwort darauf ist Atomic Design.

  • Verschiedene Screendesigns, verknüpft zu einem einfachen Prototypen 

    Sketch vs. Adobe XD

    von Mirko Lemme

    Photoshop galt lange als Branchenstandard fürs Screendesign. Mit den Entwicklungen hin zu mehr Purismus, Responsiveness und neuen Möglichkeiten per CSS etablierte sich in den letzten Jahren Sketch als praktische Alternative. Adobe holt nun zum Gegenschlag aus und präsentiert seinen „Experience Designer”.

  • Illustration eines Raketenstarts 

    Google AMP

    von Markus Werner

    Google stellt mit seinem Projekt „Accelerated Mobile Pages” (AMP) eine einfache Lösung vor, um Newsinhalte auf mobilen Endgeräten innerhalb weniger Augenblicke zu laden. Das soll den Weg frei für ein beschleunigtes mobiles Web machen. Seit Februar 2016 ist AMP für jeden Publisher nutzbar.

  • Mann arbeitet am Schreibtisch mit Tablet und Smartphone an einem Layout 

    Erfolgsfaktor Layout-Testing

    von Christiane Helmchen

    Noch immer werden Layout-Tests häufig als der uncoole kleine Bruder der Unit- und Integrations-Tests angesehen – sie gelten als nervig, langwierig, überflüssig. Dabei bringt automatisiertes Layout-Testen viele Vorteile mit sich. Ein Überblick über Chancen, Wege und Grenzen.

  • Foto einer Brille, im Hintergrund ist unscharf eine Stadt zu sehen, durch die Brille hindurch ist die Stadt klar zu erkennen 

    ally.js

    von Rodney Rehm

    In der letzten Ausgabe schrieb Christian Schaefer in der Working-Draft-Kolumne über das Thema Barrierefreiheit. Unter anderem bemängelte er fehlende Werkzeuge zur einfacheren Umsetzung barrierearmer Webapplikationen. Genau diesen Punkt bedient die JavaScript-Bibliothek ally.js.

  • Illustration eines Mannes am Schreibtisch, um seinen Kopf herum schwirren Begriffe und Icons aus der Web-Branche 

    Tipps & Tricks

    von Jens Grochtdreis

    Neben den spannenden Diskussionen um neue Layoutmodelle und CSS-Architekturen kommen gerne die Kleinigkeiten bei CSS zu kurz. Details, die Sie sofort in Ihre Projekte aufnehmen können, um sich die Arbeit zu erleichtern.

  • Hände von drei Menschen, die auf ihre Smartphones schauen 

    NativeScript

    von Johannes Hoppe und Sebastian Witalec

    Statt eigenständige, native Apps für die mobilen Betriebssysteme zu erstellen, können Sie auf hybride Apps auf Basis von HTML und JavaScript setzen. Dabei sind Beschränkungen schwer zu vermeiden. Das Open-Source-Framework NativeScript schickt sich an, die letzten vorhandenen Grenzen einzureißen: echte native Apps auf Basis von JavaScript.

  • Illustration von vielen Container, in der Mitte der Schriftzug »Docker« 

    Docker

    von Lars Kumbier

    Alle Jahre wieder beschert uns eine Firma eine neue Technologie, um die Softwareentwicklung einfacher und effizienter zu gestalten – nach VMs und Cloud nun Container mit Docker. Aber was genau bringt Docker an Vorteilen gegenüber den bestehenden Technologien?

  • Node.js-Logo vor einem abstrakten Hintergrund mit Knotenpunkten und Linien dazwischen 

    State of Node

    von Sebastian Springer

    Seit die ersten Codezeilen von Node.js 2009 von Ryan Dahl geschrieben wurden, ist einige Zeit vergangen. Die Plattform ist mittlerweile aus der Webentwicklung kaum mehr wegzudenken. Mit der Weiterentwicklung von Node.js hat sich auch die Art der Umsetzung von Applikationen geändert.

  • Logo Working Draft 

    Working Draft

    von Stefan Baumgartner

    Das CMS ist tot, lang lebe das CMS! Die großen Monolithen, die uns Webentwickler seit Jahren begleiten, haben ausgedient. Schlanke Wartungsoberflächen, APIs und flexible Frontend-Endpunkte sind in. Der Trend zu lose gekoppelten Websites ist spürbar da, es ist nur eine Frage der Zeit, bis dies Usus wird.

  • Pfefferschote 

    Pfefferles Open Web

    von Matthias Pfefferle

    Die IETF und das W3C sind in die Jahre gekommen, ihre Standardisierungsprozesse wirken träge und bürokratisch. Spezifikationen werden unnötig aufgebläht oder haben oft wenig Bezug zu realen Anwendungsfällen. Das geht sogar so weit, dass sich Browserhersteller bewusst über das W3C stellen, um HTML5 weiterzuentwickeln.

  •  

    Black Bot

    von Nicolai Schwarz

    Chatbots sind auf dem Vormarsch und übernehmen für Unternehmen – früher oder später – die Kommunikation. Wir können nach dem Wetter fragen. Nach einem Taxi. Nach News. Oder nach Tipps fürs Wochenende. Das lässt sich doch ausbauen.