Zum Inhalt springen
Intern · nicht öffentlich

Designtests

Ablage für Varianten, die wir vergleichen und abstimmen. Diese Seite ist auf „noindex" gesetzt und fliegt vor dem Launch wieder raus.

Test 1

Herzschlaglinie · Variante 1 – Zeichnen + Lichtimpuls

Vorgänger-Version (Stand vor 27.07.). Linie zeichnet sich beim Scroll-Reveal einmal in TÜV-Blau durch, danach alle 4 s ein Lichtimpuls links → rechts mit ~2,5 s Ruhephase dazwischen.

Unsere Dienstleistungen

Alles aus einer Hand.

Arbeitsmedizin, Arbeitssicherheit und mehr – rechtssicher nach ASiG und DGUV Vorschrift 2 für Ihr Unternehmen.

Test 2

Herzschlaglinie · Variante 2 – EKG-Monitor (aktuell live)

Nachbau des Referenz-GIFs in WAZ-Farben. Kurvenband läuft endlos rechts → links, der Schreibkopf (Bernstein) steht fest am rechten Ende und folgt der Kurvenhöhe. Läuft permanent, keine Ruhephase. Periode 2,4 s.

Unsere Dienstleistungen

Alles aus einer Hand.

Arbeitsmedizin, Arbeitssicherheit und mehr – rechtssicher nach ASiG und DGUV Vorschrift 2 für Ihr Unternehmen.

Test 4

Niederlassungen · Variante C – alle Infos in der Karte, kein Accordion

Seit 28.07. live auf niederlassungen.php (hat Variante A ersetzt). Kein Aufklappen mehr, alle Angaben stehen sofort sichtbar in der Karte (Adresse · Sprechzeiten · ÖPNV · Anfahrt & Parken). Pro Karte genau eine Aktion: „Route planen". Vorteil: nichts ist versteckt, alle drei Standorte sind direkt vergleichbar, ein Klick weniger bis zur Route. Inhalte 1:1 aus Variante A übernommen.

3 Standorte im Saarland

Persönlich für Sie vor Ort.

Wählen Sie den Standort in Ihrer Nähe – die Terminvereinbarung läuft für alle drei Niederlassungen zentral über eine Anmeldung.

Test 5

Niederlassungen · Variante A – Karten + gemeinsamer Aufklappbereich (abgelöst)

Der bisherige Stand von niederlassungen.php (bis 28.07.). Pro Karte nur Adresse und ein Button „Anfahrt & Parken"; die Details erscheinen erst nach dem Klick in einem gemeinsamen Bereich unterhalb der Kartenreihe – immer nur ein Standort gleichzeitig. Abgelöst von Variante C (Test 4), weil dort alles sofort sichtbar ist und ein Klick zur Route wegfällt.

3 Standorte im Saarland

Persönlich für Sie vor Ort.

Wählen Sie den Standort in Ihrer Nähe – die Terminvereinbarung läuft für alle drei Niederlassungen zentral über eine Anmeldung.

Saarlouis

Kaiser-Friedrich-Ring 30
66740 Saarlouis

Saarbrücken

Berliner Promenade 12
66111 Saarbrücken

Neunkirchen

Wilhelmstraße 6
66538 Neunkirchen

Standort

Saarlouis

Kaiser-Friedrich-Ring 30
66740 Saarlouis

Route planen
Mit dem Auto & Parken

Vereinzelt am Kaiser-Friedrich-Ring, ansonsten gegen Gebühr – Parkplatz an der Zulassungsstelle (Zufahrt Prof.-Notton-Straße), Parkhaus am Ring oder am Großen Markt.

ÖPNV

Busbahnhof in 5 Minuten fußläufig.

Sprechzeiten

Mo–Fr 8:00–13:15 Uhr

Standort

Saarbrücken

Berliner Promenade 12
66111 Saarbrücken

Route planen
Mit dem Auto & Parken

Gegen Gebühr auf dem Parkplatz Saartoto oder im Q-Park.

ÖPNV

Hauptbahnhof in 10 Minuten fußläufig.

Sprechzeiten

Mo–Fr 8:00–13:15 Uhr

Standort

