Referenzen
Sie sind hier: Startseite > Referenzen > DeMaServ
DeMaServ: Labor-Websites
DeMaServ, Dentalmarketing für Zahntechniker und Zahnärzte, 2005.
Kernkompetenz der DeMaServ e.K. von Zahntechnikermeister Hartmut Vach ist erfolgreiches Dentalmarketing für Zahntechniker und Zahnärzte. Für DeMaServ-Kunden wurde auch eine umfangreiche Labor-Website in mehreren Gestaltungsvarianten konzipiert, die über Zähne und Zahnersatz informiert, getrennt nach den Bereichen „Für Patienten“, „Für Zahnärzte“ und „Über das Dentallabor“.
Coporate Design und Texte: ComLog® GmbH, Kiel.
Eine Website – Sechs Varianten
Insgesamt sechs Gestaltungsvarianten stehen zur Auswahl. Diese professionellen Mustervorlagen müssen von den Kunden jedoch nicht bis ins Detail übernommen werden. Durch die Verwendung von Stilvorlagen kann das Design in jeder Gestaltungsvariante entsprechend den individuellen Wünschen der DeMaServ-Kunden weiter modifiziert werden.
Gestaltungsvarianten der DeMaServ-Labor-Websites, 2004.
Zur Internetpräsenz von DeMaServ: Labor-Websites
Planung und Anforderungen
Das Layout der DeMaServ-Labor-Website sollte sich an der Internetpräsenz der Dentallabor Höhne GmbH von DeMaServ-Gründer Hartmut Vach orientieren, die 2002 veröffentlicht wurde. Daneben gab es feste Zielvorgaben, um die neue Website als Marketinginstrument für Kunden einsetzen zu können.
DeMaServ-Labor-Website: Zielvorgaben
- Der Bereich „Für Patienten“ sollte mit allen Inhalten aus der Labor-Höhne-Website weitgehend übernommen werden
- Die Inhalte für den Bereich „Über das Dentallabor“ sollten komplett individualisierbar bleiben
- Das Design der Website sollte vollständig modifizierbar sein
- Einzelansichten der Fotos und die Texte sollten einen rudimentären Schutz vor unerlaubtem Kopieren erhalten
Technik und Design
Die Zielvorgaben waren mit einer technischen Umsetzung analog zur Labor-Höhne-Website nicht zu realisieren. Die 3-spaltige Optik der Labor-Höhne-Website mit Kopfbereich, Navigation, Inhalt und Bildleiste beruht technisch auf verschachtelten Internetseiten (siehe Animation). Beim Öffnen einer Internetseite werden dabei drei Einzelseiten geladen. Links steht die Seite für den Navigationsbereich und den Portalteil des Kopfbereiches, oben rechts die Seite für den allgemeinen Kopfbereich, darunter die Seite mit den eigentlichen Inhalten. Für eine leicht zu modifizierende Internetpräsenz mit über 300 Einzelseiten waren diese „Framesets“ ungeeignet.
Inhalt und Verpackung
Für die Umsetzung der Zielvorgaben musste die DeMaServ-Labor-Website vollständig neu codiert werden. Die größtmögliche Flexibilität bezüglich Farben, Formen und Schriften war nur mit der Technik moderner Webstandards realisierbar. Dabei werden Inhalt (HTML-Text) und Design (Layout, Farben, Schriften) getrennt. Die optische Darstellung der Texte, Überschriften, Hintergrundfarben und Navigationspunkte auf dem Monitor des Nutzers wird von separaten Stilvorlagen bestimmt. Um die gesamte Optik zu ändern, müssen also lediglich die Stilvorlagen bearbeitet werden.
Mehr zu Webstandards unter Menüpunkt „Webdesign“
Aufgaben, Probleme, Lösungen
Die Aufgabe bestand darin, das Layout einer statischen und technisch veralteten Website in ein modernes Design nach geltenden Webstandards zu transformieren. Im Gegensatz zu vielen Projekten, bei denen Gestaltungsfragen bereits vor dem Codieren geklärt werden, musste hier zunächst eine Musterseite mit einem schlichten Design erstellt werden.
Die Problematik in der Umsetzung Anfang 2004 bestand einerseits in meinem noch nicht vollständigen Erfahrungsschatz bezüglich aller Feinheiten in der Erstellung hochkomplexer, standardkonformer Websites, andererseits in der Aufgabe, eine mit Tabellen gestaltete Internetpräsenz nahezu identisch auf einen vollkommen anderen Standard zu übertragen (siehe Abbildung). Das größte Problem stellten dabei die Darstellungsfehler einiger Browser dar. Das Ergebnis war ein an vielen Stellen „aufgeblähter“ Quellcode, der heute für die fehlerbereinigten Browser so nicht mehr nötig gewesen wäre. Dennoch validieren die Seiten nach dem aktuellen Webstandard XHTML 1.0 Strict und sind auch mit zukünftigen Browser-Generationen kompatibel.
DeMaServ-Labor-Websites: Merkmale
Kopierschutz
Sowohl für die Texte als auch für die vergrößerten Fotos wurde ein einfacher Kopierschutz eingerichtet. Durch ein integriertes Skript lässt sich der Textinhalt nicht mit der Maus in der normalen Browseransicht kopieren. Für die Einzelansichten der Bilder wurde über den Fotos eine unsichtbare Ebene angelegt, die ein transparentes Bild enthält. Diese Bilddatei hat im Original eine Größe von nur einem Pixel und wird in der zusätzlichen Ebene auf die volle Größe identisch zur Fotobildgröße skaliert. In der Abbildung ist das 1-Pixel-Bild mit einem roten Rand dargestellt. Diese Bilddatei bleibt also sehr klein und lädt sich beim Aufrufen der Internetseite entsprechend schnell.
Grundsätzlich ist das Internet ein freies Medium. Die Labor-Website stellt den Besuchern jedoch mit hochwertigen Fotos und professionellen Texten der Agentur ComLog® GmbH anspruchsvolle Inhalte zur Verfügung, deren Bereitstellung hohe Kosten verursacht hat. Unter diesem Aspekt wird die Sinnhaftigkeit eines Kopierschutzes verständlich.
Musterseiten und Design-Varianten
Die DeMaServ-Labor-Website bietet dem Kunden eine Musterauswahl in verschiedener Designvarianten. Nahezu jedes Element auf der Website lässt sich durch individuelle Farben, Schriften oder Hintergrundgrafiken modifizieren. Dabei wurde besonders auf eine effiziente und damit kostengünstige Umsetzung der Kundenwünsche geachtet. Das Grundlayout – also die Positionen der Seiteninhalte – blieb nach reiflichen Überlegungen unverändert: Die Komplexität der Inhalte hätte bei zusätzlichen Layoutvarianten ansonsten zu einer unkalkulierbaren Mehrarbeit geführt.
Hintergrundgrafiken
In der Labor-Höhne-Website gab es nicht überall eine Notwendigkeit für erläuterndes Fotomaterial. Um einerseits die Leerräume zu füllen und andererseits das Layout der Seiten zu bewahren, wurden in diesen Bereichen passende, am farbigen Hintergrund angeglichene Grafiken eingebunden.
Für die DeMaServ-Labor-Website musste jedoch gewährleistet sein, dass auch diese farbig angepassten Grafiken ohne großen Aufwand individuell zu modifizieren waren. Wären die Grafiken lediglich für die Mustervorlagen angepasst worden, hätte das für Kunden mit individuellen Farbwünschen hohe Kosten für die Bildverarbeitung verursacht.
Die Lösung bestand in einem ähnlichen Vorgehen wie bei dem oben beschriebenen Kopierschutz für Bilder. Die Hintergrundgrafik wurde zuerst in Schwarz-Weiß abgespeichert. In einer darüberliegenden Ebene wurde zusätzlich eine in identischer Größe skalierte PNG-Datei mit Alpha-Kanal eingebunden. Ein Alpha-Kanal sorgt für eine variable Transparenz. Die PNG-Datei ist also mit einer halbtranspartenten Folie zu vergleichen, die – je nach Stärke der Transparenz – den Hintergrund durchscheinen lässt (siehe Abbildung mit verkleinerter PNG-Grafik). Der Kontrast des Hintergrundbildes wird dabei reduziert, doch gerade dieser Effekt war für die dekorativen Hintergrundgrafiken optimal. Mit dieser Technik war es möglich, in jedem Bereich der Website individuelle Farbanpassungen vorzunehmen, ohne die Schwarz-Weiß-Grafiken verändern zu müssen.
Marketing mit Service: Zahnarzt-Websites
Ein besonderer Service von DeMaServ sind die Zahnarzt-Websites. Die Labore erhalten dadurch ein effektives Marketing-Instrument für ihre eigenen Kunden. Vier verschiedene Websites wurden als festgelegte Mustervorlagen mit Platzhalterbildern und Blindtext gestaltet. Die Zahnarztpraxen müssen lediglich die konkreten Inhalte liefern und können sich anschließend im Internet anspruchsvoll mit allen wichtigen Informationen präsentieren. Die Zahnarzt-Websites entsprechen den geltenden Webstandards und wurden barrierearm umgesetzt.
Gestaltungsvarianten der DeMaServ-Zahnarzt-Websites, 2004.