Vertrauensbildende Maßnahmen

Vertrauen schaffen zwischen dem Händler und dem Kunden ist eine der Grundvoraussetzungen für erfolgreiche Geschäfte im Online-Handel. Ein mit SSL verschlüsselter Checkoutprozess war für uns daher schon immer eine Selbstverständlichkeit – nicht jeder Mitbewerber sieht das so. Darüber hinaus arbeiten wir seit Jahren erfolgreich mit Trusted Shops zusammen. Im vergangenen Jahr haben wir unser Engagement in diesem Bereich noch weiter ausgebaut und lassen unsere Webseiten täglich von McAfee Secure auf mögliche Schwachstellen prüfen – als erster und selbst zum Zeitpunkt dieses Posts ein Jahr später einziger Anbieter im Bereich Erzgebirge Volkskunst (Erzgebirge Palast) und Kuckucksuhren (Schwarzwald Palast).

In diesem Jahr gehen wir noch einen Schritt weiter. Unser Anbieter für SSL-Zertifikate, die PSW Group, hat uns in Zusammenarbeit mit Comodo ein Paket geschnürt, mit dem wir die Überprüfung auf Schwachstellen nicht nur auf alle unsere Shops ausweiten, sondern darüber hinaus auch noch alle Shops mit sogenannten Extended-Validation-Zertifikaten versehen können, die neben der schon vorhandenen Verschlüsselung auch klar und deutlich zum Ausdruck bringen, wer hinter der Website steckt und damit noch mehr Sicherheit für unsere Kunden bieten.
Damit übernehmen wir beim Thema sicheres Einkaufen nicht nur im Erzgebirge und im Schwarzwald die Vorreiterrolle, sondern jetzt auch im Bereich Nordic Cross Skating und lassen damit teilweise weit größere und umsatzstärkere Konkurrenzunternehmen hinter uns.

Krisenmanagement bei 1&1

In der Krise zeigt sich, was der Provider wirklich drauf hat. Krise bei 1&1 war gestern. Und das Krisenmanagement hat sich mit der Internetleitung einen Wettstreit darum geliefert, wer von beiden der größere Totalausfall ist.

Los ging es um kurz vor drei. Fünf von fünf Servern nicht erreichbar. Ein kurzer Check über die serielle Konsole ergab aber, dass es nicht an den Servern lag. Der Twitter-Account @1und1 brauchte dann geschlagene 20 Minuten, um das auch zu bemerken. Die, man sollte annehmen eigentlich genau für einen solchen Fall gedachte, Statusseite status.1und1.de hingegen verkündet auch heute morgen noch, dass alle Systeme funktionieren würden und dies seit dem 4. August so sei.

Ziemlich genau zwei Stunden später waren dann alle Server wieder erreichbar bis kurz vor 20 Uhr. Und hier kommt der Teil, der mich an dieser Geschichte wirklich aufregt. Fehler können immer mal auftreten, da kann man sich noch so gut absichern. Und ich gestehe jedem eine angemessene Zeit zu, dass er diese beheben kann. Wenn man aber um kurz nach fünf mit großen Halali auf Twitter verkündet, dass jetzt wieder alles gut sei, dann sollte man alles daran setzen, dass nicht genau der gleiche Fehler kurz darauf wieder auftritt:


Die Ursache ist bekannt. In anderen Worten:

Scheiße, genau das gleiche wie vorhin. Warum haben wir das nicht einfach vernünftig gefixt?

Und obwohl 1&1 weiß, woran es liegt, brauchen sie erneut über zwei Stunden, um das Problem aus der Welt zu schaffen!
Krisenmanagement und vor allem auch Krisenkommunikation sieht anders aus. Die angesprochene Statusseite hat sich auch beim zweiten Ausfall nicht aktualisiert und der Twitter-Account war eigentlich immer so viel zu spät dran, dass man sich auch den hätte sparen können.

Relaunch der vhs Kreis Kronach

Im frischen Look präsentiert sich seit dem Herbstsemster 2011 der Internetauftritt der vhs Kreis Kronach. Moderner geht es dabei aber nicht nur bei der Optik zu, sondern auch unter der Haube.

