MTS Henri Meder Transporte

Müllheim-Niederweiler · Seit Jahren im Markgräflerland

Dein Umzug,
Schritt für Schritt geplant.

Wir kommen vorbei, schauen uns an, was mit muss, und du bekommst einen Festpreis — bevor irgendwas eingepackt wird.

  • 01Termin
  • 02Besichtigung
  • 03Festpreis

Anfrage starten

Deine Angaben nutzen wir nur, um dir ein Angebot zu machen.

Signature-Motiv

«Der Laufzettel»

Die nummerierte Positionszeile — Nummer, Bezeichnung, rechtsbündiger Wert, getrennt durch 1px-Hairlines — ist Layout, Navigation, Preistabelle und Formular zugleich. Der 4px-Marker in Orange markiert genau eine aktive Zeile.

Leistungen als Positionsliste

Fahr mit der Maus über eine Zeile — der Marker erscheint in 140 ms.

Öffnungszeiten mit tnum-Werten

  • 01Montag08:30 – 17:00
  • 02Dienstag08:30 – 17:00
  • 03Mittwoch08:30 – 17:00
  • 04Donnerstag08:30 – 17:00
  • 05Freitag08:30 – 17:00
  • 06Samstag / Sonntaggeschlossen

Der Marker steht auf genau einem Tag: heute.

Sektion 2

Farben & Rollen

Alle Werte gemessen aus dem Logo. Kein Hex ist erfunden, keine Abstufung gemischt — Zwischentöne kommen aus den 12er-Skalen.

paper
#fcf6f2 · --brand-surface
Grundfläche der ganzen Seite. Mindestens 70 % aller Flächen.
ink/surface 15.29 ✓AAA
paper-alt
#f9ece4 · --brand-surface-alt
Nur zwei Bänder pro Seite: «Ablauf» und «Öffnungszeiten».
ink/surface_alt 14.15 ✓AAA
ink
#261e19 · --brand-ink
Aller Fliesstext, alle Tabellenwerte, alle Fehlertexte.
15.29 auf paper ✓AAA
ink-soft
#5f5651 · --brand-ink-soft
Labels, Captions, Einheiten, Platzhalter. Nie für Absätze über 3 Zeilen.
6.68 ✓AA (nicht AAA)
navy
#244373 · --brand-secondary
Alle Überschriften, Icon-Striche, Focus-Rahmen, der einzige gefüllte Button.
secondary/surface 9.22 ✓AAA · weiss darauf 9.88 ✓AAA
marker
#e4832f · --brand-primary
Nie Fläche, nie Text. Nur 4px-Marker, 32px-Ziffernkreis und 2px-Knicklinie.
primary/surface 2.58 ✗ · weiss auf primary 2.77 ✗ — als Text verboten
marker-deep
#d7771e · --brand-accent
Hover des Markers und der Knicklinie. Ebenfalls nie Text.
nicht gemessen — nie als Text
hairline
#d3cdc8 · --brand-border
Die einzige Trennung im System: 1px. Ersetzt jeden Karten-Schatten.
dekorativ
navy-press
#1a3867 · --brand-secondary-12
Hover/Active von Navy-Buttons und -Links. Nie als Sektionsfläche.
dunkler als 9.22 · nur Hover

12er-Skalen — die einzige Quelle für Abstufungen

primary 1 → 12

secondary 1 → 12

gray 1 → 12

Sektion 3

Zilla Slab & Work Sans

Die geraden, kastigen Serifen antworten auf die glatt abgeschnittenen Endungen der Logo-Grotesk. Zwei Gewichte pro Font — Weight 700 existiert in diesem System nicht.

display-heroZilla Slab 500 · 64/48/36px · 1.06 · -0.02em
Dein Umzug, geplant.
display-1Zilla Slab 500 · 40/34/28px · 1.14 · -0.015em
Ablauf in vier Schritten
display-2Zilla Slab 600 · 30/26/24px · 1.18 · -0.01em
Räumung & Entsorgung
heading-3Zilla Slab 600 · 22/20/19px · 1.25
Was mit muss, kommt auf den Zettel
leadWork Sans 400 · 20/19/18px · 1.55
Wir kommen vorbei, schauen uns an, was mit muss, und du bekommst einen Festpreis.
bodyWork Sans 400 · 17/17/16px · 1.60

