Shop-Umzug: manchmal muss es sein

Shop-Umzug: für die Daten-Migration zu einer neuen Shop-Software gibt es Helfer. Foto: Kai Oberhäuser @ unsplash.com

Shop-Umzug: für die Daten-Migration zu einer neuen Shop-Software gibt es Helfer. Foto: Kai Oberhäuser @ unsplash.com

Wer einen Shop im Internet betreibt, der betrachtet den wahrscheinlich noch kritischer als eine eigene Website ohne Verkauf. Ist das Design noch aktuell, ist die Darstellung der Produkte noch ansprechend? Und stimmt die Technik? Oder gibt es da nicht schon längst bessere Alternativen?

Gründe für einen Shop-Umzug gibt es viele. So sind die Angebote an responsiven Designs für Shops je nach System höchst unterschiedlich entwickelt. Auch das Argument, mit WooCommerce einen Shop unter dem Dach des Redaktionssystems WordPress mit all dessen Vorteilen (Vielfalt der responsiven Designs zum Beispiel ) nutzen zu können, ist verlockend. Auch die Administration erscheint bei einem System vielleicht deutlich angenehmer als bei einem anderen.

Ein Shop-Umzug mit dem Wechsel auf eine andere Software erscheint zunächst einmal als mittlere Katastrophe: Da müssen Datenbanken angepasst werden, manchmal muss auch der Shop komplett neu aufgesetzt werden. Sind dann alle Kunden weg?

Ich kann hier nicht für alle Shops sprechen. Aber die beruhigende Nachricht ist, man kann prinzipiell mit seinem Shop umziehen. Auf einen anderen Server, zu einer anderen Software, zu einem neuen Layout. Wer von OS-Commerce über den XT Shop zu Modified Shop gewandert ist, der braucht vielleicht einige besondere Anpassungen. Denn die deutschsprachige Shop-Software hat zwar hierzulande viele Vorteile, ist aber von internationale Dienstleistern offensichtlich noch nicht so gut angenommen worden.

Hier ein paar eigene Erfahrungen und Tipps für den Shop-Umzug. Aber vorneweg: Man sollte sich darauf einstellen, dass man alle Eigenheiten des neuen Shopsystem (und deren Schwächen) wahrscheinlich erst dann entdeckt, wenn man umgezogen ist. Dann heißt es Augen zu und durch.

Cart2cart: Schon der Name weist auf einen Helfer für den Shop-Umzug.

Cart2cart: Schon der Name weist auf einen Helfer für den Shop-Umzug.

Helfer für den Shop-Umzug

Wem wie mir die technischen Details eines Shop-Systems eher ein Gräuel sind, der sucht sich Helfer. Beim Thema Shop-Umzug hat man die schnell gefunden. Meine Fundstücke waren diese Dienste:

cart2cart

litextension.com

Beide bieten einen Umzug der Daten von so ziemlich jedem Shopsystem zu so ziemlich jedem anderen Shopsystem an. Die Unterschiede liegen eher in der Handhabung.

Litextension bietet ebenfalls Unterstützung bei einem Wechsel der Shop-Software an.

Litextension bietet ebenfalls Unterstützung bei einem Wechsel der Shop-Software an.

Die Gemeinsamkeiten:

  • Beide bieten eine Kostenschätzung für den Umzug an, die von der Menge der Daten abhängt (nicht vom Shopsystem).
  • Bei beiden ist man mit unter 100 € schon dabei. Aber einige Dinge, wie die Password-Migration kosten extra. Und die halte ich für ziemlich wichtig, damit die bestehenden Kunden ohne Verzögerung gleich weiter einkaufen können.
  • Beide geben eine Art Zufriedenheitsgarantie bzw. eine Geld-zurück-Garantie.
  • Und beide bieten Hilfe während und nach dem Umzug an. Nach meinen Erfahrungen ist der Support gut, ohne dass zwingend Kosten anfallen.

Die Unterschiede:

cart2cart wickelt den Umzug einmal selbstätig ab. Man kann hier im Voraus die genauen Kosten ermitteln und sogar einen kostenlosen Demo-Durchlauf machen. Nötigenfalls kann man dann die Daten seines alten Shops noch in Ordnung bringen bzw. anpassen. Das verkürzt die Zeit des „Nacharbeitens”, die bei mir mit beiden Versionen angefallen ist.

Wer freilich Vorsorgen möchte und einen zweiten Versuch für die Migration haben möchte, der muss eine Versicherung abschließen und kann dann in einem begrenzten Zeitraum evt. ein weiteres Mal umziehen.

