Shop-Optik

Teil 3: Auf dem Weg zum guten Shop-Layout

Shop-Layout ist harte Arbeit und eine stetige Gradwanderung zwischen Funktionalität, Optik und Usability. Die hier versammelten Anregungen und Hinweise sind hoffentlich ein guter Ausgangspunkt, um einen Shop zu gestalten. Für die Feinheiten sind dann Usability-Tests und ausführliches Ausprobieren unerlässlich.

Auf dem Weg zum guten Shop-Layout

© Archiv

Open-Source-Boliden

Der Trend zu Open-Source-Systemen betrifft natürlich auch die Shops. Eine der älteren Open-Source-Lösungen ist OSCommerce. OSCommerce selbst wird allerdings nicht mehr aktiv weiterentwickelt und besitzt auch kein Template-System. Das Template ist das HTML-Grundgerüst, in das die Inhalte aus der Shop-Datenbank eingefügt werden. Ein Shop hat hier oft ein komplexeres Template als ein Content Management System, da auch für Warenkorb und Bestellprozess entsprechende Templates vorliegen müssen.

Fehlt wie im Falle von OSCommerce das Template-System, müssen die Skriptdateien des Shops selbst angepasst werden.

Glücklicherweise wurde OSCommerce als Basis für andere Open-Source-Shops verwendet. Der bekannteste Abkömmling ist xt:Commerce (www.xtcommerce.com). xt:Commerce glänzt vor allem durch den immensen Funktionsumfang. Als Template-System wurde Smarty integriert. Die Anpassung ist zwar in Anbetracht von Dutzenden einzelner Template-Dateien für verschiedene Ansichten nach wie vor nicht trivial, aber zumindest möglich, ohne die Kerndateien selbst zu verändern.

Außerdem gibt es diverse vorgefertigte Templates, die sich recht einfach anpassen lassen. Wer xt:Commerce herunterladen und vor allem Zugriff auf das überlebensnotwendige Forum haben möchte, muss einen Obolus von unter 100 Euro löhnen. Dieses Vorgehen ist umstritten aber in Anbetracht der stetigen Weiterentwicklung und des Supports im Forum verständlich. Wem das missfällt, der wird bei den weiteren OSCommerce-Sprößlingen Zen Cart (www.zen-cart.com) und OOS (www.oos-shop.de) fündig.

Auf dem Weg zum guten Shop-Layout

© Archiv

xt:Commerce Software

Neben der eigenständigen Shop-Software sind in viele Content Management Systeme Shops integriert. Dies hat den Vorteil, dass der Administrator nur einen Login für Shop und CMS benötigt. Außerdem bietet das CMS natürlich die Möglichkeit, jenseits des Shops noch sehr einfach weitere Seiten anzulegen. Zwar bieten viele Shops wie z.B xt:Commerce auch Möglichkeiten, normale Inhaltsseiten zu erstellen, allerdings hat dieser rudimentäre Ansatz natürlich keine Chance gegen ein etabliertes CMS.

Eine der bekanntesten und besten Kombinationen bilden Joomla! und VirtueMart. Das aus Mambo entstandene Joomla! bietet den CMS-Rahmen und VirtueMart (ursprünglich phpShop) lässt sich als Komponente mit einzelnen Modulen installieren. Unter www.virtuemart.org findet sich allerdings auch ein komplettes Joomla!-Paket inklusive Virtuemart. Für Typo3 gibt es ebenfalls eine Commerce-Erweiterung, die ein wenig jüngeren Datums ist. Sie ersetzt die ältere Erweiterung tt_products. Das Template wird hier hauptsächlich über TypoScript, die Template-Sprache von Typo3, gesteuert.

Die wichtigsten Fragen zur Shop-Usability

Es antwortet Armin Kappler, Dipl. Kommunikationsdesigner, Usability-Experte, Arrabiata Solutions GmbH

Auf dem Weg zum guten Shop-Layout

© Archiv

IM: Was ist für Sie das Wichtigste, wenn Sie ein Shop-Layout entwickeln?

AK: Ein Shop muss einfach sein, d.h. es muss leicht sein, ein Produkt in den Warenkorb zu legen, es zu bestellen und zudem die nötige Übersicht und Orientierung zu behalten.

IM: Welche Bestandteile heben einen Shop in gestalterischer Hinsicht von einer normalen Website ab?

AK: Zu der normalen Navigation kommen durch den Shop noch weitere Navigationselemente für die Bestellung und den Bestellprozess hinzu. Die dazu nötigen Schaltflächen sollten sich klar abheben und auch in Zusammenhang zueinander stehen. Die Funktionalität der Schaltflächen sollte klar erkennbar sein. Zudem muss der Kunde immer wissen wo er ist und wie es um seine Finanzen steht.

IM: Worauf achten Sie beim Bestellprozess?

AK: Eine Übersicht über die einzelnen Schritte des Bestellvorganges gibt dem Kunden die nötige Orientierung. Die einzelnen Schritte sollten klar und übersichtlich sein und nur für den jeweiligen Schritt relevante Informationen enthalten. Klarheit schafft Vertrauen.

IM: Wie wichtig ist die Suche im Shop?

AK: Bei Usability-Tests suchen je nach Zielgruppe ca. 3/4 der Nutzer auch bei klar Such-orientierten Aufgaben zuerst mit der Navigation und nicht mit der Suche. Das heißt aber auch, dass 1/4 der Nutzer (oder je nach Zielgruppe auch deutlich mehr) gerne und häufig zur Suche greifen. Sie sind auf brauchbare Ergebnisse angewiesen. Außerdem sollte dem Nutzer deutlich kommuniziert werden, wenn es keinen Treffer gibt. Verhelfen Sie Ihrem Nutzer zum Sucherfolg!

IM: Wie kommen Kommunikationspannen mit dem Nutzer zu Stande?

AK: Oft weiß der Benutzer nicht genau, was er wo zu tun hat. Genau das ist aber entscheidend. Hier spielt auch die Wortwahl eine wichtige Rolle und ergänzt die Optik. Der Nutzer muss unbedingt in irgendeiner Form immer eine Rückmeldung erhalten, was er gerade getan hat und wie die nächsten Schritte sind.

Mehr zum Thema

Youtube Sperre umgehen GEMA
Videos freischalten

So umgehen Sie die GEMA-Sperre bei Youtube. Was Sie dazu brauchen, und wie es am einfachsten geht.
Neue Fritzboxen unterstützen den AC-Standard.
WLAN-Geschwindigkeit verdoppeln

Mehr WLAN-Geschwindigkeit: Mit dem WLAN-Standard 802.11ac und den richtigen Geräten und Einstellungen verdoppeln Sie den Datendurchsatz.
Netflix auf dem TV
Programm in der Übersicht

Welche Filme und Serien gibt es bei Netflix eigentlich zu sehen? Was ist neu im Streaming-Angebot? Diese Antworten helfen weiter.
Netflix
Streaming

Preise, kompatible Geräte, Datenrate, Serien- und Filmangebot von Netflix: Wir beantworten die wichtigsten Fragen rund um den Streaming-Dienst.
E.T. – Der Außerirdische
Vorschau auf Film- und Serien-Highlights

Amazon Prime Instant Video lockt im Dezember 2016 mit Film-Highlights wie "E.T.", "Fast & Furious 7" und der Serie "Ku’damm 56​".