Mit der Weihnachtszeit gleich um die Ecke werden viele von uns online einkaufen. (OK? Vielleicht viel einkaufen!) Die Checkout-Seite einer Website kann diese Erfahrung zum Erinnern machen oder die Sie sich vielleicht vergessen lassen.
Wenn Sie eine Checkout-Seite entwerfen, gibt es so viele Überlegungen - Funktionalität, Benutzerfreundlichkeit, Sicherheit und Design. Das letzte Element kann jeder Designer beeinflussen. Eine Checkout-Seite sollte nicht als nachträglich gestaltet werden. Es ist wohl die wichtigste Seite im Online-Shopping-Erlebnis.
Machen Sie es sichtbar
Das mag nach einer naheliegenden Idee klingen, aber die Checkout-Seite einer E-Commerce-Seite muss visuell sein. Zu viele Websites machen es zu einer Grundform.
Dies ist aus mehreren Gründen wichtig. Eine visuelle Verbindung zwischen den Checkout-Seiten und dem Rest der Website schafft Glaubwürdigkeit der Marke. Wenn die Checkout-Seite wie der Rest der Site aussieht, fühlt sie sich sicher und als gehörte sie zur Site. Visuals, von Logos bis hin zu Artikeln im Warenkorb, helfen Benutzern, sich zu erinnern, warum und wo sie sich im Web befinden. (Denken Sie daran, dass ein Großteil der Welt eine recht abgelenkte Gruppe von Internetnutzern ist.)
Welche Art von Visuals sollten Sie verwenden?
- Bilder. Jeder Artikel sollte mindestens von einem Symbol begleitet sein, das anzeigt, was der Benutzer kauft.
- Logos. Das Firmenlogo sollte immer deutlich sichtbar sein (und anklickbar sein, um zum Rest der Website zurückzukehren).
- Große Knöpfe. Rufe zu Aktionen auf, z. B. in den Warenkorb Artikel aktualisieren und? Jetzt kaufen? groß, farbenfroh und optisch ansprechend. Schaltflächen sollten leicht zu finden sein und Sie möchten klicken.
- Farbe. Zu viele Checkout-Seiten sind alle weiß mit umrandeten Kästchen. Es ist in Ordnung, Farbe zu verwenden. Behalten Sie auf der Checkout-Seite das Farbschema für den Rest der Website bei.
- Typografie. Der Text sollte einfach und gut lesbar sein. (Die Leute tendieren dazu, einfachen serifenlosen oder serifenlosen Schriftarten mehr als einem Skript oder einer Schriftart für Neuheiten zu vertrauen.) Sie können jedoch auch mit größeren Textelementen Spaß haben.
Fügen Sie Zahlungslogos und Sicherheitssiegel ein
Fügen Sie Visuals hinzu, mit denen Benutzer ein gutes Gefühl beim Einkaufen haben. Während die meisten Leute verstehen, dass sie online mit einer Kreditkarte bezahlen können, wird diese Idee durch kleine Logos neben den Zahlungsschaltflächen untermauert.
Es ist ein kleiner, aber beruhigender visueller Hinweis für Benutzer. Dies kann dazu beitragen, die Verwirrung darüber, welche Zahlungsarten akzeptiert werden, zu beseitigen.
Denken Sie daran, Logos für alle Zahlungsarten anzugeben. (Zu viele Websites erinnern sich an Kreditkarten-Logos, vergessen jedoch PayPal oder Apple Pay.) Halten Sie die Bilder klein und gruppieren Sie sie in einer organisierten Weise. (Zum Glück für Designer werden die meisten dieser Elemente in kleinen Formaten gut dargestellt und weisen ähnliche Seitenverhältnisse auf.)
Erwägen Sie, für diesen Zweck ein spezielles Benutzeroberflächen-Kit mit Logos zu entwerfen oder herunterzuladen. Sie sind nicht auf Bestandslogos des Unternehmens beschränkt. Seien Sie einfach nicht zu wild mit dem Design; Ziel ist es, dass Benutzer die Logos in sehr geringer Größe auf dem Bildschirm erkennen.
Erwägen Sie das Vergrößern von Bildern
Checkout-Seiten, auf denen die Benutzer einen letzten Blick auf die Artikel im Warenkorb werfen können, sind ein großer Bonus. Hover-Effekte, durch die jeder Artikel im Einkaufswagen oder ein Popup vergrößert wird, können Benutzern ein letztes Mal die Möglichkeit bieten, potenzielle Einkäufe zu sehen, und die Frustration beseitigen, wenn Sie zurückkehren müssen, um eine Farbe oder Größe zu überprüfen.
Eine weitere Option besteht darin, übergroße Miniaturbilder für Elemente auf der Checkout-Seite zu erstellen. Dieses zusätzliche Bild kann einem Benutzer helfen zu bestätigen, ob er oder sie sich für einen Einkauf entschieden hat und sich beim Kauf noch besser fühlt.
Zu viele Designer vernachlässigen das Einbinden von Bildern, wodurch das Ablegen eines Wagens erleichtert wird. Stellen Sie sich das so vor, ein Bild an der Kasse zu haben ist gleichbedeutend mit dem Stehen in einem Laden mit einem Artikel in der Hand. Nicht viele Menschen ändern zu diesem Zeitpunkt ihre Meinung.
Tabellen verwenden
Die Informationen im Warenkorb müssen perfekt organisiert sein. Dies erreichen Sie am einfachsten, wenn Sie den Wagen in Form einer Tabelle oder eines ähnlichen gitterbasierten Formats entwerfen.
Verwenden Sie Spalten und Zeilen, um jeden Artikel, ein Bild, eine Beschreibung, eine Menge, einen Preis und andere relevante Informationen anzuzeigen. Elemente sollten vertikal in Spalten mit anderen Informationen in der entsprechenden Zeile sortiert werden. Diese Art der Sortierung ist für Wagen mit mehreren Gegenständen unerlässlich, sodass Benutzer nicht gezwungen werden, sich über Bildschirme zu bewegen, statt nach oben und unten (was komfortabler ist).
Verwenden Sie in jeder Tabelle oder jedem Raster eine konsistente Ausrichtung. Links ist am häufigsten. Berücksichtigen Sie auch die Art und Weise, wie die Preise ausgerichtet werden, damit Sie auf dem Bildschirm gut zu sehen sind. Im Idealfall sollten sich die Preise so ausrichten, dass die Zahlen vor und nach einem Punkt für jeden Artikel in der gleichen Position stehen.
Denken Sie über Funktionalität nach
Obwohl ein Großteil der gesamten Funktionalität eines Checkout-Seitendesigns nicht die Direktive eines Designers ist, muss dies beachtet werden. (Ob Designer oder Entwickler diese Konzepte erstellen, kann je nach Team variieren.)
Zu den wichtigsten Funktionsproblemen, die Designelemente benötigen, gehören:
- Fähigkeit und einfacher Druck von mehreren Bildschirmen, einschließlich vor und nach dem Checkout.
- Fügen Sie die Wunschliste-Funktion oder eine andere Methode hinzu, um Artikel für einen späteren Kauf zu speichern. Machen Sie diese Informationen gemeinsam nutzbar.
- Zu viele Checkout-Seiten werden zu dunklen Löchern ohne Links zu anderen Teilen des Einkaufserlebnisses. Sperren Sie Benutzer nicht auf Seiten, aus denen sie nicht herauskommen können.
- Artikel im Warenkorb bearbeiten lassen.
- Betrachten Sie eine druckbare Rechnungsoption oder -seite. (Dies ist besonders wichtig, wenn Ihre Kunden Geschäftskunden umfassen.)
- Machen Sie es Benutzern leicht, zu verstehen, wie Sie Bestellungen ändern, ändern oder aktualisieren. Viele Checkout-Seiten enthalten neben jedem Artikel einen Mengenzähler. Machen Sie diese Nummer einfach zu bearbeiten (und sie sollte automatisch aktualisiert werden).
- Erstellen Sie nach dem Checkout ein Konto. Nicht jeder Kunde hat vorher mit Ihnen eingekauft. Es sollte schnell und einfach sein, einen Kauf zu tätigen und sich dann für ein Konto anzumelden. Verdeckt den Verkauf zuerst.
Schlüsselsymbole sollten auf jeder Seite angezeigt werden
Wenn Sie über das Design der Checkout-Seite nachdenken, beginnt das Web-Site-Konzept mit einer E-Commerce-Option. Bestimmte Designelemente müssen auf der gesamten Website mitgeführt werden.
In den Warenkorb legen und die Symbole für die Checkout-Seite sollten sich durch das gesamte Design ziehen lassen. Die Schaltflächen oder Navigationselemente sollten dasselbe Design (oder ziemlich ähnlich) haben wie die entsprechenden Aktionsschaltflächen auf der Checkout-Seite.
Erinnern Sie sich an mobile Benutzer
Ein wachsender Prozentsatz des Umsatzes findet auf mobilen Geräten statt auf Desktop-Computern statt. Denken Sie auch an das Design Ihrer Checkout-Seite und die Benutzerfreundlichkeit für diese Kunden. (Nichts ist frustrierender - und allzu häufig - als eine Website, die bis zur Checkout-Seite mit einem Telefon funktioniert.)
Design-Elemente mit Tipp und Streichen. Knöpfe sollten größer und leichter zu sehen sein. Form sollte tiefere Kästchen enthalten, so dass sie leicht zugänglich sind, ohne dass der Bildschirm vergrößert werden muss.
Wenn es um mobile Benutzer geht, ist es genauso wichtig, alles auf einer einzigen Seite zu halten. Erstellen Sie eine Checkout-Seite, die nicht durch mehrere Bildschirme blättert, sondern blättert.
Fazit
Das Entwerfen einer Checkout-Seite kann für jeden Designer eine große Aufgabe sein. Der Schlüssel ist etwas, worüber wir in der Design-Community oft sprechen: Halten Sie es einfach. Entwerfen Sie einen einfachen Umriss mit minimalen Effekten und einem Fokus auf Benutzerfreundlichkeit, und Sie werden eher Erfolg haben.
Denken Sie an den Benutzer, wenn Sie über Checkout-Seiten nachdenken. Bemühen Sie sich, eine Seite zu entwerfen, die visuell ansprechend ist, Logos zur Orientierung und Information der Benutzer, eine Vielzahl von Bildern, ein organisiertes Layout, Funktionen, Symbole zur Verkaufsförderung und Verkaufsförderung sowie eine mobile Oberfläche.
Stockfotos Mit freundlicher Genehmigung des kreativen Marktes.