Erstmals kommt bei einem Webauftritt das HTML 5 Boilerplate zum Einsatz, das einfach schon von vornherein viele Stolpersteine aus dem Weg räumt. Damit einher geht dann aber auch der Wechsel vom antiquierten ISO-8859-1 hin zu UTF-8 und HTML5. Obwohl nicht zwingend notwendig, aber natürlich absolut sinnvoll, kommt jetzt auch php5 zum Einsatz.

Von 1999 bis 2011 das Online-Gesicht der vhs

Dank HTML5 konnte das schon vorhandene, semantische Markup weiter optimiert werden, CSS3 sorgt, sofern es der Browser unterstützt, mit Schatten und abgerundeten Ecken für ein bisschen Pep in der Optik. Und weil das ganze eben nicht aus dem Baukasten kommt sieht es auch nicht aus wie Baukasten.

Mit frischer Optik ins neue Jahrzehnt

Der Besucher findet auf der neuen Homepage vor allem mehr Information. War die alte Seite eher eine digitale Version des Programmheftes zeigt der neue Auftritt, was die vhs Kreis Kronach neben dem klassischen Unterrichtsprogramm sonst noch tut – von internationalen Projekten bis hin zu Firmenkooperationen. Damit das auch alles aktuell bleibt werkelt im Hintergrund als CMS WordPress. Da man als vhs auch im Bloggingbereich, bei Youtube und bei Facebook stärker vertreten sein will erlaubt es der Einsatz von WordPress für den Internetauftritt, ohne doppelten Schulungsaufwand gleich zwei Kanäle zu bedienen.

Und nicht nur in Sachen Web 2.0 wird in Zukunft noch das ein oder andere zu sehen sein, eine für den mobilen Einsatz optimierte Version der Homepage ist bereits in Arbeit und über den Winter wird auch in Sachen Barrierefreiheit noch das ein oder andere verwirklicht werden.

Mach ma kleiner!

An allen Ecken und Enden wird optimiert, was das Zeug hält. Bei Javascript und CSS gehört es quasi mittlerweile zum guten Ton, das ganze um Leerzeichen und Kommentare bereinigt auszuliefern, um die Dateigröße zu minimieren und damit die Ladezeiten zu optimieren. Bei Bildern, so scheint es, ist diese Erkenntnis noch nicht überall angekommen. Aber auch hier steckt immenses Optimierungspotential.

Zwei Apps erleichtern dem Webworker dabei die tägliche Arbeit.

Smaller

Sicher, es gibt diverse Online-Lösungen, die ein unkomprimiertes Javascript oder CSS durch den YUI Compressor jagen und man kann sich diesen natürlich auch selbst installieren, aber eine grafische Oberfläche, die auch Dateien per Stapelverarbeitung abarbeiten kann, wäre schon schön. Genau das leistet die Shareware Smaller, die darüber hinaus auch noch HTML komprimiert. Mit $20 nicht ganz billig, aber ich möchte im täglichen Arbeitsablauf nicht mehr darauf verzichten müssen. Neben der reinen Komprimierung kann das Programm darüber hinaus auch noch mehrere Dateien zu einer kombinieren.

ImageOptim

Eine verlustfreie Komprimierung von Bildern hat sich dagegen ImageOptim auf die Fahnen geschrieben. Auch hier ist eine Stapelverarbeitung möglich, das Tool unterstützt alle gängigen Web-Grafikformate (inkl. animierterter GIFs, sofern das heutzutage noch jemand braucht) und wählt selbständig die beste Kompressionsmethode. Selbst aus Bilder, die in Photoshop mit „Für Web speichern” gespeichert wurden kitzelt es noch ein paar Prozent raus. Punkten kann das Tool auch beim Preis, es ist nämlich Freeware.

Kleinere Dateien wirken sich nicht nur bei der Ladezeit positiv aus sondern mitunter auch im Geldbeutel, beispielweise wenn man seine Bild- und CSS-Dateien über ein CDN ausliefern lässt.

Konfigurierbare Produkte mit individuellen Preisen