Henri Meder fährt selbst zur Besichtigung, geht Zimmer für Zimmer durch und schreibt auf, was transportiert, montiert oder entsorgt werden muss. Daraus wird der Preis — vorher, nicht nachher.

tabularWork Sans 500 · 16px · 1.40 · tnum
08:30 – 17:00 · 79379 · +49 7631 7401280
labelWork Sans 500 · 14px · +0.01em
Wunschtermin optional
captionWork Sans 400 · 13px · 1.50
Kartons im Treppenhaus, Müllheim-Niederweiler.
eyebrowWork Sans 600 · 12px · +0.05em · uppercase
Müllheim-Niederweiler · Markgräflerland
microWork Sans 400 · 11px · 1.50
Deine Angaben nutzen wir nur, um dir ein Angebot zu machen.

Sektion 4

Komponenten & Zustände

Hover und Fokus sind hier echt — fahr drüber, klicke, tabbe durch. Radius 2px, keine Elevation, ein gefüllter Button pro Band.

Buttons

Alle Leistungen

primary: #244373 → hover #1a3867 → active translateY(1px), 80 ms · secondary: kein Flächenwechsel beim Hover, stattdessen inset-Ring (liest als 2px) · focus-visible überall: 2px #261e19, offset 2px.

Eingabefelder — alle Zustände

Feldhöhe 48px (Touch-Target ≥ 44px). Pflichtfelder tragen das Wort «Pflicht», kein Sternchen. Fehlertext bleibt ink — Farbe trägt nie allein die Bedeutung.

Block · Kundenstimme

«Schnell, zuverlässig, familiär. Eine Spedition wie man sie sich wünscht.»

Werner B. · Google-Bewertung, 2019

Block · Beweis-Tabelle (Slots)

  • 01Anfahrt Müllheim & Umgebunginklusive
  • 02Rückmeldung auf Anfragen1 Werktag
  • 03Festpreis nach Besichtigungverbindlich

Preisbeispiele, Umzugszahl und Versicherungssumme sind offene Content-Slots — sie werden nicht erfunden.

Sektion 10

Bildsprache

Ein Foto pro Seite, 4:3, unbeschnitten, ohne Rahmen und ohne Schatten — direkt auf dem Papier. Warm entsättigte Neutrale, genau ein orangefarbener Gegenstand als Echo auf den Marker.

Moodboard: Umzugskartons, Packband und ein handschriftlicher Laufzettel auf warmem Papierton
Moodboard — ruhig, geordnet, handfest. Kein Text im Bild, keine Stock-Anmutung, kein Türkis.

Kurz entschlossen?

Ruf einfach an.

+49 7631 7401280 · Mo–Fr 08:30–17:00 Uhr

Die einzige dunkle Fläche der Seite — Dunkelanteil-Ziel 18 %. Weiss auf Navy: 9.88 ✓AAA.

Do

Was das System trägt

  • Genau ein gefüllter Button pro Sektionsband — navy auf Papier.
  • Trennung ausschliesslich mit 1px #d3cdc8. Kein Schatten auf Karten.
  • Jede wertetragende Zahl mit tnum.
  • Jede Sektion beginnt mit einer eyebrow-Zeile.
  • 72px Sektionsabstand, zweimal 112px als Atempause.
  • Zahlen statt Adjektive: Uhrzeit, Ort, Werktag.

Don't

Was die Marke verwässert

  • Orange als Fläche oder als Text — 2.77 bzw. 2.58, in jeder Grösse verboten.
  • Vollbild-Hero, Foto hinter Text, Farbverlauf.
  • Icon-Grid, gleichförmiger Sektionsstapel, mehr als ein 3-Spalten-Grid.
  • Radius über 2px, Pill-Buttons, Elevation auf Karten.
  • Mehr als ein Pfeil pro Seite — der Knick ist einmalig.
  • Weight 700, Kursive, Ausrufezeichen, Englisch als Schmuck.