Litextension dagegen versorgt den Kunden mit einem Plugin, der damit dann so oft umziehen kann, wie er möchte. Ggf. muss man dafür seine Datenbank nochmal löschen, aber man hat auf diese Art mehrere Versuche. Interessant ist das für all diejenigen, die den neuen Shop parallel entwickeln und einrichten. Sie können dann, bevor der neue Shop online geht, eine weitere Migration durchführen. Auch wenn das erst Wochen später erfolgt.

Es gibt übrigens auch noch einige andere Dienste. Die meisten dieser Angebote funktionieren wohl so, dass sie nicht frei für alle Wechsel verfügbar sind. Sie dienen vielmehr dem Wechsel zur Shop-Software des einen Anbieters der neuen Shop-Software. Also meistens auch für kostenpflichtige Shops, während Modified Shop, WooCommerce und einige andere ja keinen Kauf notwendig machen.

Mein Fazit:

Die beiden Dienste funktionierten bei mir in mehreren Shops zuverlässig. Nacharbeiten musste ich bei beiden. Einmal sind Daten auf eine andere Art übernommen, einmal hat das neue Shopsystem eine andere Datenstruktur. Und in allen Fällen müssen – weil man ja wahrscheinlich gleich ein neues Layout mit responsivem Inhalt und größeren Bildern nutzen wird – die Bilder überarbeitet werden. Was aber im Zweifelsfall mit einem Plugin auch automatisch gehen kann, wenn vorher schon die Basis-Bilder groß genug waren.

In meinen Fällen waren die Artikelbestände der Shops recht überschaubar, so dass auch dieses Nacharbeiten relativ zügig vonstatten ging. Wer einen großen Shop umzieht, der muss Testläufe nutzen oder im Nachhinein mehrere Versuche anhängen bis es klappt.

Die Kosten von rund 100 bis 200 € haben sich in jedem Fall gelohnt. Und sind im Vergleich zu den anderen Anpassungen (Layout, Shopstruktur) vergleichsweise gering.

WordPress Bildgrößen in vielen Variationen

Im neuen Layout braucht man meistens auch andere WordPress Bildgrößen.

Im neuen Layout braucht man meistens auch andere WordPress Bildgrößen.

Sie sind ein unerschöpflicher Quell der Freude: Gute Bilder in einem WordPress-Blog machen das Lesen leichter. Sie ziehen Besucher an und bieten manchmal mehr Informationen auf einen Blick, als ein langer Text. Sie sind aber auch manchmal lästig: Google meckert rum, weil die Bilder zu große Datenmengen aufweisen und die Schnelligkeit der Webseite beeinträchtigen. Die Bilder sind nie in der passenden Größe und Auflösung dort, wo sie sein sollen. Und die Bildbearbeitung frisst inklusive der Bilder für Soziale Medien fast so viel Zeit, wie das Schreiben des Artikels – vom Fotografieren mal gar nicht zu reden.

Was tun? Weniger Bilder sind ja auch keine Lösung. Und die falschen WordPress Bildgrößen erst recht nicht. Mit etwas Planung und ein paar Helferlein kann das auch reibungsloser verlaufen.

WordPress: interne Bildverarbeitung

Zunächst einmal können wir uns alle freuen. Denn die Bildverwaltung in WordPress ist viel komfortabler geworden. Und auch Bildverarbeitung ist jetzt möglich. Wem das noch nicht genügt, der kann auf Plugins zurückgreifen.

Weitere WordPress Bildgrößen per Plugin

Das Plugin Simple Image Size erlaubt zusätzliche Bildgrößen festzulegen, auf die die Bilder automatisch beim Hochladen zurechtgeschnitten werden. Wer also bestimmte Größen braucht, die noch nicht in der functions.php seines Themes festgelegt sind, der kann sich damit prima behelfen.

Heißt das, ich kann jetzt einfach meine Riesen-Bilder aus der Super-Duper-DSLR hochladen? Kann man machen, sollte man aber nicht. Die effektivste Art Bilddaten sinnvoll zu reduzieren funktioniert mit Photoshop und dem Befehl „Für Web und Geräte speichern”. Dort genügt in der Regel die Qualitätsstufe hoch. Wenn es keine besonders hochwertigen Aufnahmen sondern eher Info-Bilder sind, kann man an an der Qualität auch Abstriche machen.

Hier wählt man die größte Größe aus, die man für WordPress, Instagram, Facebook & Co. verwenden möchte. Die kann man jetzt auch auf WordPress hochladen, dort werden automatisch die verschiedenen Bildgrößen erzeugt.  Diese Größe kann man dann aber auch für die Sozialen Medien verwenden.

… oder manuell in der functions.php festlegen

Wers noch detaillerter möchte und selbst im Maschinenraum seiner WordPress-Installation herumwerkeln möchte, der sucht nach einer Anleitung,wie man die entsprechenden Befehle in die functions.php einbaut (zum Beispiel hier)

Ein Genesis-Theme: Die größe WordPress Bildgröße bleibt gleich.