Bei manchen Funktionalitäten, die in Magento eingebaut sind, fragt man sicht schon, ob man bei Varien mit dem, was man sich da zusammenklöppelt, auch einen Praxisbezug sieht oder ob man einfach irgendwas programmiert, egal ob es in der Praxis brauchbar ist oder nicht. Die Preisvergabe bei konfigurierbaren Produkten ist so ein Fall. Magento sieht von Haus aus vor, dass man einer Variante, etwa einer anderen Größe, einen festen oder prozentualen Aufpreis geben kann. Oder anders gesagt, die untenstehende Preismatrix funktioniert mit diesem System schon nicht mehr:

  11cm 15cm
natur 28,40 31,80
Goldrand 31,20 34,90
lasiert 34,60 40,70

Denn bei natur kostet die 15cm-Variante 3,40 Euro mehr, bei Goldrand aber schon 3,70 Euro und bei lasiert gar 6,10 Euro. Das lässt sich weder durch einen Fixpreis noch durch einen prozentualen Aufschlag abdecken und wenn man dann noch bedenkt, dass man das auch noch für die Ausführung (natur, Goldrand, lasiert) machen muss bricht das ganze System in sich zusammen.

Zum Glück gibt es eine Lösung, die eigentlich so naheliegend ist, dass man sich fragt, warum Magento das nicht einfach von Haus aus kann: Simple Configurable Products. Die Erweiterung sorgt dafür, dass einfach der direkt beim Produkt hinterlegte Preis benutzt wird. Und nicht irgendwelche komischen Berechnungen durchgeführt werden, die am Ende doch nicht zum gewünschten Ergebnis führen.

Einen kleinen Bug hat die Erweiterung aber: Zeigt man die gewählte Option im Warenkorb an, dann wird immer das Admin-Label für das Attribut verwendet, welches nicht mehrsprachig ist. Aber dafür gibt es Abhilfe. Die Datei, um die es geht, ist Checkout/Block/Cart/Item/Renderer.php. Dort findet sich in Zeile 81:

'label' => $attribute->getFrontendLabel(),

Das muss lediglich durch

'label' => $attribute->getStoreLabel(),

ersetzt werden und schon sind die Label auch in der jeweiligen Store-Sprache.

Websitegeschwindigkeit über UMTS/EDGE testen

Viele Webdeveloper kennen das Problem sicherlich: Man sitzt zu Hause vor der dicken Leitung mit 25, 50 oder gar 100 MBit und baut z.B. eine mobile Version einer Website. Schwer vorstellbar, wie da die Ladezeiten im wirklichen Leben auf mobilen Endgeräten aussehen. Und das komplette Kontingent seiner Daten’flatrate’ will man ja auch nicht mit Tests aufbrauchen.

Abhilfe kommt von Apple. Im neuen XCode 4.1 (kostenlos) für Max OS X Lion (10.7) findet sich, versteckt unter /Programme/Dienstprogramme (bei manchen auch unter /Developer/Applications/Utilities) ein Ordner Namens Network Link Conditioner.

Klickt man die Prefpane-Datei doppelt, die sich darin befindet, installiert sich ein neuer Eintrag in den Systemeinstellungen, über den man verschiedenste Zugänge und Leitungsqualitäten simulieren kann. Apple hat bereits diverse Profile angelegt, eigene Konfigurationen kann man problemlos hinzufügen. Und dann kann man feststellen, dass beispielsweise diese Seite über VDSL50 in knapp zwei Sekunden lädt, während sie über gutes 3G-Netz ca. 10 mal so lange braucht.

Es wäre schön, wenn Apple dieses Utility einzeln zum Download anbieten oder direkt mit Lion ausliefern würde, derzeit bleibt einem nur der 3GB große XCode-Download. Nur dafür lohnt sich das sicherlich nicht, alle, die XCode sowieso installiert haben, bekommen aber ein nützliches kleines Helferlein für die tägliche Arbeit an die Hand.

via Matt Gemell

Umlaute im URL key von Magento

Umlaute ist ja eines meiner Lieblingsthemen. Und Magento stellt sich da direkt hinter Afterbuy in die ‘Können wir nicht’-Schlange. Naja, fast. So heißt es in meinem Lieblingsbuch auf Seite 162:

