Webdesign-Kritik # 85 Sonic Electronix

Jede Woche schauen wir uns eine neue Website an und analysieren das Design. Wir werden auf beide Bereiche hinweisen, die gut erledigt werden, zusätzlich zu den Bereichen, in denen etwas Arbeit anfallen könnte. Zum Schluss bitten wir Sie, Ihr eigenes Feedback zu geben.

Der heutige Standort ist Sonic Electronix, ein Unterhaltungselektronikunternehmen. Lass uns rein springen und sehen, was wir denken!

Wenn Sie Ihre Website für eine zukünftige Design-Kritik einreichen möchten, dauert dies nur wenige Minuten. Für die Bewertung Ihres Designs berechnen wir 49 US-Dollar - deutlich weniger, als wenn Sie einen Berater für einen Blick auf Ihre Website bezahlen würden! Hier erfahren Sie mehr.

Über Sonic Electronix

Sonic Electronix ist ein weltweit führender Einzelhändler für Car Audio und andere Unterhaltungselektronik. Unser Lager trägt mehr als 15.000 hochwertige Elektronik. Wir bieten unübertroffenen Service zu unschlagbaren Preisen. Bauen Sie noch heute das Car-Audiosystem Ihrer Träume auf und genießen Sie erstklassigen Service und schnellen Versand. Wir führen auch eine große Auswahl an professionellen Audio-, DJ-Equipment- und Karaoke-Produkten für Anwendungen vom Einstiegsbereich bis zum seriösesten Audiospezialisten.

Hier ist ein Screenshot der Homepage:

Bewerte es!


Erste Eindrücke

Sonic Electronix sieht aus wie ein ziemlich typischer Online-Händler. Auf einen Blick gibt es mehrere Aspekte des Designs, die meiner Meinung nach gut gemacht werden. Ich kann sagen, dass hier definitiv einige Anstrengungen unternommen wurden, um der Site einen ästhetischen Reiz zu verleihen, was großartig ist. Ich habe unzählige andere Websites in diesem Genre mit einem echten Durcheinander einer Homepage gesehen.

Was mich sofort anspricht, sind die sauberen, konsequenten Produktaufnahmen. Jedes Produkt wird auf weißem Hintergrund dargestellt und wirkt professionell. Dieses Engagement für Konsistenz wird auf der gesamten Site in verschiedenen Formen durch Wiederholung von Farben, Schaltflächenstilen usw. versucht.

Es gibt Punkte, an denen die Seite wirklich mit Unordnung zu kämpfen hat? ?

Trotzdem gibt es Punkte, an denen die Seite wirklich mit Unordnung zu kämpfen scheint, wie dies bei der großen Mehrheit der Online-Shops der Fall ist. Darüber hinaus gibt es verschiedene Optimierungen und Änderungen, die ausgeführt werden könnten, um die Benutzerfreundlichkeit und den Fluss der Seite zu verbessern. Letztendlich denke ich, dass einige große Verbesserungen vorgenommen werden könnten. Lassen Sie uns es aufteilen und sehen wie.

E-Commerce ist anders

Die meisten Webdesigns können von einem ähnlichen Standpunkt aus angegangen werden. Ich kann ein paar grundlegende, grundlegende Gestaltungsprinzipien nehmen und die hässlichsten Websites überarbeiten. Das Interessante an E-Commerce ist jedoch, dass es ein komisches Feld ist, in dem die Websites mit dem schlechtesten Design gelegentlich die erfolgreichsten zu sein scheinen.

"Wir müssen im Auge behalten, wenn Sie eine Website wie diese kritisieren, dass dieses Genre nach eigenen Regeln arbeitet."

Heißt das, wir sollten E-Commerce-Websites absichtlich hässlich machen? Absolut nicht. Allerdings müssen wir bei einer solchen Site berücksichtigen, dass dieses Genre nach eigenen Regeln arbeitet und dass einige Dinge, die für ein Portfolio-Design wirklich wichtig erscheinen könnten, in dieser Situation nahezu irrelevant sind.

Es ist auf jeden Fall eine gute Idee, sich ständig in der Branche umzusehen und zu entscheiden, wer sich warum gut entwickelt. Wenn ein Unternehmen Hunderttausende von Dollar in die Erforschung der effektivsten Layouts und Einkaufsflüsse investieren muss, was kommt dann damit heraus? Während ich unten weiterführende Ratschläge gebe, werde ich versuchen, mich von externen Referenzen zu trennen, um uns auf dem Laufenden zu halten.

Seitentitel

Eines der allerersten Dinge, die ich beim Besuch einer Website mache, ist die Titelleiste. Das ist völlig instinktiv, das Web hat mich trainiert zu denken, dass dies mir sagen wird, worum es bei einer Site geht. Folgendes sehe ich auf der Sonic Electronix-Seite.

