cards/apps/landing/src/pages/blog/gute-lernkarten.astro
Till JS abf493aeec
Some checks are pending
CI / validate (push) Waiting to run
feat(cards): recovery mode, undo, FSRS slider, streak header, stats charts, blog
Study-View:
- Graceful Backlog Recovery: Banner bei >30 fälligen Karten, Recovery-Queue
  sortiert nach Stability aufsteigend (25er-Batch, ?recovery=true)
- Undo letzte Bewertung: 5s-Toast mit RAF-Fortschrittsbalken, Ctrl/Cmd+Z,
  prevSnapshot-Spalte in reviews (Migration 0001, Prod deployed)
- FSRS-Tooltip nach Reveal: State / Stability / Difficulty als Popover

Deck-Edit:
- Neuer Abschnitt „Lern-Algorithmus" mit request_retention-Slider (50–99 %)

Header:
- Streak-Pill (🔥 N) + fällige-Karten-Pill via GET /api/v1/me/summary

Stats-Page:
- Difficulty-Distribution (5 Buckets, Farb-Bars)
- Deck-Fortschritt (Mastery % = stability>21, max 6 Decks)

API:
- GET /me/summary: streak_days + due_now (leichtgewichtiger Header-Endpoint)
- GET /reviews/due: ?recovery=true → stability-sort, Limit 25
- POST /reviews/:cardId/:subIndex/undo: prevSnapshot-Restore, 409 wenn leer
- /me/stats: difficulty_distribution + deck_mastery

Landing:
- 5 Blog-Artikel (Quizlet-Paywall, FSRS, Datenschutz, Anki, Lernkarten-Tipps)
- BlogTeaser-Komponente auf Startseite, Footer-Spalte „Artikel"

i18n: 11 neue Schlüssel in DE/EN/FR/IT/ES

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-13 13:37:03 +02:00

408 lines
13 KiB
Text

