HSK-Vorlage aus der Olzinger-Website ableiten

Firmendaten durch Platzhalter ersetzt (Mustermann Haustechnik GmbH,
Musterstraße 1, 12345 Musterstadt, 01234 567890, example.com), Design
und Funktionen unverändert.

- Feiertage im Öffnungsstatus per BUNDESLAND (alle 16 Länder) statt fest Bayern
- Datenschutz: Aufsichtsbehörde als TODO je Bundesland
- Skript-Namensraum olz -> hsk, Logo-SVG und OG-Bild neu
- .webklar-preview.json von Olzinger entfernt (sonst Deploy auf olzinger)
- .gitea/template: neue Repos aus der Vorlage erben die Preview-Datei nicht
- README: Anleitung für neue HSK-Seiten, Platzhalter-Tabelle, Checkliste

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

README.md

@@ -1,9 +1,52 @@
-# Olzinger Haustechnik – Website
+# HSK-Vorlage – Website für Heizung · Sanitär · Klima
 
-Maßgeschneiderter Neuauftritt für die **Olzinger GmbH** (Heizung · Sanitär · Lüftung · Regenerative Energien, Ergolding bei Landshut, seit 1985).
+Vorlage für Websites von **HSK-/SHK-Betrieben** (Heizung, Sanitär, Lüftung/Klima, regenerative Energien). Entstanden aus der Website für Olzinger Haustechnik (`WEBklar/Olzinger`). Alle Firmendaten sind hier durch **Platzhalter** ersetzt („Mustermann Haustechnik GmbH“, „Musterstadt“, `example.com`).
 
 Statische Website ohne Build-Schritt: HTML, CSS und JavaScript ohne Bibliotheken, Schrift lokal eingebunden (kein CDN, keine Cookies, kein Tracking).
 
