Web-Mex One Page Design

geschrieben von 
Publiziert in News
Jul 14, 2015 Schreiben Sie den ersten Kommentar!
Artikel bewerten
(2 Stimmen)
Web-Mex One Page Design Bild: Web-Mex

Bild: Web-Mex

One Page Design ein neuer Trend für Internetseiten. Wir haben hier mal die Vor- und Nachteile dieser Designlösung recherchiert.

Alles Wissenswerte zu diesem Thema finden Sie in unserem kleinen Artikel zum One Page Design.

 

Was ist One Page Design?

Als "One Page" werden Internetseiten bezeichnet, die nach dem Aufruf der URL nur aus einer Seite bestehen. Für den Browser bedeutet das erst einmal viel Arbeit. Er muss die Inhalte komplett laden um diese anschließend darstellen zu können. Darin besteht auf jeden Fall ein Nachteil. Bei einer schwachen Internetverbindung benötigt ein One Page Design eine längere Ladezeit als normale Webseiten. Ist die Seite dann aber auf dem Anzeigegerät angekommen, kann das neue Konzept alle Vorteile ausspielen. Der Nutzer bekommt alle relevanten Inhalte durch scrollen schnell angezeigt. Dabei brauchen die Inhalte nicht erneut vom Server geladen werden.

Bei herkömmlichen Webseiten wird nach dem Anklicken eines Menüpunktes ein sogenannter "Request" an den Server gesendet. Der bereitet dann die HTML Daten auf und sendet die Inhalte an das Anzeigegerät. Dieser Prozess wiederholt sich bei normalen Internetseiten nach jedem Klick.

Ein Klick auf den Menüpunkt einer modernen One Page Seite löst nur ein kleines Script aus was den gewählten Inhalt automatisch in den Sichtbereich der Anzeige (Focus) scrollt. Ist die One Page Seite einmal komplett geladen, kann der User ohne weitere Internetverbindung die komplette Webseite ansehen. Die Usability und das "Look and Feel" sind damit also deutlich besser als bei den herkömmlichen Webseiten.

Geht One Page Webdesign mit einem CMS?

Obwohl die meisten CMS nicht dafür konzipiert sind, ist eine One Page Seite mit jedem Content Management System möglich. Egal ob Joomla, Drupal, Typo3 oder Wordpress, der Designunterschied liegt im Template verborgen. Jedoch eine Anpassung einer vorhandenen Webseite ist nicht ganz so einfach. Die Struktur ist komplett unterschiedlich. Der Vorteil bei einem CMS liegt bei der Menge an Content der einfach und schnell angelegt werden kann. Bei einer Webseite mit extrem viel Inhalt wird die Ladezeit auch bei guten Internetverbindungen zu langsam. Hier gibt es zwei gute Möglichkeiten ein One Page System zu erstellen.

Nachladen des Inhaltes per Ajax

Über diese Methode wird der Inhalt der One Page Seite bei dem ersten Aufruf nicht komplett geladen sondern erst durch einen Ajax Request, wenn dieser bennötigt wird. Das ganze läuft folgendermaßen ab: Eine Internetseite hat Inhalte zu 5 Themenpunkten auf der One Page Webseite die gleich beim ersten Aufruf mit geladen werden. Weitere Themen erscheinen nur wenn der User ganz an das untere Ende der Webseite scrollt. Ein schönes Beispiel für diese Technik ist die Google Bildersuche. Nach einer Suchanfrage werden dort die Ergebnisse angezeigt die auf ca. 150% der Webseite passen. Wenn man dann nach unten scrollt erscheint ein Ladesymbol und weitere Ergebnisse werden per Ajax in die aktuelle Webseite geladen. Auch hier wird das HTML Grundgerüst nicht neu geladen, nur die zusätzlichen Inhalte kommen vom Server via Ajax auf das Anzeigegerät. Mit Ajax werden Daten zwischen Server und Client übertragen ohne dass die eigentliche Seite neu geladen werden muss.

Diese Technik begrenzt die Ladezeit der Webseite auf ein Minium, bietet aber dem Nutzer alle relevanten Informationen.

Mischbauweise mit One Page  

Ein großer Nachteil bei der Suchmaschinenoptimierung von One Page Webseiten ist die fehlende Einstiegs-URL. Da sich ja die gesamte Kommunikation auf einer Seite abspielt bleibt dabei auch die URL-Adresse stehen.

www.ihre-seite.de/index.html  wäre so eine typische One Page URL. Google gibt aber Bewertungspunkte für Keywordrelevante URL's wie sie bei professionellen Webseiten auch extra erzeugt werden z.B. www.ihre-seite.de/lederschuhe.html oder www.ihre-seite.de/lederstiefel.html. Der Einstieg der Googlebots wird hier entscheidend gesteuert. Deshalb lohnt es sich für Webseitenbetreiber mit viel Content über eine Mischbauweise nachzudenken. Der komprimierte Themeninhalt der One Page Startseite im Zusammenspiel mit den "Landingpages" der Zielseiten für die SEO - Optimierung. 

Bild: Web-Mex

Bei diesen Konzept werden die Vorteile der beiden Designlösungen miteinander kombiniert.

 

Ist One Page Design responsiv?

Eine Internetseite im One Page Design ist nicht automatisch mobilready oder responsiv. Diese Eigenschaften liegen im Templatescript selbst verankert. Bei Web-Mex wird allerdings seit einiger Zeit kein Framework mehr verwendet was nicht responsiv ausgelegt ist. Im Prinzip sind jedoch auch statische Webseiten möglich, die keinerlei Viewportabfragen machen und somit als nicht mobilready gelten.

Die von uns neu erstellten Projekte werden generell auf die aktuellen Anforderungen von Google ausgerichtet und lassen sich einfach über folgendes Tool online prüfen.
https://www.google.com/webmasters/tools/mobile-friendly/  

Webseiten die diesen Test nicht bestehen, erhalten eine schlechtere Rankingbewertung als vergleichbare Seiten die diese Anforderungen erfüllen.

Fazit

Für eine kleine Firmenseite ist eine HTML One Page Webseite eine empfehlenswerte Verbesserung. Alle relevanten Informationen stehen schnell und unkompliziert für den Anwender zur Verfügung. Die Kosten für Systempflege und Unterhalt bleiben gering. Sollte wirklich eine Änderung notwendig sein, so kann unser Support dies schnell und unkompliziert erledigen.

Eine One Page Seite mit CMS lohnt sich für jeden der schnell Inhalte selbst einfügen und ändern möchte, aber insgesamt nicht über 5 - 10 Themen verwaltet. Hierbei ist die SEO Ausrichtung auf bis zu 10 Keywords auch mit einer URL gut zu leisten.

Für Unternehmen die mit mehr Content arbeiten empfehlen wir eine Lösung mit Ajaxinhalt und / oder einer Kombination aus CMS Darstellung als One Page Startseite und herkömmlichen Unterseiten.

Gelesen 2758 mal Letzte Änderung am Mittwoch, 16 Mai 2018 14:35

Schreibe einen Kommentar

Bitte achten Sie darauf, alle Felder mit Stern * zu füllen. HTML-Code ist nicht erlaubt.