---
import Layout from '../../layouts/Layout.astro';
import Nav from '../../components/Nav.astro';
import Footer from '../../components/Footer.astro';
import '../../styles/base.css';
const APP_URL = 'https://cardecky.mana.how';
const title = 'Wie man Lernkarten schreibt, die wirklich funktionieren | Cardecky';
const description =
'Die meisten Lernkarten sind zu lang, zu abstrakt oder zu kontextfrei. Fünf konkrete' +
' Prinzipien für Karten, die das Gehirn tatsächlich verankert — mit Gegenbeispielen.';
---
<Layout {title} {description}>
<Nav />
<main class="mx-auto max-w-prose px-6 py-16 sm:py-24">
<!-- Artikel-Header -->
<header class="mb-12">
<p class="section-label mb-4">Lernen · Methodik</p>
<h1 class="font-serif text-4xl leading-tight text-ink sm:text-5xl">
Wie man Lernkarten schreibt, die wirklich funktionieren
</h1>
<p class="mt-5 text-lg leading-relaxed text-muted">
Der beste Algorithmus nützt nichts, wenn die Karten schlecht gebaut sind. Fünf
Prinzipien für Karten, die das Gehirn tatsächlich behält.
</p>
<p class="mt-4 text-xs text-muted">Stand: Mai 2026</p>
</header>
<article class="prose-cardecky">
<!-- Einstieg -->
<p>
Wer mit Spaced Repetition anfängt und nach drei Wochen merkt, dass es nicht
funktioniert, sucht den Fehler meistens an der falschen Stelle: beim Algorithmus, bei
der App, bei der Wiederholungsfrequenz. Die eigentliche Ursache sitzt fast immer
früher — in den Karten selbst.
</p>
<p>
Schlechte Karten machen gutes Scheduling wertlos. Eine Karte, die drei Fakten
gleichzeitig abfragt, hat kein definiertes Lernergebnis. Eine Karte ohne Kontext
wird isoliert abgespeichert — und isoliert Gespeichertes verblasst, egal wie oft
es wiederholt wird. FSRS kann berechnen, wann du eine Karte wieder sehen sollst;
es kann nicht reparieren, was die Karte von vornherein falsch fragt.
</p>
<p>
Die folgenden fünf Prinzipien kommen aus der Lernforschung, aus Piotr Woźniaks
„Twenty Rules of Formulating Knowledge" und aus der Praxis der Anki- und
FSRS-Community. Sie sind nicht kompliziert — aber sie erfordern beim Schreiben
Disziplin.
</p>
<!-- Prinzip 1 -->
<h2>1. Eine Frage, eine Antwort</h2>
<p>
Das ist der häufigste Anfängerfehler, und er fühlt sich beim Schreiben nicht wie
ein Fehler an. Man kennt ein Thema, will es „effizient" auf Karten bringen, und
packt fünf zusammengehörige Fakten auf eine Karte. Das Ergebnis ist eine Karte, die
du dir nie wirklich merken kannst — weil du nie weißt, ob du sie gewusst hast.
</p>
<p>Beispiel einer schlechten Karte:</p>
<pre>F: Was sind die Eigenschaften von Mitochondrien?
A: Doppelmembran, eigene DNA, ATP-Produktion durch
oxidative Phosphorylierung, Apoptose-Steuerung,
Ursprung aus endosymbiotischer Bakterien.</pre>
<p>Besser: fünf Karten.</p>
<pre>F: Welche Membran-Struktur haben Mitochondrien?
A: Doppelmembran (Außen- und Innenmembran).
F: Wodurch unterscheidet sich die Mitochondrien-DNA
von der Zellkern-DNA?
A: Sie ist zirkulär und erinnert an Bakterien-DNA
— Hinweis auf den endosymbiontischen Ursprung.</pre>
<p>
Jede Karte hat jetzt ein klares Richtig oder Falsch. Wenn du sie beim Scheduling
als „schwierig" markierst, weiß der Algorithmus, was du nicht weißt — und kann
das gezielt wiederholen. Mit der Sammelkarte kann er das nicht.
</p>
<!-- Prinzip 2 -->
<h2>2. Kontext ist kein Luxus</h2>
<p>
Isolierte Fakten vergisst das Gehirn schneller als eingebettete. Das ist keine
Faustregel, sondern ein gut belegter Effekt: Bedeutungsträgern gegenüber
bedeutungsfreien Stimuli fällt das Behalten leichter, weil das Gehirn neue
Information an bestehende Netzwerke knüpfen kann.
</p>
<p>Eine typische kontextfreie Karte:</p>
<pre>F: Was ist Apoptose?
A: Programmierter Zelltod.</pre>
<p>Eine Karte mit Kontext:</p>
<pre>F: Warum ist Apoptose für die Embryonalentwicklung
wichtig?
A: Finger entstehen, weil die Zellen zwischen ihnen
gezielt in Apoptose gehen — nicht, weil Finger
wachsen, sondern weil das Material dazwischen
verschwindet.</pre>
<p>
Die zweite Karte fragt dasselbe Konzept ab — aber in einem Zusammenhang, der sich
bildlich einprägt. „Programmierter Zelltod" bleibt ein Begriff. Finger, die sich
aus einem Gewebeklumpen herausschälen, bleibt ein Bild.
</p>
<p>
Das bedeutet nicht, dass jede Karte einen langen Erklärungstext braucht. Ein
einziger konkreter Anwendungsfall, ein Beispiel, ein Gegenbeispiel — das reicht
meistens. Die Frage „in welchem Zusammenhang?" vor dem Schreiben stellen.
</p>
<!-- Prinzip 3 -->
<h2>3. Minimales, aber vollständiges Wissen</h2>
<p>
Piotr Woźniak nennt das „minimum information principle": eine Karte so kurz wie
möglich, aber nicht kürzer. Die Spannung liegt im „aber nicht kürzer" — eine Karte,
die so gekürzt wurde, dass sie nur noch mit Vorwissen richtig beantwortet werden
kann, das du beim Wiederholen vielleicht nicht mehr parat hast, testet nichts
Sinnvolles.
</p>
<p>Zu lang:</p>
<pre>F: Erkläre den Unterschied zwischen prokaryotischen
und eukaryotischen Zellen, inklusive Beispielen,
evolutionärem Ursprung und Zellorganellen.
A: [langer Absatz]</pre>
<p>Zu kurz (und zu vage):</p>
<pre>F: Prokaryoten?
A: Keine Zellkerne.</pre>
<p>Genau richtig:</p>
<pre>F: Was fehlt Prokaryoten, das Eukaryoten haben?
A: Einen membranumhüllten Zellkern.</pre>
<p>
Ein gutes Testkriterium: Wenn du eine Karte nach einem Monat Pause siehst und die
Frage vollständig verstehst, ist sie gut formuliert. Wenn du erst rekonstruieren
musst, was du damals gemeint hast, ist sie zu kurz oder zu vage.
</p>
<!-- Prinzip 4 -->
<h2>4. Cloze richtig einsetzen</h2>
<p>
Lückentexte — in Anki-Notation <code>&#123;&#123;c1::Begriff&#125;&#125;</code> — sind nicht
einfach eine andere Formatierung derselben Karte. Sie eignen sich besonders gut für
Prozesse, Sequenzen und Zusammenhänge, weil der umgebende Satz als Kontext direkt
sichtbar bleibt.
</p>
<p>Klassische Frage-Antwort-Karte für einen Begriff im Kontext:</p>
<pre>F: Was ist das Prinzip hinter dem Krebs-Zyklus?
A: Acetyl-CoA wird oxidiert, ATP gewonnen,
CO₂ abgegeben.</pre>
<p>Als Cloze — stärker, weil der Satz als Ganzes gelernt wird:</p>
<pre>Der Krebs-Zyklus oxidiert {{c1::Acetyl-CoA}},
gewinnt dabei {{c2::ATP}} und gibt
{{c3::CO₂}} ab.</pre>
<p>
Cloze ist schwächer, wenn der Lückentext rein zufällig wirkt — also wenn aus dem
Satz nicht klar wird, was gesucht ist, und jedes beliebige Wort passen könnte.
Dann ist eine direkte Frage ehrlicher.
</p>
<p>
Cloze ist auch kein Allheilmittel gegen das Ein-Fakt-Problem: ein Satz mit fünf
Lücken ist immer noch eine Karte mit fünf Fakten. Besser: pro Satz eine Lücke,
mehrere Karten.
</p>
<!-- Prinzip 5 -->
<h2>5. Eigene Worte, eigene Bilder</h2>
<p>
Auswendig gelernte Definitionen verblassen schneller als selbst formulierte
Erklärungen. Das liegt daran, dass bei der Eigenformulierung das Verstehen
vorausgeht — wer etwas in eigene Worte übersetzt, hat es bereits verarbeitet,
nicht nur kopiert.
</p>
<p>
Lehrbuchdefinition direkt übernommen — typische Anfänger-Karte:
</p>
<pre>F: Was ist osmotischer Druck?
A: Der Druck, der aufgewendet werden muss, um den
osmotischen Fluss einer Lösung durch eine
semipermeable Membran zu verhindern.</pre>
<p>Eigenformulierung:</p>
<pre>F: Was ist osmotischer Druck — in einem Satz,
ohne Fachsprache?
A: Das Wasser will auf die Seite mit mehr
gelöstem Zeug; der osmotische Druck ist der
Gegendruck, der das verhindert.</pre>
<p>
Die zweite Version verliert Präzision — das ist ein echter Trade-off. Für
klausurrelevante exakte Definitionen braucht man beide: die präzise Formulierung
und die eigene Erklärung. Dann zwei Karten. Nicht eine Karte, die beides
gleichzeitig will.
</p>
<p>
Bilder funktionieren nach demselben Prinzip: visuell verankerte Information hat
mehr Anknüpfungspunkte im Gedächtnis als rein verbale. Ein Diagramm, ein
selbst gezeichneter Sketch, ein Screenshot aus einem Lehrvideo — das schlägt
eine nochmals kopierte Textdefinition fast immer.
</p>
<!-- AI-Generierung -->
<h2>Was AI-Generierung kann — und was nicht</h2>
<p>
AI-Tools können Karten aus einem Text generieren, und das kann die Arbeit
reduzieren: statt zwanzig Karten von Hand zu schreiben, bekommt man einen
Entwurf, der überarbeitet werden kann. Das ist ein nützliches Werkzeug.
</p>
<p>
Es ersetzt aber nicht das Nachdenken über die eigene Formulierung. AI-generierte
Karten folgen oft dem Muster der Lehrbuchdefinition — sie übernehmen Sprache
aus dem Quelltext, statt sie zu übersetzen. Sie splitten zu selten von alleine
auf ein Fakt pro Karte. Und sie können nicht wissen, welcher Kontext für dich
der einprägsame ist.
</p>
<p>
Der sinnvolle Workflow: AI generiert einen Rohsatz von Karten, du überarbeitest
ihn nach den fünf Prinzipien. Das ist weniger Arbeit als von null, aber es ist
immer noch Arbeit.
</p>
<!-- Cardecky-Einbindung -->
<h2>Welche Kartentypen welches Prinzip unterstützen</h2>
<p>
Cardecky hat vier native Kartentypen, die direkt auf diese Prinzipien einzahlen:
</p>
<ul>
<li>
<strong>Vorderseite/Rückseite</strong> — der Standard für Prinzip 1 und 3. Eine
Frage, eine Antwort. Keine Extras.
</li>
<li>
<strong>Lückentext (Cloze)</strong> — für Prinzip 4: Prozesse und Zusammenhänge,
bei denen der umgebende Satz als Kontext stehen bleibt.
</li>
<li>
<strong>Bild-Karte</strong> — für Prinzip 5: Diagramme, Sketchnotes, annotierte
Screenshots als eigenständiger Karteninhalt.
</li>
<li>
<strong>Typing-Karte</strong> — erzwingt freies Erinnern statt
Wiedererkennen; sinnvoll für Formeln, Fachbegriffe und exakte
Definitionen, bei denen das Erkennen zu wenig ist.
</li>
</ul>
<p>
Multiple Choice ist ebenfalls verfügbar — nützlich für erste Annäherungen an neues
Material, wo freies Erinnern noch nicht möglich ist. Für konsolidiertes Wissen ist
Wiedererkennen aus Optionen aber schwächer als freies Abrufen.
</p>
<p>
In Arbeit: ein AI-Cloze-Generator, der aus einem eigenen Text direkt
Lückentextkarten erstellt, und ein Card-Split-Vorschlag, der Karten mit
mehreren Fakten automatisch zur Teilung vorschlägt. Beide Features sind noch nicht
live — sie werden ergänzt, wenn sie auf einem Qualitätsniveau sind, das die
oben beschriebenen Prinzipien nicht untergräbt.
</p>
<!-- CTA -->
<hr class="my-12 border-rule" />
<div class="rounded-xl border border-rule bg-paper p-8">
<p class="font-serif text-2xl text-ink">Karten schreiben — in Cardecky</p>
<p class="mt-3 text-muted leading-relaxed">
Alle fünf Kartentypen verfügbar, FSRS-Scheduling ab der ersten Karte,
kein Abo für das eigentliche Lernen.
</p>
<div class="mt-6 flex flex-wrap gap-4">
<a href={APP_URL} class="btn-primary">
Cardecky öffnen
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
<path d="M5 12h14M12 5l7 7-7 7"/>
</svg>
</a>
</div>
</div>
</article>
</main>
<Footer />
</Layout>
<style>
/* Prose-Styles für den Artikel — ohne externes @tailwindcss/typography */
.prose-cardecky h2 {
font-family: var(--font-serif, Georgia, serif);
font-size: 1.375rem;
font-weight: 600;
color: theme('colors.ink');
margin-top: 2.5rem;
margin-bottom: 0.75rem;
line-height: 1.3;
}
.prose-cardecky p {
color: theme('colors.ink');
line-height: 1.75;
margin-bottom: 1.25rem;
}
.prose-cardecky ul,
.prose-cardecky ol {
margin-bottom: 1.25rem;
padding-left: 1.5rem;
}
.prose-cardecky ul {
list-style-type: disc;
}
.prose-cardecky ol {
list-style-type: decimal;
}
.prose-cardecky li {
color: theme('colors.ink');
line-height: 1.75;
margin-bottom: 0.5rem;
}
.prose-cardecky li + li {
margin-top: 0.375rem;
}
.prose-cardecky strong {
font-weight: 600;
color: theme('colors.ink');
}
.prose-cardecky a {
color: theme('colors.leaf');
text-decoration: underline;
text-underline-offset: 2px;
}
.prose-cardecky a:hover {
color: theme('colors.ink');
}
.prose-cardecky hr {
border-color: theme('colors.rule');
}
.prose-cardecky pre {
font-family: var(--font-mono, ui-monospace, monospace);
font-size: 0.875rem;
line-height: 1.6;
background-color: theme('colors.paper');
border: 1px solid theme('colors.rule');
border-radius: 0.5rem;
padding: 1rem 1.25rem;
margin-bottom: 1.25rem;
overflow-x: auto;
color: theme('colors.ink');
white-space: pre-wrap;
}
.prose-cardecky code {
font-family: var(--font-mono, ui-monospace, monospace);
font-size: 0.875em;
background-color: theme('colors.paper');
border: 1px solid theme('colors.rule');
border-radius: 0.25rem;
padding: 0.1em 0.35em;
}
</style>