Wer ständig mit dem Internet zu tun hat und etwas aufmerksamer durch die
verschiedenen Internetseiten surft, wird etwas feststellen: Immer mehr Internetseiten sind
nicht mehr wie früher Aufgebaut als eine Ansammlung von Seiten, die miteinander
verlinkt sind, sondern es gibt nur noch eine einzelne Seite auf der alle gewünschten
Informationen zu sehen sind, oder nachgeladen werden.
Dass dies nicht nur ein Trend ist, dem nur wenige innovative Startups folgen, wird
durch die vielen Giganten im Internet deutlich. So ist zum Beispiel die komplette Seite von
Facebook zum Großteil eine Single Page Application, auch SPA genannt. Doch auch Gmail,
Google Maps, Twitter und dir fallen bestimmt noch mehr Seiten ein, sind alles SPA’s.
Doch warum wird diese Technik so häufig und gerne eingesetzt? Dies lässt sich leicht
durch die vielen Vorteile, die eine SPA mit sich bringt nachvollziehen. Denn unter anderem
verringert eine solche Internetseite die Serverlast des Betreibers enorm. Die eigentliche Seite
wird nur einmal heruntergeladen und anschließend müssen nur noch Informationen, Texte
und Bilder nachgeladen werden. Es müssen nicht bei jeder Navigation alle Skripte, Header
und Stylesheets der Seite neu geladen werden. Dies bringt einen großen Vorteil für Seiten, die
sehr große Benutzerzahlen zu verzeichnen haben. Ein weiterer Nutzen bringt das SPA-Paradigma bei Seiten die hohe Interaktivität zwischen dem Benutzer und der Anwendung
benötigen. Hier kann eine solche Seite wie eine typische Desktopanwendung auftreten, sodass
man garnicht mehr das Gefühl hat, im Internet unterwegs zu sein. Dies ist zum Beispiel bei
Google Docs der Fall.
Wenn wir jetzt die Vorteile einer SPA wissen, müssen wir jetzt nur noch mehr über die
technische Realisierung einer solchen Web-App erfahren. Ermöglicht werden diese Art von
Internetseiten nur durch JavaScript oder andere auf clientseitig laufende Skripte.
Hierbei ist der Begriff AJAX der Kern einer jeden SPA. Denn nur durch AJAX
(Asynchronous JavaScript and XML) ist es möglich, Inhalte dynamisch nachzuladen,
nachdem die Seite fertig geladen wurde. Dazu gibt es auch immer mehr mächtige
Frameworks, die eigens dafür entwickelt wurden. So sind AngularJS, React oder Backbone.js
nur die Bekanntesten unter den vielen Verfügbaren.
Da wir jetzt auch die Technik dahinter verstehen, sollten wir uns aber noch über die
Nachteile einer SPA im Klaren sein. Denn ein großes und nicht zu vernachlässigendes Manko
ist die Suchmaschinenoptimierung einer Single Page Application. Da der komplette Inhalt
der Seite nicht sofort beim aufrufen der Seite verfügbar ist, können die meisten Crawler nicht
alle Inhalte erfassen, die die Seite zur Verfügung stellt. Außerdem wird beim Klick auf einen
Link keine neue Seite geladen, da alle Inhalte nur nachgeladen werden und es im
wesentlichen nur eine Seite gibt. Daher sollte bei Firmenseiten oder ähnlichem auf eine SPA
verzichtet werden. Denn eine solche Seite ist im Normalfall nicht bei den obersten
Suchergebnissen gelistet.
Folglich sollte genauestens überlegt werden, was die Ziele einer Seite sind, bevor die
eigene Seite als Single Page Application gebaut wird. Kann der SEO-Faktor vernachlässigt
werden, oder ist viel Interaktion gefragt, so kann getrost auf bekannte Frameworks wie
AngularJS gesetzt werden. Ist jedoch ein gutes SEO-Ranking erforderlich, so sollte von dieser
Technologie abgeraten werden und eher eine Seite im klassischen Stil entwickelt
werden.
Quellen
http://www.dtelepathy.com/blog/design/8-reasons-why-pageless-design-is-the-future-of-the-web
http://t3n.de/news/single-page-webdesign-beispiele-323225/
http://singlepageappbook.com/goal.html
https://de.wikipedia.org/wiki/Single-Page-Webanwendung
https://blog.secu-ring.de/software/single-page-applications-loesung-fuer-probleme/
http://www.flyacts.com/blog/seo-und-spa-single-page-applications-unvereinbar-oder-unzertrennlich/