i18n: Onepager automatisch deutsch/englisch je nach Browser-Sprache #1

Open
opened 2026-04-01 10:25:55 +00:00 by mAi · 2 comments

Ziel

Alle Onepager-Sites sollen je nach Browser-Sprache (navigator.language) auf Deutsch oder Englisch angezeigt werden.

Ansatz

  • Client-side JS Detection (kein Server nötig, alles static)
  • Texte inline in beiden Sprachen im HTML, Toggle via lang-Attribut oder data-lang
  • Default: Deutsch. Fallback: Deutsch.
  • Leichtes JS-Snippet das für alle Sites wiederverwendbar ist
  • Optional: Sprach-Toggle Button im Footer

Scope

  • Generisches i18n-Pattern entwickeln
  • ichbinotto.de als Pilot
  • Dann auf alle ~50 Sites ausrollen

Nicht

  • Kein SSR, kein Build-Step für Sprachen
  • Keine URL-basierte Sprachauswahl (/en/, /de/)
## Ziel Alle Onepager-Sites sollen je nach Browser-Sprache (`navigator.language`) auf Deutsch oder Englisch angezeigt werden. ## Ansatz - Client-side JS Detection (kein Server nötig, alles static) - Texte inline in beiden Sprachen im HTML, Toggle via `lang`-Attribut oder `data-lang` - Default: Deutsch. Fallback: Deutsch. - Leichtes JS-Snippet das für alle Sites wiederverwendbar ist - Optional: Sprach-Toggle Button im Footer ## Scope - Generisches i18n-Pattern entwickeln - ichbinotto.de als Pilot - Dann auf alle ~50 Sites ausrollen ## Nicht - Kein SSR, kein Build-Step für Sprachen - Keine URL-basierte Sprachauswahl (/en/, /de/)
Author

Shift 1 checkpoint (knuth)

Branch: mai/knuth/i18n-pilot-develop (commit b9191b3)

Done

Created shared/i18n.js — reusable client-side i18n for all onepager sites:

  • navigator.language detection, German default/fallback
  • data-de/data-en attributes on translatable elements
  • localStorage preference persistence
  • Optional language toggle button (data-i18n-toggle)
  • Handles <title>, <meta>, and regular elements
  • Exposes window.onepagerI18n API

Piloted on ichbinotto.de — all visible text translated:

  • Hero section (tagline, description)
  • 6 tentacle cards (titles + descriptions)
  • Terminal log (16 entries)
  • Stats labels
  • CTA section
  • Footer
  • Language toggle button in footer

Next steps

  • Review translations for quality
  • Test on mobile / various browsers
  • Integrate into template system (render.sh) for templated sites
  • Roll out to remaining ~50 sites
## Shift 1 checkpoint (knuth) **Branch:** `mai/knuth/i18n-pilot-develop` (commit `b9191b3`) ### Done **Created `shared/i18n.js`** — reusable client-side i18n for all onepager sites: - `navigator.language` detection, German default/fallback - `data-de`/`data-en` attributes on translatable elements - `localStorage` preference persistence - Optional language toggle button (`data-i18n-toggle`) - Handles `<title>`, `<meta>`, and regular elements - Exposes `window.onepagerI18n` API **Piloted on `ichbinotto.de`** — all visible text translated: - Hero section (tagline, description) - 6 tentacle cards (titles + descriptions) - Terminal log (16 entries) - Stats labels - CTA section - Footer - Language toggle button in footer ### Next steps - Review translations for quality - Test on mobile / various browsers - Integrate into template system (`render.sh`) for templated sites - Roll out to remaining ~50 sites
Author

i18n Rollout — Shift 1 Complete

Branch: mai/knuth/i18n-rollout-apply-de-en

Phase 1 — Template Infrastructure

  • render.sh: reads _en fields from site.yaml, emits data-de/data-en attributes
  • base.html: auto-includes i18n.js, title/description get i18n attrs
  • All 6 templates: translatable elements + toggle + machine-translation disclaimer

Phase 2 — Custom Sites

  • All 54 static custom sites annotated with data-de/data-en
  • i18n.js + language toggle + disclaimer in every site
  • Brand names / KI wordplay preserved unchanged in both languages
  • 2 dynamic sites (dasbes.de, dumusst.com) skipped

Next

  • QA spot-check translation quality
  • Merge to main
## i18n Rollout — Shift 1 Complete **Branch:** `mai/knuth/i18n-rollout-apply-de-en` ### Phase 1 — Template Infrastructure - `render.sh`: reads `_en` fields from `site.yaml`, emits `data-de`/`data-en` attributes - `base.html`: auto-includes `i18n.js`, title/description get i18n attrs - All 6 templates: translatable elements + toggle + machine-translation disclaimer ### Phase 2 — Custom Sites - All **54 static custom sites** annotated with `data-de`/`data-en` - `i18n.js` + language toggle + disclaimer in every site - Brand names / KI wordplay preserved unchanged in both languages - 2 dynamic sites (dasbes.de, dumusst.com) skipped ### Next - QA spot-check translation quality - Merge to main
Sign in to join this conversation.
No Label
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: m/onepager#1
No description provided.