Die URL-Bezeichnung ist wichtig, wenn Sie als Shop-Besitzer die Anzeige in der Adressleiste eines Browsers beeinflussen möchten. Sollten Sie das Feld leer lassen, generiert Magento automatisch aus dem Produktnamen die URL-Bezeichnung. Da das System aus dem USA stammt, werden die Umlaute dabei nicht berücksichtigt, sondern falsch dargestellt: ä als a, ö als o etc.

Soweit richtig. Magento berücksichtigt in der URL-Bezeichnung (URL key) keine Umlaute. Warum man im Buch aber nicht direkt auf die Lösung verweist erschließt sich mir nicht. Denn wer mag schon bei vierstelligen Produktzahlen jeden URL key in Handarbeit erstellen?

Allerdings muss die im Magento-Wiki befindliche Lösung noch etwas erweitert werden, denn die Einträge in app/etc/local.xml, die im Wiki genannt werden, berücksichtigen weder ß noch die Großbuchstaben Ä, Ö und Ü (die Ersetzung erfolgt offensichtlich bevor der String in Kleinbuchstaben gewandelt wird).

Der fertige Block, der direkt vor </config> eingesetzt wird, muss also lauten:

<default>
  <url>
    <convert>
      <char0228><from>ä</from><to>ae</to></char0228>
      <char0246><from>ö</from><to>oe</to></char0246>
      <char0252><from>ü</from><to>ue</to></char0252>
      <char0223><from>ß</from><to>ss</to></char0223>
      <char0196><from>Ä</from><to>ae</to></char0196>
      <char0214><from>Ö</from><to>oe</to></char0214>
      <char0220><from>Ü</from><to>ue</to></char0220>
    </convert>
  </url>
</default>

Damit werden Umlaute im Produktnamen im URL key korrekt umgeschrieben. Die Einstellung greift nicht für Kategorien. Wer dafür eine Lösung hat, immer her damit, aber Kategorien legt man ja auch nicht so oft neu an wie Produkte bzw. nicht in der selben Anzahl.

xt:Commerce: Bestellnummer mit Datum

Das ist jetzt zur Abwechslung mal keine 1:1-Anleitung, die man einfach mittels Copy&Paste übernehmen könnte, sondern eher ein Beitrag, der einem eine Idee geben soll, wie man das Problem angehen kann. Er setzt voraus, dass man sich einigermaßen gut mit php und dem Shopsystem auskennt und in der Lage ist, Transferleistungen vorzunehmen. Wer sich das nicht zutraut sollte die Finger davon lassen oder nachher nicht rumheulen.

Die Frage kommt immer mal wieder und sie ist meiner Meinung nach auch durchaus berechtigt: Wie kann man die Bestellnummer eines xt:Commerce-Systems mit zusätzlichen Informationen anreichern, sei es ein Shopkürzel, das Datum oder auch einfach einer Zufallszahl? Die kurze Antwort ist: Geht nicht, denn xt:Commerce nimmt die inkrementell von MySQL erzeugte ID als Bestellnummer. Die lange Antwort ist: Geht schon, erfordert aber tiefe Eingriffe ins System. Updatefähigkeit ade. Aber das ist ja mit jedem xt:Commerce-‘Modul’ so.

Beginnen wir mit dem leichten Teil der Übung. Einer Funktion, die eine Bestellnummer mit Datum zurück liefert. Dazu brauchen wir neben der systemseitig generierten ID noch das Bestelldatum. Sonst haben wir morgen eine andere Bestellnummer als heute. Die Datei packen wir in das inc/-Verzeichnis und nennen sie xtc_build_order_id.php.

function xtc_build_order_id($date, $id) {
	$date = strtotime($date);
	return sprintf("%d%02d%02d-%05d", strftime("%y", $date), strftime("%m", $date), strftime("%d", $date), $id);
}

Der anstrengende Teil kommt jetzt: Überall, wo die Bestellnummer zur Ausgabe verwendet wird, muss der Funktionsaufruf ergänzt werden. Wir reden mindestens von diesen Dateien:

account_history_info.php
account_history.php
account.php
checkout_success.php
print_order.php
send_order.php

