Templaterie Blog

Mathew James Taylor zählt zu den Predigern des all liquid und hat einen Beitrag herausgebracht, wie er meint, dass man A List Apart verbessern sollte. Doch das Mockup ist eine klare Verschlechterung des Designs von A list apart. Mathew James Taylor berücksichtigt nicht, dass es Menschen gibt, die auch bei hohen Auflösungen mit vollem Fenster surfen und die Zeilenlänge dann die Lesbarkeit erheblich beeinträchtigen.

A List apart hat diesen Umstand berücksichtigt und deren Entscheidungen schlüssig und sinnvoll begründet. (Ala4.0)

Mag sein, dass man den Aufbau noch elegnater hinbekommt und den einen oder anderne Hack vermeiden könnte, doch da häng ich mich dann nicht rein. Schließlich ist jede Seite immer nur so gut, wie es die Zeit, in der sie erstellt wurde, zulässt. Ich sage nur Panta rei oder so.

Filed under: Design, Projektplanung
No Comments

Darüber nachgedacht hat der Blogger auf Tordox.org: Seitennavigation in Weblogs,

via Peter Kröner

Randbemerkung: ganz wenig geschrieben. Zu lesen ist da dennoch viel.

Filed under: Projektplanung
No Comments

Es tut gut, wenn man seine unwissenschaftliche, gefühlte Expertenmeinung durch Feldversuche bestätigt sieht:

Unser interface ingeneering: The Truth About Download Time

Anhand meines eigenen Surfverhaltens, bei dem ich sehr häufig die Geduld aufbringe auch einmal länger auf eine Site zu warten, nahm ich noch nie die 8 Sekunden-Regel so genau. (more…)

Filed under: Projektplanung
No Comments

Häufig behandle ich Formulare Stiefmütterlich und belasse diese in welchem Design auch immer der Browser die verschiedenen Elemente darstellt. Entsprechend schwach ausgeprägt ist mein Wissen über die Möglichkeiten. Ich gehe in Bezug auf die stiefmütterlich behandelten Formularen mit einem großen Prozentsatz meiner Kunden konform. Hier und da aber gönne ich mir auch in Bezug auf Formulare die Extrameile.

Es wurde Zeit mich einmal wieder zu informieren, was in Bezug auf Formulare im Netz schon vorhanden ist:

1. Roger Johansson hat in seinem Blog 456 Berea^St im Beitrag Styling form controls with CSS, revisited das für mich umfassenste und aufschlußreichste beigetragen, um eigenständig sich an die Gestaltung des Formulars zu machen. Auch was die verschiedenen Optionen anbelangt, arbeitet man an Templates und nicht an einem konkreten Projekt, bei dem zunächst nur ausgearbeitet werden muss, was in den Projekt genutzt wird.
2. Stu Nichols hat in seinem CSS-Playground einen Mini-Formular-Zengarden eingerichtet: A form with style
3. Cameron Adams zeigt mit seinem Blue Man was Formulare können, wenn man Sie nicht in ein Tabellen-Korsett zwingt: Form layout templates
4. Einen mehr als Berechtigten Rant bezüglich der Art und Weise wie Formulare in Browser integriert wurden, wie unflexible und inkongruent diese sich in den verschiedenen Browsern geben, schrieb Erich Meyer in einem lesenswerten Beitrag: Formal Weirdness.
5. Und damit folgt Lucian Slatineanu vom badboy mit seinem Beitrag Nice Forms, da er mit seinem Javaskript die festen Browservorgaben umschifft, die die Gestaltung von Formularen so frustrierend macht.
6. Um sich Arbeit zu sparen kann man entweder Stu Nichols Vorlage verwenden oder aber dieses Form-Template um anschließend seine eigenen CSS-Eigenschaften zur Gestaltung des Formulares zu vergeben. Prabhath Sirisena auf Nidahas zu Formularen liefert an folgender Stelle das Form Template. Es lebe die Bequemlichkeit.

Es gibt noch viel weitere Beiträge, die man als Anregung für die eigene Gestaltung heranziehen kann: ALA: Prettier Accessible Forms, Veerle: Styling forms in CSS, Picment: Fun with forms — customized input elements, Mezzoblu zu Labeling Formfield, Chris Ramakers, skyrocket concepts: semantisch korrekte horizontale Formulare step 1 – 2 – 3, Malarkey: optionale Formularbereiche ausblenden, Brand spanking New: AutoSuggest: An AJAX auto-complete text field, Live-validation und das Formular spricht mit dem User. Urputzig!, Nicholas Rougeux, C82, Scrollende Checklisten als alternative zu Selectfeldern, Formassembly mit einer ganzen Sammlung von gestylten Formular-Templates (Unter der Haube im Formgarden sieht’s trübe aus. Die Lektion zum Thema “Inline- und Blockelemente” wurde noch nicht durchgenommen.), …