Neunkirchen

Wilhelmstraße 6
66538 Neunkirchen

Route planen
Mit dem Auto & Parken

Gegen Gebühr entlang der Gasstraße oder in den Parkhäusern der Innenstadt.

ÖPNV

Hauptbahnhof in 10 Minuten fußläufig.

Sprechzeiten

Mo–Fr 8:00–13:15 Uhr

Test 7

Kopfzeile · Logo gestapelt – Text unter dem Zeichen

Der Stand bis 19.08.: ein einziges PNG, Zeichen oben, „Werksarztzentrum Saar GmbH“ und „Ein Unternehmen von TÜV Rheinland“ darunter, 86 px hoch. Zum Vergleich mit der jetzigen Sperrung oben auf dieser Seite. Der Preis: die Kopfzeile wird dadurch 146 statt 108 px hoch, und die zwei Textzeilen sind mit 7,2 px Versalhöhe (86/428 × 36) kaum lesbar – Breite ist im Header knapp, Höhe kostet dagegen jede Seite Platz.

Test 8

Kopfzeile · Logo in Dunkelblau statt Schwarz

Gleicher Aufbau wie auf der Startseite (Signet links, Text rechts) – nur die Farbe ist geändert. Das Schwarz des Logos kommt sonst nirgends auf der Website vor; hier steht stattdessen unser Headline-Dunkelblau #003D66. Die EKG-Linie bleibt unangetastet auf TÜV-Blau #0071B9. Form, Strichstärke und Kantenglättung sind unverändert, weil pixelweise entlang derselben Farbgeraden umgerechnet wurde.

Zum Vergleich dasselbe in Schwarz – das ist der aktuelle Stand der Startseite:

Test 9

Logo als SVG · die EKG-Linie zeichnet sich

Die Bildmarke ist hier Vektor statt PNG – aus dem vorhandenen Bild nachgemessen, nicht neu gestaltet: Buchstaben, Proportionen, Strichbreite und Farben (#000000 / #0071B9) sind unverändert. Animiert wird ausschließlich die blaue Linie: sie zeichnet sich beim Laden von links nach rechts, danach steht das Logo still. Der Endpunkt setzt einen einmaligen, sehr dezenten Doppelschlag. Kein Hover, kein Intervall, kein JavaScript – der Header braucht nur CSS.

Damit man die Animation hier unten überhaupt sieht, wird sie nur auf dieser Testseite beim Hereinscrollen einmal neu angestoßen. Im echten Header ist das nicht nötig – der ist beim Laden sichtbar. Variante A ist seit 20.08. im Header eingebaut – ganz oben auf dieser Seite läuft sie also echt.

1 · In der Kopfzeile – exakt die Sperrung der Startseite – gleiche Klassen, also auch dieselbe Größenstaffel, Textzeilen weiter als PNG. Das ist Variante A in echter Größe, keine eigene Variante – zur Wahl stehen nur A und B:

2 · Variante A – wie von Hand gezeichnet (1,25 s). Dasselbe wie oben in der Kopfzeile, nur groß. Der Strich läuft weich an, ist in der Mitte am schnellsten und gleitet am Endpunkt sanft aus – gemessen schwankt das waagerechte Tempo von 1 bis 2166 Einheiten/s. Dadurch wird das Aufsetzen des Punktes betont.

3 · Variante B – EKG-Monitor (1,25 s). Konstanter Vorschub nach rechts, gemessen 718–724 Einheiten/s, also Verhältnis 1,0:1. Kein An- und kein Auslauf: der Strich startet und stoppt abrupt und läuft dazwischen völlig gleichmäßig – wie ein Messgerät, nicht wie eine Hand. Passt zum animierten EKG in der Dienstleistungen-Section.
Unterschied zu A in Zahlen: für die Zacke brauchen beide praktisch gleich lang (A 262 ms, B 272 ms). A zieht sie früher (368–630 ms), B später und mittiger (495–768 ms).

Bei aktivierter Einstellung „Bewegung reduzieren“ wird nichts animiert: Linie, Punkt und Buchstaben stehen sofort vollständig.

Weitere Testsektionen werden hier unten angehängt.