Ein Genesis-Theme: Die größe WordPress Bildgröße bleibt gleich.

Intelligent Bilder „nachladen”

Eine andere Möglichkeit, das Ladeverhalten seiner Seiten positiv zu beeinflussen bietet das Plugin Lazy Loads. Es bewirkt, dass nur diejenigen Bilder geladen werden, die gerade sichtbar sein sollen. Wer also auf seiner Startseite die letzten 10 Blog-Posts anzeigt und jeder hat etliche „schwere” Bilder, der ist mit dem Einsatz dieses Plugins sowieso gut bedient.

Auf die Möglichkeit der WordPress-Bildbearbeitung fürs Verkleinern sollte man übrigens nur in Notfälle zurückgreifen: Hierbei wird nämlich nur die Darstellung verkleinert. Das Bild selbst bleibt so groß (und schwer) wie vorher. Sprich: Nicht die Datenmenge wird reduziert, sondern nur die Darstellung.

Die Datenmenge ist ganz in Ordnung, wenn die Bilder etwa 200 KB groß sind. Da das – je nach Theme und Layout – nicht immer eine befriedigende Lösung ist, bleibt oftmals nur die Möglichkeit, entweder in Photoshop nochmal selbst Hand anzulegen. Oder auf Apps und Dienste wie JPGMini oder compressor.io zurückzugreifen.

Retina – immer zwei Varianten?

Und was ist nun mit den hoch gelobten Retina Displays bei Apple? Muss ich für eine ordentliche Darstellung nicht sowieso die größten und besten Bildqualitäten einstellen? Ja und nein. Ideal wäre es natürlich, wenn je nach Display und Anforderung die richtige Bilddatei eingebunden wird. Das kann das Plugin WP Retina 2x.

Prima! Dann kann ich ja meinem responsiven Theme die Wahl der richtigen WordPress Bildgröße überlassen. Die Plugin-Autoren weisen jedoch daraufhin, dass eine responsive Darstellung bevorzugt werden sollte, die Auswahl des Bildes über ein javascript die Fallback-Methode sein sollte.

Wordpress Bildgröße 620 px in der Desktop-Variante - aber 850 Pixel in Tablet-Modus.

WordPress Bildgröße 620 px in derDesktop-Variante – aber 850 Pixel in Tablet-Modus.

170130_jo_620

Responsiv – wie groß ist das genau?

Gibts sonst noch Hürden? Nur wenige. Beachten könnte man vielleicht noch, dass das Umspringen eines responsiven Layouts Bildgrößer erfordert, die man eventuell gar nicht auf dem Plan hatte. In diesem aktuellen Layout meiner Website zum Beispiel ist die größte Bilddarstellung 620 Pixel breit.

Wer jetzt mit dem Mauszeiger auf die rechte untere Ecke geht und beginnt, das Browser-Fenster zusammen zu schieben, der stellt fest, dass das Layout umspringt. Bei der Tablet-Größe verschwindet erst die rechte und später (fürs Smartphone) schließlich auch die linke Sidebar.

Die Folge: Die Bilder werden dann 850 Pixel groß dargestellt. Sind die Bilder mit nur 620 Pixel Kantenlänge hochgeladen, bleiben sie an manchen Stellen kleiner, als der dafür vorgesehene Platz im Layout. Aber damit kann man leben, wenn man nicht gerade als Fotograf die eigenen Werke anpreist.

Neues Layout – neue Bilder?

Aber nichts hält ewig. Irgendwann entscheidet sich jeder WordPress-Benutzer mal für ein andere Layout, gerne mit größerer Bilddarstellung. Nur die Beiträge der vergangenen Jahre wirken jetzt etwas verloren – denn sie sind viel zu klein für das neue Layout. Schließlich ist das Internet schneller geworden, der Rechner leistungsfähiger.

Also jetzt alle Bilder nochmal raussuchen, neu bearbeiten, nochmal hochladen? Auch dafür gibts ein Plugin: Regenerate Thumbnails legt die nächst kleineren Bildgrößen neu an. Egal ob man jetzt einfach in den WordPress-Voreinstellungen die Maße geändert hat oder – was öfters vorkommt – ein neues Theme installiert hat.

Aber auch hier gilt wie immer in der Bildbearbeitung: Größer machen geht nicht. Wenn ich also stets nur Bilder mit 620 Pixel Breite hochgeladten habe, kann ich daraus für mein neues Thema keine Header-NBilder mehr mit 1180 Pixel Breite machen.