Datenblatt-Formular das aussieht wie ein Datenblatt für Webapplikationen, in denen zum Beispiel ein Tutor, Sachverstädniger oder Vorgsetzter seine Bewertungen zur Übergabe an die Datenbank einträgt.

… es gibt sicherlich noch mehr und wer eine Adresse kennt, die hier unbedingt noch fehlt, die Kommentare sind offen.

Filed under: Design, Projektplanung
2 Comments

Alright you Nielsenites you, that didn’t go quite like I expected. It’s probably my fault for calling it ‘Best Practices’ in the first place — what we’re looking to create is more a crib sheet of practical advice, something for reference when a designer gets stuck while using CSS specifically. [...] While nobody wants a blue, underlined link world, and we’ll be debating for ages the best way to size fonts, this is what I was getting at: “a CSS Best Practice is a one sentence action statement, a ‘thou shalt’ or ‘thou shalt not’ (paraphrased, of course) that highlights a specific issue, be it browser compatibility, code integrity, or whatever else can actually be considered factual (instead of opinion).”

Beachtenswerte Quelle: Mezzoblue: CSS Crib Sheet?

Die in meine Augen sehr sinnvollen Gebote für Webdesigner in dem was nach dem Zitat folgen, wurden von vier recht guten Ratschlägen in einem Beitrag unter der Bezeichnung “Best Practice“

Zu den blauen unterstrichenen Links kann ich nur sagen, wenn ich nur blau unterstrichene Links kenne, dann kann ich keinen Sinn für alternative entwickeln. Ich lebe dann in einer triesten grauen Welt voller Uniformen und einem verkümmerten Sinn für die Abenteuer und den Spaß am Entdecken. Diese “Don’t make me think!”-Regel ist eine Regel der Monopolisten, der totalitären Caesaren, das ist Panem et Circensis um möglichst bequem und möglichst effektiv den letzten Penny aus dem Volk zu quetschen. Don’t make me think erstickt Kreativität und damit Individualismus. Individualismus setzt voraus, dass man sich mit den Besonderheiten eines Individuums auseinandersetzt. Ich schweife ab …

So! Das nur kurz zwischenrein notiert. Parallel habe ich einen anderen Beitrag zum Thema Formulare in Arbeit in einem der nun 46 offen Registern in zwei Browsern (opera + ff) und kehre zu diesem zurück. Schließlich wollen die 46 Fenster geschlossen werden. Die beiden Offtopic-Fenster können damit zugemacht werden. womit es nur noch 44 offene Fenster sind. wird sich in der nächsten halben Stunde oder vollen Stunde noch ein paar Mal ändern.

Filed under: Projektplanung
No Comments

Was macht gutes Webdesign aus?

Es gibt viele Elemente, die ein gutes Design von einem schlechten Design unterscheiden. Gutes Webdesign …

1. … berücksichtigt den Browser des Betrachters.
   • typische Browserfenstergrößen
   • typische Browsertypen
   • typische Browsergenerationen

   oder anders ausgedrückt: validen, flexiblen Quelltext, der sich weit möglichst der Umgebung anpasst und dabei …

2. … berücktsichtigt die Auffassungsgabe des Betrachters.
   • Lesefreundlichkeit: Zeichenmenge in einer Zeile (55 bis max. 75 Zeichen)
   • Orientierung: Linienführung, Positionierung und Prioritäten
   • Aufnahmefähigkeit: Informationsmenge, Konzentration, Clustergestaltung

   oder anders augedrückt: ergonomische Gestaltungsprinzipien in der Praxis.

3. … berücksichtigt die Ziele des Anbieters.
   • Werterwartung: Positionierung am Markt
   • Wiedererkennung: Einmaligkeit und Identifizierung am Markt
   • Filterfunktion: Attraktion der gewünschten Zielgruppe

   oder anders ausgedrückt: das Erscheinungsbild repräsentiert den Anbieter und des Kunden.

Gutes Webdesign ist die Balance zwischen Mensch und Technik und Mensch und Markt.

Letzteres klingt wie ein Kalenderspruch und das Problem ist, dass vieles, was für den einen richtig ist, ist für den anderen falsch. Webdesign ist ein Entwicklungsprozess. Ein Entwicklungsprozess, der nicht auf Bestehendem aufbauen kann, ist jedoch zu teuer und ineffektiv. Templates zu verwenden und ermöglicht einen Entwicklungsprozess, der die Evolution zu einer guten Website möglich macht und effektiv.

Was macht ein gutes Templatesystem aus?