Wie Sie sehen, konzentriert sich die Titelleiste ausschließlich auf Autoradio. Nun, ich bin bereit zu wetten, dass dies für SEO-Zwecke ist und wirklich mehr für Keyword-Cramming ist, als Informationen an den Nutzer zu übermitteln. Ich bin ganz dafür, Ihre Seite für Suchmaschinen zu optimieren, aber nicht, wenn dies die Nützlichkeit für den Nutzer verringert, und genau das passiert hier.

Ich bin ganz dafür, Ihre Seite für Suchmaschinen zu optimieren, aber nicht, wenn dadurch der Nutzen für den Nutzer eingeschränkt wird.

Das Problem hier ist, dass, sobald ich das hier gelesen habe, ich nicht mehr Auto-Audiogeräte suche. Ich werde wahrscheinlich nicht einmal auf den Rest der Seite schauen, vor allem, wenn ich fünf Registerkarten über eine Google-Suche geöffnet habe und schnell durch sie hindurch gehe, um zu sehen, welche Produkte die benötigten Produkte enthalten.

Selbst wenn Car Audio Ihr größter Verkäufer ist und es so aussieht, als wäre es, denke ich, könnte dies zu etwas mehr Nacharbeit für die Produkte, die Sie tatsächlich verkaufen, überarbeitet werden. Zum Beispiel:? Car Audio, GPS, Sicherheit, Handys und mehr.? So etwas trifft auf die Keywords, die Ihnen gefallen, während Sie dennoch eine genaue Beschreibung der Website vermitteln.

Header

Eine der Hauptstellen auf der Seite, die ich mit Unordnung zu kämpfen sehe, ist die Kopfzeile. Dies ist ein äußerst häufiges Problem auf allen Arten von Websites, da Sie diesen wichtigen ersten Eindruck so sehr unterdrücken wollen.

Wenn wir darüber nachdenken, wie wir diesen Header verbessern können, um ihn benutzerfreundlicher zu gestalten, lassen Sie uns einen Blick nach außen werfen. Sobald ich mich auf verschiedenen populären E-Commerce-Sites umgesehen hatte, fiel mir auf, dass sie sehr interessant waren, wie sie den Platz in ihren Kopfzeilen behandeln. Hier sind zwei Beispiele, das erste von Amazon und das zweite von Overstock.

Schauen Sie sich die Größe dieser Suchleisten an! Offensichtlich sehen sie die Suchfunktion als wahrscheinlich das primäre Ziel für Nutzer an, die ihre Website besuchen, und sie möchten sicherstellen, dass die Suchfunktion so prominent wie möglich dargestellt wird.

Ich empfehle auf jeden Fall den Test einer Seite mit überarbeitetem Header, um vor allem die Suche zu unterstützen.

Bei Sonic Electronix ist viel Platz für ein großes Suchfeld vorhanden, das jedoch bei der Suche nach anderen Ideen geopfert wird. Ich empfehle auf jeden Fall den Test einer Seite mit überarbeitetem Header, um vor allem die Suche zu unterstützen.

Navigation

Ich habe vor und zurück gehandelt, wie ich mich mit Mega-Menüs fühle, die Millionen Links enthalten, aber an einem Ort, an dem es gut zu funktionieren scheint, sind E-Commerce-Sites, die eine Menge Inhalte zu durchschauen haben. Die Navigationsmenüs von Sonic Electronix sind übersichtlich angeordnet und machen es relativ einfach, schnell zu erkennen, was ich kaufen möchte.

Ich denke jedoch, dass der Header-Clutter in diesem Bereich gegen uns wirkt. Wenn wir den Blick darauf richten, wo sich das Navigationsmenü befinden würde, finden wir es zwar, aber es ist ein wenig verloren in einem Meer von Links, Farbverläufen, Markierungen, Dropdowns usw.

Bei gutem Design geht es darum, Entscheidungen zu treffen. Sie müssen entscheiden, was wichtig ist und wie Sie es hervorheben möchten. Wenn Sie sich auf den Weg machen und versuchen, alles wichtig zu machen, dann machen Sie nichts weiter.

Top-Artikel

Lassen Sie uns als Nächstes zu den vorgestellten Elementen der Seite springen. Hier erhalten Sie Ihre erste echte visuelle Dosis der Vielfalt und Qualität der auf der Website angebotenen Produkte. Die Elemente sind ordentlich in einem Raster angeordnet, und wie ich oben darauf hingewiesen habe, verwenden Sie einen hübschen Studiohintergrund mit viel Whitespace.

Ich mag diese Gegend wirklich sehr, aber es gibt ein paar Probleme, die ich damit habe. Zunächst ist es aus Sicht der Benutzerfreundlichkeit ziemlich ärgerlich, dass nicht jedes gesamte Feld anklickbar ist. Das Bild kann ebenso angeklickt werden wie der Produktname und "Jetzt kaufen". Wenn Sie sich jedoch auf verschiedenen anderen Websites umsehen, besteht die Tendenz darin, es so zu gestalten, dass ich irgendwo innerhalb des Rahmens der Box klicken kann, um zur entsprechenden Produktseite zu gelangen. Mit dem aktuellen Setup könnte es denkbar sein, dass eine Person ein paar Klicks benötigt, um es richtig zu machen.

