Tag Archives: Design

Von ganz oben nach ganz unten: Nachdem wir vor kurzem viel über den Header gelernt haben, möchte ich heute einmal einen Blick mit euch auf den Footer werfen. Ein ansprechend gestalteter Footer, der in allen Ansichten des Shops gut dargestellt wird, gehört zu einer guten Shopgestaltung einfach dazu.

Häufig verkommt dieser allerdings zu einer Ansammlung von Links oder wird mit zu vielen Bildern überladen. Um diese – und noch andere häufige Fehler bei der Gestaltung des Footers – möchte ich mich mit diesem Tutorial kümmern

Continue reading →

Der Header ist das Aushängeschild eines Onlineshops. Ist dieser wenig ansprechend gestaltet oder mit Informationen überfrachtet, so ist ein potenzieller Kunde schnell wieder weg. Um einen professionellen Eindruck zu hinterlassen, ist ein durchdachter Header Pflicht.

Da wir im letzten Tutorial die wichtigsten Begriffe und Seitenelemente kennen gelernt haben, möchte ich heute zeigen, was man im StyleEdit 3 alles mit dem Header anstellen kann.

Ich möchte zudem auch die häufigsten Fehler aufzeigen und Lösungen anbieten, wie sich diese Probleme vermeiden lassen, damit die Darstellung des Headers nie kaputt aussieht. Außerdem möchte ich euch ein paar Tipps und Tricks zeigen, um den Header möglichst so zu gestalten, wie ihr ihn euch vorstellt.

Ich werde meine Beispiele möglichst so beschreiben, dass sie für alle drei Basisstyles im StyleEdit 3 durchführbar sind. Sollte es style-abhängige Einstellungen geben, werde ich bei diesen darauf hinweisen.

Continue reading →

So, nachdem über Ostern und danach hier etwas tote Hose war, wollen wir jetzt wieder voll mit unserem Wochenrückblick durchstarten. Diese Woche haben wir folgende Beoträge für euch gesammelt:

• Mobile User Experience – bei Disrooptive
• Geschäftsmodell Abmahnungen – bei Chip
• Mobile First im Content Marketing – bei Airmotion Media
• Besser ranken Dank E-Mail-Marketing – bei Björn Tantau
• Besseres E-Commerce-Design bei SEOPressor (Englisch)

Continue reading →

Hallo zusammen! Auch bei der Entwicklung der Demoshop-Templates macht der Fortschritt nicht halt und so möchte ich heute einmal darüber berichten, was sich mit den Design-Paketen für die Versionen GX3 v3.8.x und GX3 v3.9.x geändert hat. Es handelt sich bei diesem Artikel also um eine kleine Ergänzung unseres Blogposts zum Einbinden der Templates im eigenen Shop.

Continue reading →

Eigene Texte sind ein ausgezeichnetes Mittel, um einen Shop lebendiger wirken zu lassen und den möglichen Kunden direkt anzusprechen und zum Kauf zu animieren.

Aufgelockert wird ein langer Text optimalerweise mit einigen Bildern, die passend im Text untergebracht werden. Hier ergibt sich dann allerdings oft das Problem, dass diese Bilder zu unschönen Darstellungen auf unterschiedlich großen Displays der Nutzer führen.

Ein probates Mittel, um diesem Problem entgegenzuwirken, ist das Grid-System von Bootstrap welches ich auch hier schon einmal beschrieben habe.

Mit diesem kleinen Tutorial möchte ich dieses Mal zeigen, wie sich Inhalte mit dem Gridsystem für unterschiedliche Endgeräte optimiert darstellen lassen.

Extra CSS oder Einstellungen über den StyleEdit 3 sind diesmal nicht notwendig. Alles was wir heute brauchen, ist der Content Manager und das grundlegende Verständnis, wie das Gridsystem funktioniert.

Continue reading →

Nachdem wir in den letzten beiden Wochen auf unsere beliebtesten Tweets des Jahres 2017 zurückgeblickt haben (Platz 12-7 & Platz 6-1), ist jetzt mal wieder Zeit für Aktuelles. Diese Woche:

• Inspiration für Social-Media-Kampagnen – bei Hootsuite
• SEO für Onlineshops 2018 – bei Trusted Shops
• Häufige Fehler im Bezahlvorgang – bei Ngin Food
• Vorsicht bei Gewinnspielen – bei Aufgesang
• Design & SEO – bei Cognitive SEO (Englisch)

Continue reading →

