Files
dogfather-universe/webdesign/leistungen.html
T
DogFatherGitandClaude Opus 5 1afb38258c Anfuehrungszeichen: drei Loecher in meiner eigenen Wache
Die zweite Sitzung hat in den Praesentationen des Vaults 83 Stellen
gefunden — und damit auf Loecher in MEINER Wache gezeigt. Ich habe
sie nachgemessen, alle drei waren echt.

LOCH 1 — SIE SAH NUR `server/workspace-*.js`

Also ausgerechnet nicht `workspace.js`, die groesste Datei des
Hauses. Der weitere Filter fand dort sofort drei Stellen:

    workspace.js:3404  Kanal „Chat-Moderation"     (Protokoll)
    workspace.js:3422  „${titel}" -> ${haus}       (Protokoll)
    workspace.js:3304  „${… || "ohne Titel"}"      (siehe Loch 3)

Das ist heute der DRITTE Fall von „die Wache kennt nur die halbe
Menge" — nach pruef-struktur (sah nur die Pruefdateien, nicht die
Anwendung) und pruef-fingermass (sah keine variable Breite).

LOCH 2 — IHR AUSDRUCK GILT JE ZEILE

Ein `„`, das erst in der naechsten Zeile mit einem geraden `"`
schliesst, fiel durch. Gemessen: drei echte Faelle, zwei davon
sichtbarer Seitentext.

    workspace/leistung.html       „nicht / zugeordnet"
    workspace/leistung.html       „Backstage-Tabelle / einfuegen"
    workspace/assets/js/ampel.js  „noch ' + 'verbessern"

Beim letzten laeuft das Zitat ueber eine Zeichenketten-Verkettung.

Neue Regel ohne Fehlalarme: erst alle RICHTIG geschlossenen Paare
entfernen (auch mehrzeilig), dann die einzeilig falschen (die meldet
die alte Regel). Was danach noch ein `„` hat und binnen drei Zeilen
ein gerades `"`, ist ein Fund. Ausgenommen bleibt das Zeichen ALS
WERT — in `content: "„";` und in den Sprachtabellen ist das `„` der
Inhalt und das `"` die Begrenzung.

LOCH 3 — EINE AUSNAHME, DIE EINEN FUND VERSCHLUCKT HAT

Gefunden durch die ZAHL, nicht durch den Blick: Der weitere Filter
liess die Ausnahmen von 12 auf 13 steigen. Die dreizehnte war

    `… „${zeile[titelSpalte] || "ohne Titel"}"`

Der Ausdruck blieb am `"` von `"ohne Titel"` haengen; als Inhalt kam
`${zeile[titelSpalte] || ` heraus, das endet auf ein Leerzeichen,
und damit galt „der Satz geht in der naechsten Zeile weiter". Das
echte Schlusszeichen stand hinter dem `}` und war gerade.

Dass die Ausnahmen gezaehlt UND genannt werden, hat ihn gefunden.
Genau dafuer steht die Zeile dort.

Behoben an der Wurzel: Anfuehrungszeichen innerhalb einer Einsetzung
`${…}` werden vorher durch X ersetzt, bei gleicher Laenge und
gleichen Zeilenumbruechen. Das nimmt einer ganzen Sorte
Fehlklassifizierung die Grundlage — die Ausnahmen fielen danach von
13 auf 11.

UND EIN VIERTES, BEIM MESSEN AUFGEFALLEN

`„Van-Van”` in assets/js/data-modis.js schliesst mit U+201D, dem
ENGLISCHEN Zeichen. Zweimal, beide Male in einer DEUTSCHEN Zeile
(`de:` und `"de-CH":`) — nicht einmal eine Uebersetzung, in der es
richtig waere. Eigene Regel dafuer, die keine Ausnahme braucht: Wer
mit `„` oeffnet, schliesst deutsch; in fremdsprachigen Zeilen steht
gar kein `„` am Anfang.

DIE AUSNAHMEZAHL IST JETZT STRENG. Sie stand auf „hoechstens 12" —
damit waere der Anstieg auf 13 nicht aufgefallen. Jetzt genau 11,
wie bei den Grundlinien in pruef-fingermass.