+## Neue HSK-Seite aus der Vorlage anlegen
+
+1. In Gitea bei `WEBklar/HSK-Vorlage` auf **„Diese Vorlage verwenden“** klicken. Besitzer: `WEBklar`, Name: z. B. `Mueller-Haustechnik`. Haken bei **„Git-Inhalt (Standardbranch)“** setzen.
+   - Gitea lässt dabei `.webklar-preview.json` weg (siehe `.gitea/template`). Das neue Repo bekommt also **nicht** die Preview der Vorlage.
+   - Wird stattdessen per `git clone` kopiert: `.webklar-preview.json` **vor dem ersten Push löschen**. Sonst landet die neue Seite auf `hsk-vorlage.project.webklar.com` und überschreibt die Vorlage.
+2. Im WOMS das Projekt dem Ticket bzw. Kunden zuordnen und **„Preview einschalten“** wählen.
+3. Platzhalter ersetzen (Tabelle unten), Texte anpassen und die Checkliste abarbeiten.
+
+## Platzhalter
+
+Am schnellsten per Suchen & Ersetzen über alle Dateien. Danach nach `Mustermann`, `Musterstadt`, `example.com`, `12345`, `01234` und `TODO` suchen. Es darf nichts übrig bleiben.
+
+| Platzhalter | Bedeutung | Vorkommen |
+|---|---|---|
+| `Mustermann Haustechnik GmbH` | Firmenname mit Rechtsform | Footer, Impressum, Datenschutz, 404, Schema.org, `kontakt.php` |
+| `Mustermann Haustechnik` | Kurzname für Titel und Logo-Beschriftung | `<title>`, Open Graph, `site.webmanifest` |
+| `Mustermann` (Logo-Wort) / `Haustechnik` (Zusatz) | Logo-Schriftzug | `logo__word` / `logo__sub` in allen HTML-Dateien, `assets/img/logo.svg` (`MUSTERMANN`), `tools/og-template.html` |
+| `Musterstraße 1`, `12345 Musterstadt` | Anschrift | Hero, Kontakt, Footer, Impressum, Datenschutz, 404, Schema.org, Google-Maps-Link |
+| `Musterstadt und Umgebung` | Einzugsgebiet | Meta-Description, Open Graph, Schema.org (`areaServed`) |
+| `01234 567890` / `+491234567890` | Telefon (Anzeige / `tel:`-Link) | Navigation, Menü, Hero, Kundendienst-Karte, Kontakt, Footer, Impressum, Datenschutz, 404 |
+| `01234 567891` | Fax | Footer, Impressum, Schema.org |
+| `kontakt@example.com` | E-Mail | Kontakt, Karriere-Links, Footer, Impressum, Datenschutz, `kontakt.php`, `assets/js/contact.js` |
+| `www.example.com` | Domain | `canonical`, Open Graph, Schema.org, `sitemap.xml`, `robots.txt`, `kontakt.php`, `tools/og-template.html` |
+| `1990` / `Max Mustermann` | Gründungsjahr / Gründer | Hero, „Über uns“, Chronik, Schema.org, `assets/js/main.js` (`nowYear - 1990`) |
+| `2015` / `Erika Mustermann` | Chronik-Eintrag / Geschäftsführung | Chronik, Impressum, Datenschutz |
+| `Rund 20 Fachleute` / `"value": 20` | Mitarbeiterzahl | „Über uns“, Schema.org |
+| `Amtsgericht Musterstadt`, `HRB 12345` | Handelsregister | Impressum |
+
+## Vor dem Livegang prüfen
+
+- [ ] **Firmendaten** vollständig ersetzt (Suche siehe oben).
+- [ ] **Bundesland** für die Feiertage im Öffnungsstatus: `BUNDESLAND` oben in `assets/js/contact.js` (Standard `BY`). Dazu `addressRegion` in den Schema.org-Daten von `index.html`.
+- [ ] **Öffnungszeiten:** `SCHEDULE` in `assets/js/contact.js`, die Texte in allen HTML-Dateien (Status-Zeile, Kontaktbereich, Footer) und `openingHoursSpecification` in `index.html`.
+- [ ] **Leistungen:** Die 5 Karten, die Formular-Themen und `knowsAbout` (Schema.org) an das Angebot des Betriebs anpassen. Bei weniger Karten den Zähler `/ 5` in `index.html` anpassen.
+- [ ] **Über uns und Karriere:** Chronik, Mitarbeiterzahl, Ausbildungsberufe, Startmonat.
+- [ ] **Impressum:** Geschäftsführung, Registereintrag, Umsatzsteuer-ID und berufsrechtliche Angaben (Kammer, Berufsbezeichnung). Die letzten beiden sind als Kommentar in `impressum.html` vorbereitet.
+- [ ] **Datenschutz:** Hosting-Anbieter, Speicherdauer der Server-Logs, Vertrag zur Auftragsverarbeitung, zuständige Aufsichtsbehörde (Abschnitt 9). Alles als `TODO` markiert. Rechtstexte sind Entwürfe und ersetzen keine Rechtsberatung.
+- [ ] **Formular:** In `kontakt.php` Empfänger/Absender prüfen (`RECIPIENT`, `SENDER`) und einmal testweise absenden.
+- [ ] **Logo und Farben:** Für ein eigenes Logo die Logo-Marke (Thermostat-Bogen, `logo__mark`) in den HTML-Dateien, `assets/img/logo.svg`, die Favicons und `tools/og-template.html` ersetzen. Die Farben stehen als Design-Tokens am Anfang von `assets/css/main.css`.
+- [ ] **Open-Graph-Bild** neu rendern (siehe „Anpassen“). Das Bild enthält Name, Ort und Domain.
+- [ ] `sitemap.xml`: `lastmod` aktualisieren.
+- [ ] Optional: echte Fotos (Team, Projekte, Bäder) ergänzen. Die Illustrationen tragen die Seite auch ohne Fotos.
+
 ## Gestaltungsidee: „Wärmebild“
 
 Haustechnik sieht man nicht – man spürt sie. Deshalb zeigt der Einstieg ein ruhiges, live berechnetes **Wärmebild** (WebGL) mit Isothermen wie bei einer Thermografie-Kamera. Eine langsam wandernde Wärmequelle hält das Bild in Bewegung – ohne Maus- oder Touch-Effekte. Durch die Seite zieht sich das Motiv **warm trifft kalt** (Vorlauf/Rücklauf): Farbverlauf Blau → Magenta → Orange, das Logo als Thermostat-Skala.
@@ -14,11 +57,11 @@ Grundsatz: wenig Text, wenig Bewegung, gut bedienbar am Handy.
 
 | Bereich | Besonderheit |
 |---|---|