Ein gutes Templatesystem ist eine Matrix, die sich den Zielen einer guten Website unterwirft, ihr semantisch wie strukturell ein Raster und einen Rahmen bietet, der offen ist für neue Schnittstellen und Schnittstellen für unterschiedliche Benutzer anbietet. Benutzer, die die Inhalte pflegen benötigen andere Befähigungen als der Programmierer und der Designer. Ein gutes Templatesystem kann diese unterschiedlichen Akteure zu einer guten Website so trennen, das diese zusammenarbeiten können ohne sich in die Quere zu kommen und deren Befähigungen zu lernen.

Bemerkung am Rande: der Grund, weil ich Editland so liebe und Templates und Plugins für dieses MiniCMS in der Templaterie anbiete.

Filed under: Design, Projektplanung
No Comments

Die große Frage im Online-Handel zu Umsatzsteuer und den Versandkosten:
Ist die Angabe transparent und hinreichend?

Er hat jedoch der Auffassung der Vorinstanzen widersprochen, die Preisangabenverordnung nötige dazu, die zusätzlichen Hinweise auf die Umsatzsteuer und die Liefer- und Versandkosten auf derselben Internetseite zu geben, auf der die Ware angeboten und der Preis genannt werde. Dem Internetnutzer sei bekannt, dass im Versandhandel neben dem Endpreis üblicherweise Liefer- und Versandkosten anfielen. Er gehe auch als selbstverständlich davon aus, dass die angegebenen Preise die Umsatzsteuer enthielten. Es genüge daher, wenn die fraglichen Informationen alsbald sowie leicht erkennbar und gut wahrnehmbar auf einer gesonderten Seite gegeben würden, die der Internetnutzer bei näherer Befassung mit dem Angebot noch vor Einleitung des Bestellvorgangs aufrufen müsse.

Quelle: Pressestelle des Bundesgerichteshofes

Die Frage stellt sich Kunden und potentiellen Kunden auch bei Onlineshop Tiacquisa?

Ja, Tiacquisa erfüllt die Anforderungen an einen Shop gemäß den Richtlinien des Gesetzgebers. Der Shopbetreiber ist jedoch eigenverantwortlich diese zu implementieren. Tiacquisa kann international eingesetzt werden und hat daher keine Routinen, die zur Einhaltung des deutschen Handelsrechts in bezug auf Versandhandel und Onlineshops.

Tiacquisa bietet hinreichend Möglichkeiten den Kunden über alles zu informieren. Es steht dem Shopanbieter der sich für Tiacquisa entscheidet frei, wie er dies gestalten möchte. Die Kombination von MiniCMS und MiniShop mit Bausteinen für statische Inhalte, die auf allen Seiten des Templates erscheinen und frei editierbar sind lassen Raum für Angaben oder einen Link. Grundsätzlich sind dem Kunden Versandkosten vor der Angabe der Adresse, ergo der Notwendigkeit der Abgabe persönlicher Angaben, bekannt. Da Versandkosten nicht selten in direktem Bezug zur bestellten Ware stehen, macht es durch aus Sinn diese Versandkosten mit dem Warenkorb zu kombinieren und nicht dem Kunden ein Formblatt um die Ohren zu hauen, bei dem der potentielle Besteller sich die Versandkosten für die unterschiedlichen Fälle zusammenreimen muss.

Filed under: Projektplanung, Webmarketing
No Comments

Als ich damals von der Hauptschule in das Aufbaugymnasium wechselte, rutschte mein Notendurchschnitt in fast allen Fächern ab, bis auf eines Mathematik. Was mich in der Grund- und Hauptschule meinen Mathematik-Notendurchschnitt immer wieder drückte war Kopfrechnen. Erst im Gymnasium war das kein Thema mehr. Ich bin bis heute eine schlechte Kopfrechnerin, aber Algebra beschäftigte sich mit Buchstabenlogik. Kenne ich eine Formel, kenne ich alle ihre Abwandlungen und es ist ein leichtes die Formel so umzustellen, dass der gesuchte fehlende Wert ermittelt werden kann. Meine Schulfreundin hat dieses System nie begriffen und behalf sich mit dem Auswendiglernen aller möglichen Varianten, die ich ihr lieferte. Dort wo sie in Sprachen brillierte war ich hilflos verloren und wo ich in Mathematik vorbreschte, war sie es.

Heute wurde ich an diese Tage des gemeinsamen Lernens erinnert. Ein Kunde hatte sich hoffnungslos in der Versionsverwaltung verloren. Er hatte jeweils die gesamte Installation samt Text-Inhalte je Kunde geführt und hatte nun Mühe nachzuvollziehen, wo das alte und wo das neue CMS verwendet wurde. Er nahm automatisch an, dass ich dieselben Probleme hätte. Das Problem taucht bei mir nicht auf, denn sobald ich das CMS, seine Inhalte, Module und Templates sauber getrennt halte, kann ich mit wenigen Handgriffen immer das Updaten, was ein Update benötigt.