Mein Fazit:

  1. Die eigene Bildbearbeitung für eine „leichte” Version des größten benötigten Bildformates ist immer hilfreich. Ob ich das mit Photoshop, einer anderen App oder online mache ist egal. Das Original des Fotos sollte ich sowieso immer unverändert behalten.
  2. Die größte Online-Variante sollte das Bildmaß enthalten, dass ich für Webseite oder Soziale Medien brauche. Ausnahme ist Pinterest: Hier funktionieren Hochformate am besten, das verlangt zusammen mit der Nutzung als „Textbilder” immer eine eigene Verarbeitung.
  3. Für responsive Layouts darauf achten, wann ein Bild die größte Darstellung aufweist. Das  ist nicht immer in der Desktop-Version der Fall.
Wordpress Bildgrößen in einem modernen Layout: Große Header. Die sind aber noch am einfachsten auszuwechseln.

WordPress Bildgrößen in einem modernen Layout: Große Header. Die sind aber noch am einfachsten auszuwechseln.

Responsive Website und Weinshop für das Weingut Jägle

Weingut Jägle

Weingut Jägle

Für das Weingut Jägle bin ich schon ziemlich lange tätig. Es ist eine  konstruktive und angenehme Zusammenarbeit: In der Familie Jägle steht der Service für den Kunden hoch im Kurs. Auch Aktualität und Nutzwert der Website haben einen hohen Stellenwert. Und die Jägles haben einen ausgeprägten Sinn für Gestaltung, was sich zum Beispiel auch  in der Gestaltung des Weinladens im Weingut niederschlägt.

Als das Thema responsive Websites und Shops aktuell wurde war klar, dass man das auch den Kunden des Weinguts anbieten möchte. Zuvor basierte die Website auf dem Redaktionssystem WordPress und einem selbst erstellten Layout. Der Shop basierte auf XT Commerce oder später auf modified shop. Nun ist alles unter WordPress zusammengelegt. Das Theme ist natürlich responsiv und umfasst auch den Shop, der jetzt mit Woocommerce arbeitet und mit deutschen Anpassungen versehen wurde.

Das Erscheinungsbild, die Bedienungsfreundlichkeit durch Besucher und Kunden aber auch die Administration empfinde ich hier als sehr schick und komfortabel. Zusammen mit einem responsiven Newsletter scheint das eine recht gute Grundlage für den Kontakt zu Besuchern und die Vermarktung der Weine.

www.weingut-jaegle.de

One-Page Darstellung für eine Gastro-Website

Website Dinkelberger Hof

Website Dinkelberger Hof

Und zur Abwechslung mal wieder etwas aus dem täglichen Schaffen: Für den Dinkelberger Hof habe ich eine Website erstellt, die etwas aus dem rahmen fällt: Hier ist die Website beschrieben, für die ich erstmals ein One-Page-Layout verwendet habe, basierend auf Bootstrap. Die Seite ist responsiv und sollte damit auf allen Tablets und Smartphones gleichermaßen gut aussehen.

Warum eine einseitige Darstellung anstelle der bisherigen, doch meistens recht umfangreichen Websites, die auf einem Redaktionssystem (meistens WordPress) basieren? Die Seite sollte fertig gestellt werden, bevor der Betrieb eröffnet wird. Also keine dokumentarischen Texte und Bilder aus dem laufenden Betrieb. Statt dessen die wichtigsten Infos, die für einen Besucher interessant sein könnten. Die kompakte Darstellung schenidet wahrscheinlich in einzelnen Aspekten hinsichtlich der Suchmaschinen-Optimierung nicht so gut ab, wie eine komplexe Seite. Aber sie war ja auch von vorneherein als befristete Übergangslösung gedacht.

Wenn der Betrieb läuft lassen sich leicht umfangreichere Darstellungen erarbeiten und in ein Redaktionssystem einbinden. Dann sind auch die Suchmaschinen glücklich. Der Betreiber kann jetzt schon zufrieden sein, denn der Besucherverkehr im Betrieb und auf der Website ist bereits ganz gut in Gang gekommen.

Responsive Layouts testen

Online-Dienste

Responsive Layouts, also Darstellungen von Internetseiten, die sich in der Größe dem Display anpassen, lassen sich recht leicht testen. Zum Einen gibt es Internetseiten, die die entsprechende Website in einem Fenster zeigen. Dann gibt es Online-Dienste wie diesen, wo man Screenshots von verschiedenen Browsern und Betriebssystemen anfordern kann. Oder man sieht die entsprechende Website im Fenster eines ausgewählten Smartphones simuliert.

Die einfachste und praktikabelste Methode ist für mich die Darstellung im Firefox: Dort unter Extras –> Web-Entwickler –> Bildschirmgrößen testen. Dann kan man ebenfalls online die aufgerufen Website im Hoch- und Querformat verschiedener Auflösungen betrachten.

Dieser Beitrag auf shopbetreiber-blog.de nennt weitere Möglichkeiten, zum Beispiel mit dem Browser Chrome und diverse Web-Apps.

150422_ff_ansicht