"Sie werden feststellen, dass die Benutzer sehr vorsichtig sind, wenn Sie auf E-Commerce-Websites Tasten drücken, aus Angst, ungewollt etwas kaufen zu können."

Weiterhin fühle ich mich wie der? Shop Now? Knöpfe sind vage. Ich bin mir nicht ganz sicher, was das bedeutet und wie es damit zusammenhängt, was passiert, wenn ich den Knopf drücke. Bin ich nicht von der Sekunde an, die die Seite lädt? Wird dieser Button den Artikel kaufen? Ist es einfach etwas, auf das ich für mehr Informationen klicke?

Sie werden feststellen, dass die Benutzer bei der Betätigung von Schaltflächen auf E-Commerce-Websites vorsichtig sind, aus Angst, ungewollt etwas zu kaufen. Stellen Sie beim Erstellen einer Schaltfläche sicher, dass sie mich ausreichend auf das vorbereitet, was passieren wird, wenn ich sie drücke.

Warum Sonic kaufen?

Mein am wenigsten geliebter Teil der Seite ist der? Warum Shop Sonic? Abschnitt in der Nähe des Bodens. Dieser Abschnitt ist einfach eine Box mit vier großen Absätzen. Es ist nicht wirklich entworfen? so viel wie geworfen. Es fühlt sich an, als wäre es ein großer Teil des Inhalts, von dem der Designer gerade keine Ahnung hatte, was er damit anfangen sollte:

Dies ist ein großer Block langweiliger Informationen, die ich als Benutzer einfach nicht durchlesen werde, es sei denn, Sie machen sie interessanter. Wie können wir das beheben? Es stellt sich heraus, dass es sich bei dem Inhalt wirklich um eine Feature-Liste handelt: schneller Versand, sichere Zahlungen usw. Angesichts dieser Informationen ist es nicht schwer, eine solide Inspiration zu finden. Finden Sie heraus, wie der Online-Apple Store dieses Problem angeht:

Sehen Sie, wie viel besser das ist. In der Sonic Electronix-Sektion wird alles in eine unbeholfen lange Spalte geworfen, die frei von Bildern oder attraktiven Visuals ist. Apple ging das ganz anders an, indem er den Inhalt in vier Spalten aufteilte, den Text auf einen kurzen Absatz beschränkte und mit schönen Icons und Fotos auf sich aufmerksam machte.

Fußzeile

Noch ein letzter Kommentar, bevor wir diese Kritik zusammenfassen: Ich denke, die Fußzeile ist ein bisschen ein Schandfleck:

Ich bin nicht sicher, ob Sie entweder die Aufzählungszeichen oder den Link benötigen, aber ich bin sicher, dass beide zusammen diesen Bereich nur schwer lesbar machen. Wenn ich eine aufgeben müsste, würde ich die Unterstreichungen so abwälzen, dass die Fußzeile eher der von Newegg.com ähnelt:

Die Unterschiede zwischen diesen beiden Fußzeilen sind für das ungeübte Auge gering, aber der Newegg-Fuß sieht einfach viel sauberer und übersichtlicher aus.

Fazit

Alles in allem denke ich, dass die Sonic Electronix-Site mit ihrem Design einen guten Start hat, aber sie müssen die Hierarchie der Informationen überdenken. Dies ist das Problem, dem wir immer wieder begegnet sind, als wir die Seite heruntergingen.

Die Präsentation von Inhalten auf eine logische, durchsuchbare und attraktive Weise ist ein Hauptziel des Webdesigns.

Die logische, durchsuchbare und attraktive Darstellung von Inhalten ist ein vorrangiges Ziel des Webdesigns. Informationsverstopfung und etwas Faulheit des Designers in Fällen wie dem Warum Shop Sonic? Abschnitt halten die Website von dem zurück, was es sein könnte.

Letztendlich schlage ich einige Click-Tracking-Studien vor, um zu sehen, was Nutzer mögen / brauchen. Verwenden Sie diese Informationen, um zu reduzieren, was nicht effektiv ist, und hervorzuheben, was ist. Ich vermute stark, dass Elemente wie die Suchleiste viel effektiver sein könnten, wenn sie prominenter wären.

Du bist dran!

Nun, da Sie meine Kommentare gelesen haben, helfen Sie dem Designer mit ein paar weiteren Ratschlägen. Teilen Sie uns mit, was Sie an dem Design toll finden und was Sie für stärker halten könnten. Wie immer bitten wir Sie, auch den Designer der Site zu respektieren und eine klare, konstruktive Beratung ohne harte Beleidigungen anzubieten.