Es ist wie Algebra. Es ist das zugrundeliegende System mit seinen Schnittstellen, Strukturen und Ausnahmen, nicht deren Varianten uns Ausprägungen im Gesamten, die mich interessieren und die ich verwalte. Es macht das Leben so viel einfacher.

Filed under: Projektplanung
No Comments

Keep it simple! Wenn man Warenkorbdaten und Adressdaten nicht in einem langen Formular sammeln will, kann man dies auch trennen. Da Versanddaten und Versandkostenberechnung eng verknüpft sind, macht es Sinn die Versandkosten ein Stückweit vom Warenkorb zu separieren. Nun verlangt der Gesetzgeber transparenz bei den Angaben der Kosten. Es genügt also nicht, irgendwo darauf hinzuweisen, dass noch Versandkosten mit dem Betrag XY hinzukommen. Teure komplex geschriebene Shops haben hier mit Datenbanken und Schnickschnack meist auch keine besseren Lösungen als das was im letzten Post dargestellt ist. Das einfachste ist also nach dem Warenkorb Liefer- / Rechnugnsanschrift und Zahlungsbedingungen zu erfassen und im Anschluß noch einmal alle Daten in einer Seite darzustellen, die z.B. wie eine Rechung (Lieferschein) gestaltet sein kann, bei der der Kunde nun nur noch bestätigt, dass die Angaben stimmen und die AGB akzeptiert werden und der letzte Knopf ist dann die Bestellung. An dieser Stelle kann sich der Kunde die Daten auch noch einmal ausdrucken, sollte er probleme mit seinem E-Mailfach haben, wird er für diese Option dankbar sein.

Mit dieser getrennten Lösung sollte auch die Verwaltung der Daten im Zusammenhang mit der Ausgabe einfacher sein, denn man kann so leichter die Module der Zwischenspeicherung, Berechnung und Auswertung sowie der Ausgabe in einzelne fast eigenständige Programmteile unterteilen.

Filed under: Programmierung, Projektplanung
2 Comments

Transportbedingungen

1. Maße und Gewichte
   Unser Shop sammelt diese Informationen nicht, doch er kann einzelnen Artikeln einen Versandkostenaufschlag zuweisen.
2. Artikel die keine Versandkosten produzieren
3. Versandwege
4. Versandmenge (Anzahl der Artikel)
5. Aufrtagsvolumen

Wo und wann werden diese Versandkosten gesammelt?

1. Direkt beim Artikel (Punkt 1 und 2 s.o.)
2. Am Ende der Bestellliste (Restlichen Punkte)

Wie wirken sich die Faktoren auf die Versandkosten aus?
Welche Fälle gilt es zu unterscheiden?

Zunächst einmal betrachten wir die Fallunterscheidungen:

Unterschieden werden muss auch noch ob bei Aufschlag noch weitere Informationen eingeholt werden müssen.

Anschließend heißt es die Fallunterscheidungen abzuarbeiten. Das einfachste ist es mit dem Sonderfall keine Versandkosten anzufangen, denn dann kann man sich alles Rechnen sparen. Anschließend prüft man ob die Bedingungen für die Basiskosten gegeben sind und wenn hier keine Sonderfälle also Aufschläge vorliegen, kann man die Basiskosten ausgeben und dem Bestellwert addieren und schließlich gilt es die Sonderfälle mit den Aufschlägen abzuarbeiten:

Bei den Aufschläge gilt es zu unterscheiden zwischen einem Aufpreis, der den bisherigen Kosten zugeschlagen also addiert wird, einem Faktor, über den die bisher ermittelten Versandkosten sich erhöhen und einem Versandkostenbetrag, der den ermittelten Betrag ersetzt.

Den Versandradius könnte mit einem Faktor vernünftig abgedeckt werden. Artikelmengen hingegen dürften Addition oder Ersetzen sinnvoll erscheinen lassen. Eine Möglichkeit hier dem Shopbetreiber die Entscheidung zu überlassen ist es, lediglich den Rahmen vorzugeben und die Bezeichungen der Umgang mit den ermittelten Versandkosten dem Shopbetreiber zu überlassen, so wie das z.B. beim cpFormhandler in Bezug auf Formulare gelöst ist. Damit hat man die größtmögliche Flexibilität und die zig verschiedenen Sonderfälle mit denen unterschiedliche Händler mit unterschiedlichen Warensortimenten mit einem Schlag abgedeckt.

Zu Unterscheiden ist auch, ob noch Informationen eingeholt werden müssen. Glücklicher Weise kommen hier nur drei Formular-Varainten in Frage: Selektfelder, Radiobutton oder Checkboxen und man kann sich überlegen hier die Auswahl gurndsätzlich noch einzuschränken.

Filed under: Programmierung, Projektplanung
No Comments