Nachdem wir im letzten Artikel zum Thema StyleEdit 3 die wichtigsten Begriffe geklärt haben, wird es heute ein wenig technischer. Da sich dieser Artikel auf den vorherigen bezieht, empfehle ich, diesen vorab zu lesen.

Wie bereits im letzten Artikel angesprochen verwenden wir im Honeygrid-Template die Technologie – oder besser das Gerüst – “Bootstrap” und haben so die Möglichkeit auf sogenannte CSS-Präprozessoren zurückzugreifen, welche die gestalterischen Aufgaben erheblich erleichtern können. Ein Präprozessor kann Aufgaben erledigen, bevor es um die eigentliche Arbeit geht.

In unserem Fall bedeutet das, dass der Präprozessor schon etwas “Mathe machen” und Styles aus Einzelteilen zu einem Gesamten zusammensetzen kann, bevor wir diesen das erste Mal ausliefern. Er kann auch, wenn irgendwo tief in den Styles z.B. steht “benutze hier die Hintergrundfarbe” oder “verwende die Breite des Hauptinhalts”, diese an der entsprechenden Stellen auslesen und dann passend einsetzen.

Um wiederkehrende Werte für Farben, Höhen, Breiten und Abstände nicht jedes Mal neu schreiben zu müssen und den Aufwand zu minimieren, sollte sich an diesen Werten einmal etwas ändern, verwenden wir zahlreiche Variablen, in denen die benötigten Werte hinterlegt sind. Diese Variablen werden anschließend erst beim Erstellen des final ausgelieferten CSS in die richtigen Werte übersetzt.

Continue reading →

Das Honeygrid-Template ist das aktuelle Frontend-Template für den Gambio Shop und kann mit zahlreichen neuen Features und Verbesserungen aufwarten. Diese neuen Features, welche dem Shopsystem responsive Darstellung, Livefilter, und vieles mehr auf die Featureliste gebracht haben, haben es allerdings auch erforderlich gemacht ein neues Werkzeug zur individuellen Gestaltung des Templates zur Verfügung zu stellen: das neue StyleEdit 3.

Das StyleEdit 3 ist der Nachfolger unseres schon aus GX2-Zeiten bekannten StyleEdit und ist ein umfassendes Werkzeug, mit dem ihr euren Honeygrid-Shop den passenden Feinschliff geben könnt. Geblieben ist dabei aber nur der Name StyleEdit und der Zweck des Tools, die praktische Bedienung und die Vorgehensweise bei der Gestaltung haben sich deutlich verändert.

Da hierzu immer wieder Fragen nach einer Anleitung aufkommen, habe ich mich dazu entschlossen, hier eine kleine Serie zu veröffentlichen, die euch die Funktionsweisen des StyleEdits näher bringen soll, so dass möglichst jeder von euch dazu in der Lage ist, optisch das Beste aus seinem Shops heraus zu holen.

Das Ganze wird nicht als einfache Anleitung geschrieben sein, in der einfach nur die Funktionen aufgelistet und erklärt werden, sondern soll anhand von Fallbeispielen erfolgen.

Continue reading →

Kaum zu glauben, dass 2017 schon wieder zu mehr als der Hälfte vorbei ist. Die Zeit rennt aber wirklich im Moment… Damit wenigstens ein paar Momente hängenbleiben, haben wir wieder fünf der interessantesten Artikel aus der letzten Woche für die Blogmarks gesammelt:

• Der Rankingeinfluss von Content Marketing – bei webpixelkonsum
• Leadgewinnung über Social Media – bei Socialmedia Doktor
• Besseres Design = mehr Verkäufe – bei twago
• Die Zukunft des Bezahlens – im Bank Blog
• Fundamentale SEO-Insights – bei Search Engine Journal (Englisch)

Continue reading →

So, die Elternzeit ist vorbei, es ist mal wieder Zeit für einen Wochenrückblick in den Blogmarks. Denn natürlich stand die E-Commerce-Welt in den letzten Wochen nicht einfach still. Wir haben also mal wieder unsere fünf Wochenhighlights herausgesucht:

• Ungewöhnliche Wege zur Kundengewinnung – bei Trusted Shops
• Auf dem Weg zum individuellen Shop – bei Etailment
• Die Gedanken des Nutzers lesen – bei Konversionskraft
• Abschaltung von Onlineshops? – bei Shopbetreiber
• Der Effekt von Educational Content – bei Conductor (Englisch)

Continue reading →