Design

Der nächste Morgen ist da, das Weinfest ist vorbei, Didier und Marlene haben viel fotografiert. Herr Bertrand hat die Website zu seiner Zufriedenheit fertig gestellt und auch schon die PDFs eingebunden.

Die PayPal-Anbindung funktioniert.

Man trifft sich zum Frühstück, und Ruth ist mittlerweile fertig mit dem Template. Sie bringt die fertige Komponente auf einem USB-Stick mit und erzählt eine Stunde lang über ihre Erlebnisse mit dem Template.

16.6.1 Installation des Templates

Herr Bertrand überträgt die Template-Dateien per FTP in das Verzeichnis /httpddocs/ templates/tmpl_bertrand und /httpddocs/templates/tmpl_bertrand_shop. Im Menü Erweiterungen - Templates macht er das neue Template tmpl_bertrand zum Standard (Abbildung 16.60).

Abbildung 16.60: Neues Template im Template-Manager

Das Template tmpl_bertrand_shop ordnet er im Bearbeitungsmodus den Weinseiten zu. Damit ist sichergestellt, dass der Kunde bemerkt, dass er jetzt im Shop-Bereich ist (Abbildung 16.61).

Abbildung 16.61: Spezielles Template für den Shop-Bereich

16.6.2 Das Template

Das Template ist von Ruth nach folgenden Gesichtspunkten gestaltet worden:

Pflege

Da Herr Bertrand die Seite weiter pflegen will, hat sie ein möglichst einfaches und übersichtliches Gestaltungsraster zu Grunde gelegt. Herr Bertrand kann die Bilder im oberen Bereich später leicht durch neue ersetzen.

Layout

Ruth erklärt ihre Arbeit so:

Es gibt viele Wege, eine Website gestalterisch umzusetzen.

Herr Bertrand will Wein verkaufen.

Das bedeutet, sein Template braucht die optische Ausstattung eines traditionellen, qualitätsbewussten Winzers, bei dem man gern guten Wein einkaufen möchte.

Eine High-Tech-Ausstattung im Metallic-Look wäre einfach unpassend, auch wenn sie gerade modern ist.

Nein, in diesem Fall geben Wein, Trauben und Erde der Seite das Look and Feel. Getragen wird dies durch die Farbeinstellungen wie durch das Fotomaterial.

Ein optisches Erscheinungsbild setzt sich aus mehreren wichtigen Elementen zusammen. Zu ihnen gehören: Logo, Farben, Foto- und Grafikstil (mit Grafiken sind alle Bildelemente gemeint, die nicht Fotografien sind, beispielsweise Buttons und Symbole), Schriftarten.

Zusätzlich wirken Raumaufteilung und Proportion.

All das muss auf einer Website zueinander passen, wenn der optische Eindruck stimmig sein soll. Am besten sollte nur eine Schriftart verwendet werden. Mit fetten und kursiven Schnitten der gleichen Schrift kann man sehr gut Unterschiede hervorheben.

Im Bertrand-Template habe ich für die Überschriften nicht eine besonders originelle, sondern eine sehr klassische Schrift gewählt, die einen seriösen Eindruck hinterlässt. Es ist die klassische Times, ähnlich den Überschriften überregionaler Zeitungen. Gestaltung muss nicht immer besonders originell sein, es ist ausreichend, wenn es einfach gut passt.

Ein Porträt

Während des Frühstücks und beim Telefongespräch, als Ruth Herrn Bertrand die CSS-Technik erklärte, hat sie nebenbei ein wenig gezeichnet. Sie schickt ihr Werk per E-Mail an Herrn Bertrand, und der baut es gleich mit in die Bildergalerie ein.

Abbildung 16.62: Herr Bertrand