BERLIN · MO–FR 9–18 UHR LOKAL/--:--:-- · WEBSITE-CHECK IN UNTER 60 SEKUNDEN
Case 003 · Demo-Projekt Tragwerk

Eine Seite. Sechs Fassungen.

Wer eine Physiotherapie sucht, sucht nie „Physiotherapie“. Er sucht wegen seiner Schulter. Also fragt diese Seite gleich am Anfang, wo es weh tut, und stellt sich darunter auf die Antwort ein. Sechs Beschwerdebilder, sechs Fassungen derselben Seite. Ausprobieren geht sofort, das Fenster unten ist die echte Website.

Die Demophysiotherapie-tragwerk.pages.dev

Wähl eine Beschwerde. Dann scroll weiter.

Im Fenster steht die Seite live. Gleich unter der ersten Ansicht liegen sechs Felder von Nacken bis Schwellung. Klick eines an und lies weiter: der Ablauf, die Leistungen und die Terminstrecke reden ab da über genau diese Beschwerde. Oben rechts kannst du auf Tablet und iPhone umschalten.

https://physiotherapie-tragwerk.pages.dev
// Kein Screenshot: Das ist die echte Website, live im Fenster. Zum Weiterlesen einfach neben dem Fenster weiterscrollen.
  • Öffnet im neuen Tab
  • Praxis erfunden, Website echt
  • Alles selbst gebaut, kein Baukasten
Die MechanikWarum das funktioniert

Die Frage steht da, wo der Daumen stoppt.

Der übliche Weg wäre ein Menü mit sechs Unterseiten. Sechs Seiten heißen: fünf Klicks ins Leere und fünf Seiten, die niemand pflegt. Hier bleibt es eine Seite, die sich anpasst.

Was passiert, wenn jemand ein Feld antippt

6 Beschwerdebilder · 18 CSS-Regeln
Die Auswahl sitzt an der Falz

Nicht ganz oben und nicht weit unten, sondern genau an der Kante, an der die erste Bildschirmfüllung endet. Dort ist sie beides: ein Grund weiterzuscrollen und die Belohnung dafür. Auf dem iPhone liegen die sechs Felder in der Daumenzone, nicht am oberen Rand.

Vier Stellen ändern sich, nicht eine

Die Antwort direkt daneben, der Prüfschritt im Ablauf, die Markierung an den passenden Leistungen und die Zusammenfassung über dem Formular. Wer „Rücken“ wählt, liest ab da über Hüftbeweglichkeit und Gangbild statt über Kiefergelenk und Schulterblätter.

Ohne JavaScript

Die Anpassung macht das Stylesheet, nicht ein Skript. Getestet nicht durch Hinsehen: das Auswahlfeld wurde ohne jedes Klick-Ereignis gesetzt, also so, dass kein Skript etwas mitbekommen kann. Die Seite hat sich trotzdem umgestellt.

Die Auswahl ist schon Schritt 1

Was oben gewählt wurde, steht unten im Terminformular drin. Niemand beantwortet dieselbe Frage zweimal. Für Besucher ohne JavaScript liegt das Formular am Stück statt in Schritten, und daneben steht die Telefonnummer.

// Ehrlich gesagt: Die Praxis ist erfunden, damit ich zeigen kann, wie ich arbeite. Website, Mechanik und alle Zahlen unten sind echt und selbst nachmessbar.
EckdatenGemessen am 06.08.2026

Echte Zahlen, keine Behauptungen.

Jeden Wert kannst du selbst nachprüfen: Live-Demo öffnen, Rechtsklick, „Untersuchen“, Reiter „Netzwerkanalyse“, neu laden. Genau so ein Protokoll gehört bei mir zu jeder Abnahme.

6Beschwerdebildervon Nacken bis Schwellung, jedes ändert die Seite darunter
18CSS-Regelnsteuern die Anpassung, ohne eine einzige Zeile JavaScript
165 KBErster AufrufSeite, vier Schriftschnitte und das erste Foto zusammen
18,9 KBDie Seite selbstHTML, das komplette Design und alles JavaScript in einer Datei
111 KBSchriftenvier Schnitte, von 321 KB auf die wirklich benutzten Zeichen verkleinert
0Fremde Serverbeim Seitenaufruf wird kein einziger Drittserver kontaktiert
0Cookiesdeshalb braucht die Seite auch kein Cookie-Banner
0 €/MonatHostingCloudflare Pages; laufend kostet nur die Domain, ca. 10 € im Jahr

// Gemessen am 06.08.2026 an der Live-Demo, im Browser über die Netzwerkanalyse. Die 6 Dateien beim ersten Aufruf sind: die Seite, vier Schriften, ein Foto.

Der UmfangZum Abhaken

Was in so einem Projekt steckt.

Kein Fachchinesisch: Das hier bekommst du bei jedem Projekt. Und bei TRAGWERK kannst du jeden Punkt live nachprüfen.

Seite, die auf den Besucher eingehteine Auswahl oben, und der Rest der Seite redet über sein Anliegen
6 Fassungen
Terminstrecke in Schritteneine Frage pro Schritt statt einem Formular, das erschlägt
5 Schritte
Funktioniert ohne JavaScriptAnpassung, Inhalt und Formular bleiben da, auch wenn Skripte blockiert sind
geprüft
BarrierefreiheitKontraste gerechnet statt geschätzt, per Tastatur bedienbar, Bewegung abschaltbar
WCAG 2.1 AA
Fotos in drei Formatender Browser nimmt das kleinste, das er versteht, passend zur Bildschirmbreite
AVIF · WebP · JPG
Schriften selbst gehostetkeine Google-Fonts, also keine Verbindung zu fremden Servern und kein Datenschutzproblem
111 KB statt 321
Kein Cookie-Banner nötigkeine Cookies, keine fremden Server, nichts nervt deine Besucher
0 Cookies
Formular mit Spam-Schutzunsichtbar für Besucher, ohne Google-Rätselklickerei
eingebaut
Rechtstexte und FehlerseiteImpressum, Datenschutz und eine 404, die zurück in die Seite führt
4 Seiten
Hosting fertig eingerichtetkein Abo, keine Wartung, laufend kostet nur die Domain
0 €/Monat
Bei deinem Projekt: alles inklusive ab 790 €

// Warum die Demo nicht bei Google auftaucht: bewusst ausgeschlossen, damit eine erfundene Praxis niemandem in den Suchergebnissen begegnet und nicht gegen echte Kundenseiten rankt. Bei deinem Projekt: eigene Domain, Indexierung an.

Nächster Schritt

Dein Projekt läuft genauso ab.

Gleicher Prozess, gleiche Prüfungen, nur eben für dein Unternehmen. Der Website-Check deiner aktuellen Seite ist der erste Schritt.

  • Kostenlos & unverbindlich
  • Antwort in 2 Arbeitstagen
  • Festpreis ab 790 €