GEPRUEFT: pruef-struktur 68 -> 75 Pruefungen, 0 Fehler. Dazu
leistung-optik 59/0, ampel 47/0, treff 85/0, modi-verborgen 87/0 —
die Seiten, deren Text ich angefasst habe. Steuerzeichen: 830
Dateien, keines. Beide Stempel gesetzt.

Sechs echte Stellen berichtigt, vier neue Gegenproben.

Co-Authored-By: Claude Opus 5 <[email protected]>
2026-10-01 19:28:38 +02:00

423 lines
24 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="de" data-i18n-titel="seiten_titel">
<head>
<meta charset="UTF-8" />
<!-- viewport-fit=cover ist die Voraussetzung dafuer, dass env(safe-area-inset-*)
ueberhaupt einen Wert liefert. Ohne diese Angabe gibt jedes env() null zurueck
-- die Sicherheitsabstaende im CSS waeren totes Recht. Zusammen mit
apple-mobile-web-app-status-bar-style=black-translucent (siehe unten) laeuft
der Inhalt sonst installiert unter Uhr und Akkuanzeige. -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
<title>Leistungen — Dogfather Webdesign</title>
<meta name="description" content="Onepager, professionelle Website, Shop und Verwaltungsseiten: was jeweils enthalten ist, was extra kostet und wo die Grenze verläuft." />
<meta name="robots" content="noindex, nofollow, noarchive" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/webdesign-32.png?v=202610011927" />
<meta name="theme-color" content="#564e95" />
<link rel="manifest" href="/webdesign/app.webmanifest" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/webdesign-180.png?v=202610011927" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="apple-mobile-web-app-title" content="Dogfather Webdesign" />
<link rel="stylesheet" href="/assets/css/main.css?v=202610011927" />
<link rel="stylesheet" href="/assets/css/webdesign.css?v=202610011927" />
<style>
/* Sprungmarken.
Frueher eine waagerecht wischbare Leiste. Rueckmeldung 22.08.2026:
"ich will nicht dass man die hin und her schieben muss man soll die
alle sehen aber nicht schieben muessen" -- voellig richtig. Eine
Wischleiste verbirgt, DASS es noch mehr gibt: was rechts aus dem Bild
ragt, existiert fuer die meisten Menschen nicht. Dazu kommt ein
haesslicher Balken quer ueber die Seite.
Jetzt bricht die Leiste einfach um. Der Text in den Knoepfen darf
dabei mitbrechen (white-space: normal) -- sonst sprengt ein langer
Name wie "Buchhaltungs- & Steuerverwaltungsseiten" auf 320px die
Zeile und der waagerechte Ueberlauf waere durch die Hintertuer
zurueck. */
.ls-sprung {
display: flex; flex-wrap: wrap; gap: .5rem;
padding: .2rem 0 1rem;
}
.ls-sprung a {
flex: 0 1 auto;
padding: .55rem 1rem; min-height: 44px;
display: inline-flex; align-items: center; justify-content: center;
border-radius: 10px; border: 1px solid var(--wd-rand);
font-size: .92rem; font-weight: 600; color: var(--wd-text-mid);
white-space: normal; text-align: center; line-height: 1.25;
}
.ls-sprung a:hover { color: var(--wd-text); border-color: var(--wd-rand-stark); background: rgb(var(--wd-blau-rgb) / .06); }
/* Ab 700px alle nebeneinander in EINER Reihe.
Rueckmeldung 22.08.2026: "alle neben einander bitte". Vorher passten
nur vier in die Zeile und die fuenfte rutschte allein darunter — das
sieht aus wie ein Versehen, nicht wie eine Gestaltung.
"flex: 1 1 0" statt "auto": damit teilen sich alle fuenf den Platz zu
gleichen Teilen, unabhaengig von der Textlaenge. Mit "auto" waere
"Preise & Zahlung" schmal und "Inhalte & Zusammenarbeit" breit —
ungleiche Kacheln in einer Reihe, genau was hier nicht gewollt ist.
"min-width: 0" ist noetig, weil Flex-Elemente sonst nicht unter ihre
Inhaltsbreite schrumpfen und die Reihe doch wieder umbrechen wuerde.
Laengere Namen brechen dadurch innerhalb ihrer Kachel auf zwei
Zeilen; die Kacheln bleiben durch die Reihe trotzdem gleich hoch.
Unter 700px bleibt es beim Umbruch — fuenf Spalten waeren auf einem
Handy unlesbar schmal. */
@media (min-width: 700px) {
.ls-sprung a { flex: 1 1 0; min-width: 0; padding-left: .6rem; padding-right: .6rem; }
}
/* scroll-margin-top: sonst verschwindet die Abschnittsüberschrift beim
Anspringen unter der klebenden Kopfzeile. */
.ls-block { scroll-margin-top: 90px; }
.ls-block + .ls-block { margin-top: clamp(2rem, 5vw, 3.4rem); }
.ls-block h2 { margin-bottom: .25em; }
.ls-preiszeile {
display: flex; flex-wrap: wrap; align-items: baseline; gap: .4rem 1.4rem;
margin: 0 0 1.4rem;
}
.ls-preis { font-family: var(--font-head); font-weight: 800; font-size: clamp(1.5rem, 3.6vw, 2rem); color: var(--wd-blau); }
.ls-block--lila .ls-preis { color: var(--wd-lila); }
.ls-dauer { color: var(--wd-text-mid); font-size: 1rem; }
.ls-raster { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(.9rem, 2vw, 1.3rem); }
@media (max-width: 780px) { .ls-raster { grid-template-columns: 1fr; } }
.ls-feld h3 { font-size: .78rem; letter-spacing: .13em; text-transform: uppercase; color: var(--wd-blau); margin-bottom: .5em; }
.ls-block--lila .ls-feld h3 { color: var(--wd-lila); }
.ls-feld p { margin: 0; }
</style>
</head>
<body class="wd">
<div id="wd-kopf"></div>
<main id="wd-inhalt">
<section class="wd-abschnitt wd-abschnitt--eng" style="padding-top:clamp(2.4rem,6vw,4rem)">
<div class="wd-container">
<span class="wd-eyebrow" data-i18n="ls_eyebrow">Klare Pakete</span>
<h1 data-i18n="ls_h1">Was du ungefähr bekommst</h1>
<p class="wd-lead" style="max-width:72ch" data-i18n="ls_lead">Keine leeren Werbeversprechen. Zu jeder Kategorie steht hier, für wen sie gedacht ist, was typischerweise drin ist, was extra kostet — und wo die Grenze verläuft.</p>
<nav class="ls-sprung" aria-label="Abschnitte">
<a href="#onepager" data-i18n="op_h2">Onepager</a>
<a href="#website" data-i18n="ws_h2">Professionelle Website</a>
<a href="#shop" data-i18n="sh_h2">Shop &amp; umfangreiche Website</a>
<a href="#verwaltung" data-i18n="vw_h2">Buchhaltungs- &amp; Steuerverwaltungsseiten</a>
<a href="#betreuung" data-i18n="bt_h2">Laufende Betreuung</a>
</nav>
</div>
</section>
<section class="wd-abschnitt" style="padding-top:0">
<div class="wd-container">
<!-- ---------------- Onepager ---------------- -->
<article class="wd-karte wd-karte--kappe ls-block wd-auf" id="onepager">
<h2 data-i18n="op_h2">Onepager</h2>
<div class="ls-preiszeile">
<span class="ls-preis"><span data-i18n="ab_preis">ab</span> 300&nbsp;€</span>
<span class="ls-dauer"><strong data-i18n="dauer">Dauer</strong>: <span data-i18n="pk_onepager_dauer">ca. 5–10 Arbeitstage</span></span>
</div>
<p class="wd-personalisierung" style="margin-top:-1rem;margin-bottom:1.4rem" data-i18n="pk_personalisierung">Personalisierung möglich — verändert Preis und Dauer.</p>
<div class="ls-raster">
<div class="ls-feld">
<h3 data-i18n="fuer_wen">Für wen</h3>
<p data-i18n="op_fuer">Einzelpersonen, Creator, eine einzelne Aktion oder ein klar umrissenes Angebot, das keine Unterseiten braucht.</p>
</div>
<div class="ls-feld">
<h3 data-i18n="enthalten">Typisch enthalten</h3>
<ul class="wd-liste">
<li data-i18n="op_1">Bis zu ca. fünf Inhaltsbereiche auf einer Seite</li>
<li data-i18n="op_2">Hero, Vorstellung, Angebot, Links und Kontakt</li>
<li data-i18n="op_3">Responsiv auf Handy, Tablet und Computer</li>
<li data-i18n="op_4">Grundstruktur für Suchmaschinen (Titel, Beschreibung, Überschriften)</li>
<li data-i18n="op_5">Typischerweise zwei Feedbackrunden</li>
</ul>
</div>
<div class="ls-feld">
<h3 data-i18n="beispiel">Konkretes Beispiel</h3>
<p data-i18n="op_beispiel">Eine Seite für einen Creator: oben wer du bist und was du machst, darunter die aktuelle Aktion, deine Kanäle, ein kurzes Kontaktformular. Alles auf einem Bildschirm erreichbar, ohne Menü.</p>
</div>
<div class="ls-feld">
<h3 data-i18n="grenze">Nicht enthalten</h3>
<p data-i18n="op_grenze">Kein Shop, keine Nutzerkonten, keine Unterseiten. Wenn absehbar mehr als eine Seite nötig wird, ist die professionelle Website der ehrlichere Weg — auch wenn sie mehr kostet.</p>
</div>
</div>
<div class="wd-notiz" style="margin-top:1.3rem">
<p><strong data-i18n="extras">Kostet extra</strong>: <span data-i18n="extras_allgemein">Zusätzliche Sprachen · weitere Unterseiten · Logo- und Bildbearbeitung · Texterstellung · Anbindung an fremde Systeme · zusätzliche Feedbackrunden über die vereinbarten hinaus</span></p>
</div>
<div class="wd-btn-reihe" style="margin-top:1.3rem">
<a class="wd-btn wd-btn--zweit wd-btn--klein" href="/webdesign/anfrage.html?paket=onepager" data-i18n="jetzt_anfragen">Dieses Paket anfragen</a>
</div>
</article>
<!-- ---------------- Professionelle Website ---------------- -->
<article class="wd-karte wd-karte--lila wd-karte--kappe ls-block ls-block--lila wd-auf" id="website">
<h2 data-i18n="ws_h2">Professionelle Website</h2>
<div class="ls-preiszeile">
<span class="ls-preis"><span data-i18n="ab_preis">ab</span> 500&nbsp;€</span>
<span class="ls-dauer"><strong data-i18n="dauer">Dauer</strong>: <span data-i18n="pk_website_dauer">ca. 2–4 Wochen</span></span>
</div>
<p class="wd-personalisierung" style="margin-top:-1rem;margin-bottom:1.4rem" data-i18n="pk_personalisierung">Personalisierung möglich — verändert Preis und Dauer.</p>
<div class="ls-raster">
<div class="ls-feld">
<h3 data-i18n="fuer_wen">Für wen</h3>
<p data-i18n="ws_fuer">Unternehmen, Teams, Vereine, Creator mit mehreren Themen — überall dort, wo eine einzelne Seite zu voll würde.</p>
</div>
<div class="ls-feld">
<h3 data-i18n="enthalten">Typisch enthalten</h3>
<ul class="wd-liste">
<li data-i18n="ws_1">Typisch bis zu fünf Kernseiten</li>
<li data-i18n="ws_2">Navigation, Formulare, Galerie oder Videos</li>
<li data-i18n="ws_3">Responsive Umsetzung und Funktionscheck auf echten Geräten</li>
<li data-i18n="ws_4">Unterstützung bei der Veröffentlichung (Domain, Zertifikat, Umzug)</li>
<li data-i18n="ws_5">Einweisung, damit du Texte selbst ändern kannst</li>
</ul>
</div>
<div class="ls-feld">
<h3 data-i18n="beispiel">Konkretes Beispiel</h3>
<p data-i18n="ws_beispiel">Ein Handwerksbetrieb: Startseite, Leistungen, Referenzen mit Bildern, Über uns, Kontakt mit Anfahrt und Formular. Anfragen landen strukturiert im Postfach statt als formlose Mail.</p>
</div>
<div class="ls-feld">
<h3 data-i18n="grenze">Nicht enthalten</h3>
<p data-i18n="ws_grenze">Kein Produktverkauf und keine geschützten Nutzerbereiche. Sobald etwas verkauft oder ein Login gebraucht wird, gilt die nächste Kategorie.</p>
</div>
</div>
<div class="wd-notiz" style="margin-top:1.3rem">
<p><strong data-i18n="extras">Kostet extra</strong>: <span data-i18n="extras_allgemein">Zusätzliche Sprachen · weitere Unterseiten · Logo- und Bildbearbeitung · Texterstellung · Anbindung an fremde Systeme · zusätzliche Feedbackrunden über die vereinbarten hinaus</span></p>
</div>
<div class="wd-btn-reihe" style="margin-top:1.3rem">
<a class="wd-btn wd-btn--zweit wd-btn--klein" href="/webdesign/anfrage.html?paket=website" data-i18n="jetzt_anfragen">Dieses Paket anfragen</a>
</div>
</article>
<!-- ---------------- Shop ---------------- -->
<article class="wd-karte wd-karte--kappe ls-block wd-auf" id="shop">
<h2 data-i18n="sh_h2">Shop &amp; umfangreiche Website</h2>
<div class="ls-preiszeile">
<span class="ls-preis"><span data-i18n="ab_preis">ab</span> 1.000&nbsp;€</span>
<span class="ls-dauer"><strong data-i18n="dauer">Dauer</strong>: <span data-i18n="pk_shop_dauer">ca. 4–8 Wochen</span></span>
</div>
<p class="wd-personalisierung" style="margin-top:-1rem;margin-bottom:1.4rem" data-i18n="pk_personalisierung">Personalisierung möglich — verändert Preis und Dauer.</p>
<div class="ls-raster">
<div class="ls-feld">
<h3 data-i18n="fuer_wen">Für wen</h3>
<p data-i18n="sh_fuer">Alle, die tatsächlich online verkaufen wollen — Handgemachtes, digitale Produkte, Merch — oder einen geschützten Bereich für Kundinnen und Kunden brauchen.</p>
</div>
<div class="ls-feld">
<h3 data-i18n="enthalten">Typisch enthalten</h3>
<ul class="wd-liste">
<li data-i18n="sh_1">Produkte, Detailseiten, Warenkorb und Kasse</li>
<li data-i18n="sh_2">Zahlungs- und Versandabläufe eingerichtet und durchgespielt</li>
<li data-i18n="sh_3">Mobile Kundenführung — Kasse funktioniert auf dem Handy wirklich</li>
<li data-i18n="sh_4">Adminbereich zur eigenständigen Produktpflege</li>
<li data-i18n="sh_5">Einweisung in die Produktpflege</li>
</ul>
</div>
<div class="ls-feld">
<h3 data-i18n="beispiel">Konkretes Beispiel</h3>
<p data-i18n="sh_beispiel">Van's DIY &amp; Bastelbedarf: Kategorien, Artikel mit Bildern und Varianten, Warenkorb, Gutscheincodes, Versandregeln — und ein Adminbereich, in dem neue Artikel ohne Technikkenntnisse angelegt werden.</p>
</div>
<div class="ls-feld">
<h3 data-i18n="grenze">Nicht enthalten</h3>
<p data-i18n="sh_grenze">Gebühren von Zahlungsanbietern, Kosten für Domain und Server sowie steuerliche Pflichten liegen bei dir. Ich richte die Technik ein, übernehme aber weder Buchhaltung noch Rechtsberatung.</p>
</div>
</div>
<div class="wd-notiz" style="margin-top:1.3rem">
<p><strong data-i18n="extras">Kostet extra</strong>: <span data-i18n="extras_allgemein">Zusätzliche Sprachen · weitere Unterseiten · Logo- und Bildbearbeitung · Texterstellung · Anbindung an fremde Systeme · zusätzliche Feedbackrunden über die vereinbarten hinaus</span></p>
</div>
<div class="wd-btn-reihe" style="margin-top:1.3rem">
<a class="wd-btn wd-btn--zweit wd-btn--klein" href="/webdesign/anfrage.html?paket=shop" data-i18n="jetzt_anfragen">Dieses Paket anfragen</a>
</div>
</article>
<!-- ---------------- Verwaltungsseiten ---------------- -->
<article class="wd-karte wd-karte--lila wd-karte--kappe ls-block ls-block--lila wd-auf" id="verwaltung">
<h2 data-i18n="vw_h2">Buchhaltungs- &amp; Steuerverwaltungsseiten</h2>
<div class="ls-preiszeile">
<span class="ls-preis"><span data-i18n="ab_preis">ab</span> 1.500&nbsp;€</span>
<span class="ls-dauer"><strong data-i18n="dauer">Dauer</strong>: <span data-i18n="pk_verwaltung_dauer">ca. 6–12 Wochen</span></span>
</div>
<p class="wd-personalisierung" style="margin-top:-1rem;margin-bottom:1.4rem" data-i18n="pk_personalisierung">Personalisierung möglich — verändert Preis und Dauer.</p>
<div class="ls-raster">
<div class="ls-feld">
<h3 data-i18n="fuer_wen">Für wen</h3>
<p data-i18n="vw_fuer">Selbstständige und kleine Betriebe, die Belege, Einnahmen und Ausgaben nicht mehr in Ordnern und Tabellen suchen wollen.</p>
</div>
<div class="ls-feld">
<h3 data-i18n="enthalten">Typisch enthalten</h3>
<ul class="wd-liste">
<li data-i18n="vw_1">Geschützter Login und Benutzerrollen</li>
<li data-i18n="vw_2">Belege, Einnahmen, Ausgaben und Dokumente an einem Ort</li>
<li data-i18n="vw_3">Filter, Suche, Auswertungen und Export</li>
<li data-i18n="vw_4">Nachvollziehbarer Änderungsverlauf mit Zeitstempel</li>
<li data-i18n="vw_5">Regelmäßige Sicherungen mit geprüfter Wiederherstellung</li>
</ul>
</div>
<div class="ls-feld">
<h3 data-i18n="beispiel">Konkretes Beispiel</h3>
<p data-i18n="vw_beispiel">Ein Portal, in dem du ein Foto eines Belegs hochlädst, Betrag und Kategorie einträgst und am Jahresende alles gefiltert exportierst — statt einen Schuhkarton zur Steuerberatung zu tragen.</p>
</div>
<div class="ls-feld">
<h3 data-i18n="grenze">Nicht enthalten</h3>
<p data-i18n="vw_grenze">Das ist ausdrücklich eine technische Organisationslösung. Keine Buchhaltung, keine Steuerberatung, keine Erstellung von Steuererklärungen — dafür braucht es weiterhin eine Fachperson.</p>
</div>
</div>
<!-- Gold: die einzige rechtlich heikle Stelle dieser Seite. -->
<div class="wd-hinweis" style="margin-top:1.3rem">
<p class="wd-hinweis-titel" data-i18n="abgrenzung_titel">Technische Abgrenzung</p>
<p data-i18n="abgrenzung_text">Buchhaltungs- und Steuerverwaltungsseiten sind ausschließlich technische Organisationslösungen. Diese Seite verspricht keine Buchhaltung, keine Steuerberatung und keine Erstellung von Steuererklärungen.</p>
</div>
<div class="wd-btn-reihe" style="margin-top:1.3rem">
<a class="wd-btn wd-btn--zweit wd-btn--klein" href="/webdesign/anfrage.html?paket=verwaltung" data-i18n="jetzt_anfragen">Dieses Paket anfragen</a>
</div>
</article>
<!-- ---------------- Betreuung ---------------- -->
<article class="wd-karte wd-karte--kappe ls-block wd-auf" id="betreuung">
<h2 data-i18n="bt_h2">Laufende Betreuung</h2>
<div class="ls-preiszeile">
<span class="ls-preis" data-i18n="betreuung_preis">ab 49 € / Monat</span>
</div>
<div class="ls-raster">
<div class="ls-feld">
<h3 data-i18n="fuer_wen">Für wen</h3>
<p data-i18n="bt_fuer">Alle, die nach der Übergabe nicht selbst an der Technik schrauben wollen — oder einfach wissen möchten, dass jemand hinschaut.</p>
</div>
<div class="ls-feld">
<h3 data-i18n="enthalten">Typisch enthalten</h3>
<ul class="wd-liste">
<li data-i18n="bt_1">Kleine Änderungen typischerweise in ca. 2–5 Arbeitstagen</li>
<li data-i18n="bt_2">Sicherheitsaktualisierungen und Überwachung der Erreichbarkeit</li>
<li data-i18n="bt_3">Regelmäßige Sicherungen, die auch wirklich zurückgespielt werden können</li>
<li data-i18n="bt_4">Umfang und Priorität nach gewähltem Paket</li>
</ul>
</div>
<div class="ls-feld" style="grid-column:1/-1">
<h3 data-i18n="grenze">Nicht enthalten</h3>
<p data-i18n="bt_grenze">Betreuung ist keine unbegrenzte Weiterentwicklung. Neue Funktionen oder ganze Unterseiten sind eigene Aufträge — der Aufwand wird vorher genannt, du entscheidest.</p>
</div>
</div>
<div class="wd-btn-reihe" style="margin-top:1.3rem">
<a class="wd-btn wd-btn--zweit wd-btn--klein" href="/webdesign/anfrage.html?paket=betreuung" data-i18n="jetzt_anfragen">Dieses Paket anfragen</a>
</div>
</article>
</div>
</section>
<!-- ================================================================
Uebernommen von der frueheren Seite "Preise & Zeit" (23.08.2026).
Die Seite wurde entfernt, weil sie dieselben Pakete und Preise
zeigte wie diese hier -- zwei Orte fuer dieselbe Zahl sind eine
Einladung, dass sie irgendwann auseinanderlaufen.
Diese beiden Abschnitte gab es dort aber ZUSAETZLICH, und sie
waeren beim blossen Loeschen verlorengegangen:
"Was den Preis bewegt" -- beantwortet die Frage, die nach jeder
Preisliste kommt, und macht den Preis nachvollziehbar
"Wie bezahlt wird" -- die 30-%-Anzahlung. Rechtlich
relevant und aus den AGB und den Fragen verlinkt
================================================================ -->
<section class="wd-abschnitt wd-abschnitt--gehoben">
<div class="wd-container">
<h2 class="wd-auf" data-i18n="pr_was_h2">Was den Preis bewegt</h2>
<div class="wd-grid wd-grid--2" style="margin-top:1.8rem">
<div class="wd-karte wd-karte--lila wd-karte--kappe wd-auf">
<h3 data-i18n="pr_hoch_h3">Macht es teurer und länger</h3>
<ul class="wd-liste">
<li data-i18n="pr_hoch_1">Viele Unterseiten oder viele Produkte</li>
<li data-i18n="pr_hoch_2">Zusätzliche Sprachen</li>
<li data-i18n="pr_hoch_3">Texte und Bilder müssen erst erstellt werden</li>
<li data-i18n="pr_hoch_4">Anbindung an fremde Systeme (Kasse, Kalender, Warenwirtschaft)</li>
<li data-i18n="pr_hoch_5">Mehr Feedbackrunden als vereinbart</li>
</ul>
</div>
<div class="wd-karte wd-karte--kappe wd-auf">
<h3 data-i18n="pr_runter_h3">Macht es günstiger und schneller</h3>
<ul class="wd-liste">
<li data-i18n="pr_runter_1">Texte, Logo und Bilder liegen fertig vor</li>
<li data-i18n="pr_runter_2">Klare Vorstellung vom Ziel der Seite</li>
<li data-i18n="pr_runter_3">Eine Person entscheidet, nicht ein Gremium</li>
<li data-i18n="pr_runter_4">Rückmeldungen gebündelt statt tröpfchenweise</li>
<li data-i18n="pr_runter_5">Bestehende Domain und bestehendes Hosting</li>
</ul>
</div>
</div>
</div>
</section>
<!-- ---------------- Zahlung ---------------- -->
<section class="wd-abschnitt">
<div class="wd-container">
<h2 class="wd-auf" data-i18n="pr_zahlung_h2">Wie bezahlt wird</h2>
<div class="pr-zahlung" style="margin-top:1.8rem">
<div class="wd-karte wd-karte--kappe wd-auf">
<h3 data-i18n="pr_z1_h3">1. Angebot</h3>
<p data-i18n="pr_z1_p">Nach dem Briefing bekommst du Preis, Umfang und Zeitrahmen schriftlich. Bis dahin entstehen dir keine Kosten.</p>
</div>
<div class="wd-karte wd-karte--kappe wd-auf">
<h3 data-i18n="pr_z2_h3">2. Anzahlung 30 %</h3>
<p data-i18n="pr_z2_p">Mit der Annahme des Angebots und dem Eingang der Anzahlung wird dein Zeitfenster fest reserviert. Erst dann beginnt die Arbeit.</p>
</div>
<div class="wd-karte wd-karte--kappe wd-auf">
<h3 data-i18n="pr_z3_h3">3. Restbetrag</h3>
<p data-i18n="pr_z3_p">Der Rest wird nach deiner Abnahme fällig, vor der Veröffentlichung. Die Nutzungsrechte gehen mit der vollständigen Bezahlung an dich über.</p>
</div>
<div class="wd-karte wd-karte--lila wd-karte--kappe wd-auf">
<h3 data-i18n="pr_z4_h3">Betreuung</h3>
<p data-i18n="pr_z4_p">Läuft monatlich und ist jederzeit zum Monatsende kündbar. Keine Mindestlaufzeit, keine automatische Verlängerung um ein ganzes Jahr.</p>
</div>
</div>
<!-- Gold: Zahlungsinformation — genau der vorgesehene Zweck. -->
<div class="wd-hinweis wd-auf" style="margin-top:1.5rem">
<p class="wd-hinweis-titel" data-i18n="anzahlung_titel">Wichtig: 30 % Anzahlung</p>
<p data-i18n="anzahlung_text">Der Projektstart wird nach Annahme des schriftlichen Angebots und Eingang einer Anzahlung von 30 % des vereinbarten Gesamtpreises reserviert.</p>
</div>
<div class="wd-hinweis wd-auf" style="margin-top:1rem">
<p class="wd-hinweis-titel" data-i18n="pr_keine_zusage_titel">Keine automatische Preiszusage</p>
<p data-i18n="pr_keine_zusage_text">Die Angaben auf dieser Seite sind Richtwerte, kein Vertrag. Auch das Anfrageformular erzeugt keine verbindliche Zusage. Der Endpreis entsteht ausschließlich durch ein schriftliches Angebot nach Prüfung des tatsächlichen Umfangs.</p>
</div>
</div>
</section>
<section class="wd-abschnitt wd-abschnitt--gehoben">
<div class="wd-container wd-container--schmal" style="text-align:center">
<h2 data-i18n="cta_h2">Nicht sicher, welches Paket passt?</h2>
<p class="wd-lead" data-i18n="cta_p">Beschreib einfach dein Vorhaben. Wenn ein kleineres Paket reicht, sage ich das — auch wenn das weniger Umsatz bedeutet.</p>
<div class="wd-btn-reihe" style="justify-content:center">
<a class="wd-btn wd-btn--haupt" href="/webdesign/anfrage.html" data-i18n="nav_anfrage">Projekt anfragen</a>
</div>
</div>
</section>
</main>
<div id="wd-fuss"></div>
<script src="/assets/js/i18n-wd-leistungen.js?v=202610011927"></script>
<script src="/assets/js/wd-core.js?v=202610011927"></script>
</body>
</html>