-| Hero | Ruhiges WebGL-Wärmebild, Live-Öffnungsstatus (inkl. bayerischer Feiertage), Anfrage- und Telefon-Button |
+| Hero | Ruhiges WebGL-Wärmebild, Live-Öffnungsstatus (inkl. Feiertage des Bundeslands), Anfrage- und Telefon-Button |
 | Leistungen | 5 Karten mit Illustrationen; am Desktop als Kartenstapel, unter 900 px wischbare Karten mit Zähler (1 / 5) und Pfeilen |
 | Energie-Haus | Hausschnitt: Wärmepumpe, Solarthermie, Speicher, Fußbodenheizung, Bad, Lüftung – der gewählte Kreislauf wird hervorgehoben |
 | Heizungs-Finder | 4 Fragen → Empfehlung (Wärmepumpe / Pellets / Hybrid); Ergebnis lässt sich ins Kontaktformular übernehmen |
-| Über uns | Kurze Chronik 1985 → heute |
+| Über uns | Kurze Chronik vom Gründungsjahr bis heute |
 | Karriere | Ausbildung Anlagenmechaniker SHK, Initiativbewerbung |
 | Kontakt | Kontaktkarten, Öffnungszeiten mit „Heute“-Markierung, Formular |
 | Footer | Adresse, Kontakt, Öffnungszeiten, Links |
@@ -44,16 +87,6 @@ Den kompletten Ordnerinhalt auf den Webspace laden (z. B. per FTP). Voraussetzun
 - `404.html` nutzt absolute Pfade (`/assets/...`) – liegt die Seite in einem Unterordner, Pfade dort anpassen.
 - CSS und JS werden eine Woche gecacht. Nach Änderungen an `main.css` oder den Skripten die Versionsnummer `?v=…` in allen HTML-Dateien hochzählen, damit Besucher nicht alte Dateien sehen.
 
-## Vor dem Livegang prüfen (TODO)
-
-Die Firmendaten stammen aus öffentlich zugänglichen Quellen. Bitte bestätigen bzw. ergänzen:
-
-- [ ] **Impressum:** Umsatzsteuer-ID und berufsrechtliche Angaben (Kammer, Berufsbezeichnung) – als Kommentar in `impressum.html` vorbereitet.
-- [ ] **Datenschutz:** Hosting-Anbieter, Speicherdauer der Server-Logs, Vertrag zur Auftragsverarbeitung – als `TODO` in `datenschutz.html` markiert. Rechtstexte sind Entwürfe und ersetzen keine Rechtsberatung.
-- [ ] **Inhalte:** Mitarbeiterzahl (≈ 25), Ausbildungsstart (September), Leistungsliste, Texte zur Karriere.
-- [ ] **Formular:** In `kontakt.php` Empfänger/Absender prüfen (`RECIPIENT`, `SENDER`); einmal testweise absenden.
-- [ ] Optional: echte Fotos (Team, Projekte, Bäder) ergänzen – die Illustrationen sind so gestaltet, dass sie auch ohne Fotos tragen.
-
 ## Struktur
 
 ```
@@ -71,12 +104,14 @@ assets/js/contact.js  Öffnungszeiten live, Feiertage, Kontaktformular
 assets/fonts/         Instrument Sans (OFL, lokal)
 assets/img/           Favicon, Logo, Open-Graph-Bild
 tools/og-template.html  Vorlage zum Neu-Rendern des Open-Graph-Bilds
+.gitea/template       Regeln für „Diese Vorlage verwenden“ (nur in der Vorlage)
 ```
 
 ## Anpassen
 
 - **Farben, Abstände, Schriften:** Design-Tokens am Anfang von `assets/css/main.css` (`--warm`, `--cool`, `--ink`, `--paper` …).
-- **Öffnungszeiten:** in `assets/js/contact.js` (`SCHEDULE`) sowie in `index.html` (Text und Schema.org-Daten).
+- **Öffnungszeiten:** in `assets/js/contact.js` (`SCHEDULE`) sowie in den HTML-Dateien (Text und Schema.org-Daten).
+- **Feiertage:** `BUNDESLAND` in `assets/js/contact.js`. Es zählen nur landesweite Feiertage. Die Ausnahme ist Bayern: Dort zählt Mariä Himmelfahrt mit (gilt in Gemeinden mit überwiegend katholischer Bevölkerung).
 - **Heizungs-Finder:** Gewichtung in `assets/js/finder.js` (`evaluate`), Texte in `TEXTS`.
 - **Open-Graph-Bild:** `tools/og-template.html` im Browser öffnen (über einen lokalen Server) und einen Screenshot mit 1200 × 630 px als `assets/img/og-image.jpg` speichern.