Dazu kommen alle Zahlungsmodule, sofern diese die Bestellnummer ausgeben oder benutzen (z.B. Paypal) und mindestens die orders.php im admin/-Verzeichnis. In jeder dieser Dateien muss am Anfang, nach den schon vorhanden includes, zunächst unsere Funktionsdatei inkludiert werden:

require_once(DIR_FS_INC.'xtc_build_order_id.inc.php');

und wie gesagt die Bestellnummer durch den Funktionsaufruf ersetzt werden, so wird z.B. in der send_order.php aus

$smarty->assign('oID', $insert_id);

das hier:

$smarty->assign('oID', xtc_build_order_id($order->info['date_purchased'], $insert_id));

Was daran anstrengend ist? Man muss sich in jeder Datei wieder raussuchen, in welcher Variable die Order-ID versteckt ist. In send_order.php ist es wie gesehen $insert_id, in print_order.php hingegen $_GET['oID']. Denn im $order-Objekt kommt die ID selbst nicht vor – wäre ja auch zu einfach. Und mitunter, wie in account_history.php, hat man nicht einmal ein $order-Objekt zur Verfügung.
Man muss also gewillt sein, ein bisschen zu suchen. Und man muss wissen, was man tut.

Der +1-Button – die SEO-Revolution

Mit dem internationalen Rollout des +1-Buttons auf Webseiten tauchen auch hier die ersten Anleitungen auf, wie man das ganze beispielsweise in einen xt:Commerce-Shop integrieren kann.

+1 wird die Suche, wie wir sie kennen, revolutionieren. Und mit der Integration in die Google Webmaster Tools geht der Suchgigant gleich noch einen Schritt weiter und bietet eine Auswertung des Buttons in einem seiner Produkte, das jeder Shopbetreiber eh nutzen sollte.

Das ganze lässt sich mit wenigen Handgriffen in den eigenen Shop integrieren. Ich präferiere aber einen Ansatz, der nicht an allen möglichen Stellen im Template {php}-Tags nutzt, daher: In includes/application_bottom.php kurz vor dem schließenden <body>-Tag einfügen:

echo '<script type="text/javascript" src="https://apis.google.com/js/plusone.js">{lang:''.$_SESSION['language_code'].''}</script>';

An der Stelle in der Produktseite, wo der +1-Button erscheinen soll, muss dann nur noch entweder der Button in Googles XML-Syntax oder die HTML5-Variante eingefügt werden (HTML5 empfiehlt sich, wenn man das ganze fehlerfrei durch den Validator bekommen will):

<div class="g-plusone" data-size="medium"></div>

Das ganze kann dann so aussehen:

Produktseite mit +1-Integration

Die Angabe des Zählers kann man sich sparen, wenn man diesen sowieso anzeigen will. Die Angabe der URL kann man sich ebenfalls sparen, wenn man saubere URLs hat oder einen canonical-Tag benutzt. Die Finger lassen sollte man generell von den xt:Commerce eigenen ‘SEO-URLs’ – und damit ist auch die preg_replace()-Geschichte, wie bei Christian vorgeschlagen, vom Tisch. Saubere URLs, z.B. für den canonical-Tag, bekommt man für ein Produkt mittels

xtc_href_link(FILENAME_PRODUCT_INFO, xtc_product_link($product->data["products_id"]))

Wer mit irgendwelchen Umleitungen beispielsweise seiner Produktseiten arbeitet, um auch serverseitig für wirklich kanonische URLs zu sorgen, muss evtl. ein gesondertes Augenmerk auf die Funktion legen, die hier für die Redirects verantwortklich ist. Google überprüft nämlich die URL, indem sie aufgerufen wird. Landet diese Überprüfung in einem Redirect hat man schnell statt des +1-Buttons ein rotes Ausrufezeichen und im Firebug findet sich in der Antwort des entsprechendes Requests:

400 Bad Request: Cannot confirm a connection that was not proposed.

Im Log findet sich zum zugehörigen Request ein Client, der sich als ‘Firefox/1.0.4’ identifiziert. Da dieser in der freien Wildbahn faktisch ausgestorben ist kann man darauf eine mögliche Überprüfung aufbauen.