diff --git a/marketing/praesentation-mbe/kurzanleitung-beratung.html b/marketing/praesentation-mbe/kurzanleitung-beratung.html index a740f99..1cc8e0b 100644 --- a/marketing/praesentation-mbe/kurzanleitung-beratung.html +++ b/marketing/praesentation-mbe/kurzanleitung-beratung.html @@ -1,13 +1,14 @@ @@ -18,167 +19,201 @@ @page { size: A4; margin: 0; } :root { --papier: #faf7f0; --tinte: #21211d; --grau: #6b675e; - --amtsblau: #1d4e89; --stempelrot: #b3372b; --marker: #ffe66b; --gruen: #2e7d4f; + --amtsblau: #1d4e89; --stempelrot: #b3372b; --marker: #ffe66b; } * { margin: 0; padding: 0; box-sizing: border-box; -webkit-print-color-adjust: exact; print-color-adjust: exact; } body { font-family: Georgia, 'Times New Roman', serif; color: var(--tinte); background: #fff; } .seite { width: 210mm; height: 297mm; overflow: hidden; position: relative; - padding: 10mm 14mm 0; - background: repeating-linear-gradient(0deg, transparent 0 6.5mm, rgba(33,33,29,0.03) 6.5mm 6.7mm), var(--papier); - font-size: 11pt; line-height: 1.36; + padding: 11mm 16mm 0; + background: var(--papier); + font-size: 11.5pt; line-height: 1.4; + page-break-after: always; } + .seite:last-child { page-break-after: auto; } .mono { font-family: 'Courier New', ui-monospace, monospace; } + .briefkopf { display: flex; justify-content: space-between; align-items: baseline; padding-bottom: 2mm; border-bottom: 0.6mm solid var(--tinte); } .absender { font-weight: 700; font-size: 12.5pt; } .absender small { font-weight: 400; font-size: 8pt; opacity: .6; letter-spacing: .04em; } .az { color: var(--grau); font-size: 8pt; } - .betreff { margin-top: 3.5mm; font-size: 8pt; color: var(--grau); text-transform: uppercase; letter-spacing: .14em; } - h1 { font-size: 23pt; line-height: 1.12; margin-top: 1mm; letter-spacing: -0.01em; } + .betreff { margin-top: 6mm; font-size: 8pt; color: var(--grau); text-transform: uppercase; letter-spacing: .14em; } + h1 { font-size: 26pt; line-height: 1.1; margin-top: 1.5mm; letter-spacing: -0.01em; } .markiert { background: linear-gradient(104deg, transparent 2%, var(--marker) 4%, var(--marker) 96%, transparent 98%); padding: 0 1.5mm; } - .anrede { margin-top: 2mm; font-size: 11.5pt; line-height: 1.36; } - - /* Knöpfe und Bildschirm-Texte so, wie man sie auf der Seite wiedererkennt */ - .k { font-weight: 700; background: #fff; border: 0.35mm solid var(--tinte); border-radius: 1mm; - padding: 0 1.3mm; margin-right: .5mm; box-shadow: 0.5mm 0.5mm 0 var(--tinte); - -webkit-box-decoration-break: clone; box-decoration-break: clone; } - .m { background: rgba(29,78,137,.09); padding: 0 .8mm; -webkit-box-decoration-break: clone; box-decoration-break: clone; } + .anrede { margin-top: 3mm; font-size: 12pt; color: #3a3833; } - .kasten { background: #fff; border: 0.5mm solid var(--tinte); padding: 3.6mm 4mm 3.2mm; position: relative; } - .kasten .label { position: absolute; top: -2.6mm; left: 3.5mm; font-family: 'Courier New', monospace; font-size: 7.5pt; - text-transform: uppercase; letter-spacing: .1em; background: var(--tinte); color: var(--papier); padding: .4mm 2mm; } + /* Knöpfe so, wie man sie auf der Seite wiedererkennt */ + .k { font-weight: 700; white-space: nowrap; background: #fff; border: 0.35mm solid var(--tinte); border-radius: 1mm; + padding: 0 1.4mm; box-shadow: 0.5mm 0.5mm 0 var(--tinte); } + .m { white-space: nowrap; } - .einmalig { margin-top: 3.8mm; display: grid; grid-template-columns: 1fr 27mm; gap: 5mm; align-items: start; } - .einmalig p { font-size: 10.2pt; line-height: 1.3; } - .adresse { font-family: 'Courier New', monospace; font-weight: 700; font-size: 12.5pt; color: var(--amtsblau); - background: var(--marker); display: inline-block; padding: .4mm 2mm; margin: 1.2mm 0 1.6mm; word-break: break-all; } - .luecke { display: inline-block; width: 26mm; border-bottom: 0.35mm solid var(--amtsblau); height: 4.2mm; vertical-align: -0.6mm; } - .einmalig ul { list-style: none; font-size: 9.6pt; line-height: 1.28; } - .einmalig li { padding-left: 4mm; position: relative; margin-top: .9mm; } - .einmalig li::before { content: '›'; position: absolute; left: .5mm; color: var(--amtsblau); font-weight: 700; } - .qrteil { text-align: center; } - #qr { width: 25mm; height: 25mm; margin: 0 auto 1.2mm; } + .label { font-family: 'Courier New', monospace; font-size: 7.5pt; text-transform: uppercase; letter-spacing: .12em; + color: var(--grau); } + + /* Einmal einrichten */ + .einrichten { margin-top: 7mm; background: #fff; border: 0.5mm solid var(--tinte); padding: 5mm 6mm; + display: grid; grid-template-columns: 1fr 28mm; gap: 6mm; align-items: center; } + .einrichten p { margin-top: 1.5mm; } + .adresse { font-family: 'Courier New', monospace; font-weight: 700; font-size: 13pt; color: var(--amtsblau); + background: var(--marker); display: inline-block; padding: .6mm 2mm; margin-top: 2mm; word-break: break-all; } + .luecke { display: inline-block; width: 28mm; border-bottom: 0.35mm solid var(--amtsblau); height: 4.4mm; vertical-align: -0.6mm; } + .code { font-family: 'Courier New', monospace; font-weight: 700; letter-spacing: .08em; background: var(--marker); padding: 0 1.5mm; } + .leise { font-size: 9.5pt; color: var(--grau); } + #qr { width: 28mm; height: 28mm; } #qr svg { width: 100%; height: 100%; display: block; } - .qrteil .klein { font-size: 7.8pt; color: var(--grau); line-height: 1.3; } - .code { font-family: 'Courier New', monospace; font-weight: 700; font-size: 11pt; letter-spacing: .08em; background: var(--marker); padding: 0 1.5mm; margin-right: 1mm; } - h2 { font-size: 8pt; text-transform: uppercase; letter-spacing: .14em; color: var(--grau); font-weight: 400; - margin: 3.6mm 0 1.4mm; display: flex; align-items: center; gap: 3mm; } - h2::after { content: ''; flex: 1; border-top: 0.25mm solid rgba(33,33,29,.25); order: 1; } - h2 .legende { order: 2; text-transform: none; letter-spacing: 0; font-size: 9.5pt; color: var(--grau); } + /* Schritte */ + .schritte { list-style: none; margin-top: 8mm; } + .schritte li { display: grid; grid-template-columns: 12mm 1fr; align-items: start; padding: 3.2mm 0; + border-top: 0.25mm solid rgba(33,33,29,.18); } + .schritte li:first-child { border-top: none; padding-top: 0; } + .nr { width: 8.5mm; height: 8.5mm; border-radius: 50%; background: var(--amtsblau); color: #fff; + font-family: 'Courier New', monospace; font-weight: 700; font-size: 13pt; line-height: 8.5mm; text-align: center; } + .schritte b { font-size: 12.5pt; } + .schritte .dazu { font-size: 10.5pt; color: #4a463e; margin-top: .6mm; } - .schritte { list-style: none; } - .schritte li { display: grid; grid-template-columns: 9mm 1fr; gap: 1.5mm; padding: 0.8mm 0; border-bottom: 0.25mm dashed rgba(33,33,29,.22); } - .schritte li:last-child { border-bottom: none; } - .nr { font-family: 'Courier New', monospace; font-weight: 700; font-size: 17pt; line-height: 1; color: var(--amtsblau); padding-top: .4mm; } - .schritte b.t { font-size: 11pt; } - .schritte p { font-size: 10.3pt; line-height: 1.3; } - .schritte .zusatz { font-size: 9.1pt; color: #3a3833; margin-top: .3mm; } + /* Drei Regeln */ + .regeln { margin-top: 7mm; border: 0.6mm solid var(--stempelrot); background: #fff; padding: 4.5mm 6mm 5mm; } + .regeln .label { color: var(--stempelrot); } + .regeln ul { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 5mm; margin-top: 2.5mm; } + .regeln li { font-size: 10.5pt; line-height: 1.35; } + .regeln li b { display: block; font-size: 11.5pt; margin-bottom: .6mm; } - .wichtig { margin-top: 3.2mm; border-color: var(--stempelrot); border-width: 0.6mm; } - .wichtig .label { background: var(--stempelrot); } - .wichtig > p { font-size: 9.8pt; line-height: 1.28; padding-left: 4.5mm; position: relative; margin-bottom: .8mm; } - .wichtig > p::before { content: '!'; position: absolute; left: .6mm; color: var(--stempelrot); font-weight: 700; } - .meldungen { width: 100%; border-collapse: collapse; margin-top: 1mm; font-size: 9pt; line-height: 1.24; } - .meldungen caption { text-align: left; font-family: 'Courier New', monospace; font-size: 7.5pt; text-transform: uppercase; letter-spacing: .1em; color: var(--grau); padding-bottom: .8mm; } - .meldungen td { padding: .4mm 0; vertical-align: top; border-top: 0.25mm solid rgba(33,33,29,.15); } - .meldungen td:first-child { width: 39%; padding-right: 3mm; } - .meldungen tr.leer td { background: rgba(255,230,107,.45); } - .meldungen tr.leer td:first-child { padding-left: 1mm; } + /* Rückseite */ + h2 { font-size: 13pt; margin-top: 8mm; } + h2 .label { display: block; margin-bottom: 1mm; } + table { width: 100%; border-collapse: collapse; margin-top: 3mm; font-size: 10.5pt; line-height: 1.38; } + td { padding: 2.6mm 0; vertical-align: top; border-top: 0.25mm solid rgba(33,33,29,.18); } + td:first-child { width: 42%; padding-right: 5mm; font-style: italic; color: #3a3833; } + tr.anrufen td { background: rgba(255,230,107,.45); } + tr.anrufen td:first-child { padding-left: 2mm; } + .tipps { list-style: none; columns: 2; column-gap: 9mm; margin-top: 3mm; font-size: 10.5pt; line-height: 1.38; } + .tipps li { break-inside: avoid; padding: 0 0 2.6mm 4mm; position: relative; } + .tipps li::before { content: '›'; position: absolute; left: 0; color: var(--amtsblau); font-weight: 700; } + .it { margin-top: 5mm; background: #fff; border: 0.4mm solid var(--tinte); padding: 3.5mm 5mm; font-size: 10pt; } + .it .mono { font-size: 9.5pt; } - .fuss { position: absolute; left: 14mm; right: 14mm; bottom: 8mm; border-top: 0.4mm solid var(--tinte); padding-top: 2mm; - display: flex; justify-content: space-between; align-items: flex-end; font-size: 8pt; line-height: 1.4; } - .fuss .anruf { font-size: 12.5pt; font-weight: 700; line-height: 1.3; } + .fuss { position: absolute; left: 16mm; right: 16mm; bottom: 9mm; border-top: 0.4mm solid var(--tinte); padding-top: 2.5mm; + display: flex; justify-content: space-between; align-items: flex-end; font-size: 8pt; line-height: 1.4; color: var(--grau); } + .fuss .anruf { font-size: 12.5pt; font-weight: 700; line-height: 1.3; color: var(--tinte); } .fuss .anruf .nummer { font-family: 'Courier New', monospace; background: var(--marker); padding: 0 1.5mm; } - .stempel { display: inline-block; padding: 1mm 2.5mm; border: 0.5mm solid var(--stempelrot); color: var(--stempelrot); - font-family: 'Courier New', monospace; font-weight: 700; font-size: 7.5pt; letter-spacing: .1em; - text-transform: uppercase; transform: rotate(-4deg); margin-bottom: 1mm; } + .fuss .wenden { font-family: 'Courier New', monospace; font-size: 8pt; text-transform: uppercase; letter-spacing: .1em; } -
+ +
📬 BehördenKlar by Webklar - Az: KLAR-BERATUNG/2026 · Kurzanleitung Beratungs-PC + Kurzanleitung Beratungs-PC · Seite 1 von 2
-

Kurzanleitung · Für Beraterinnen und Berater

+

Für Beraterinnen und Berater

So geht's am Beratungs-PC

-

- Die Person fotografiert ihren Brief mit dem eigenen Handy. Sie lesen am PC mit. -

+

Die Person fotografiert ihren Brief mit dem eigenen Handy. Sie lesen am PC mit.

-
- Einmal einrichten: Lesezeichen +
-

Diese Adresse am Beratungs-PC als Lesezeichen speichern, genau so, mit Code:

+ Einmal einrichten +

Diese Adresse am PC als Lesezeichen speichern:

-
    -
  • Lesezeichen von Hand anlegen und die Adresse eintragen (mit „oe“, ohne „www“). Nicht nur den Stern ☆ klicken: Nach dem Öffnen ist der Code aus der Adresszeile verschwunden.
    • -
  • Ihr Code: Nur für die Beratungsstelle: nicht an Ratsuchende weitergeben, Blatt nicht offen auslegen.
    • -
-
-
-
-

Gleiche Adresse als QR-Code

+

Ihr Code: · nur für Mitarbeitende

+
-

Ablauf für jede PersonKnopf = klicken oder tippen · „Text“ = steht so auf dem Bildschirm

  1. 1
    -

    Seite öffnen. Lesezeichen anklicken. Oben steht „🤝 Kostenlos über …“

    -

    Fehlt das? Unten 🤝 Sie haben einen Code von einer Beratungsstelle? öffnen und den Code einlösen.

    + Lesezeichen öffnen. +

    Oben steht „🤝 Kostenlos über “.

  2. 2
    -

    Sprache wählen. Bei „🌐 Erklärung in dieser Sprache:“ die Sprache der Person einstellen, - bevor Sie in Schritt 3 klicken. Dari: „Farsi“ wählen.

    + Sprache der Person wählen. +

    Bei „🌐 Erklärung in dieser Sprache“, zuerst, vor Schritt 3.

  3. 3
    -

    QR-Code zeigen. 📱 Lieber mit dem Handy fotografieren klicken. Die Person scannt den QR-Code mit der Handy-Kamera. - Am PC steht dann „✅ Handy verbunden …“

    -

    Nicht 🔑 Zugang dauerhaft auf ein Handy geben klicken: Das gibt Ihren Zugang dauerhaft aufs Handy.

    + 📱 Lieber mit dem Handy fotografieren klicken. +

    Die Person scannt den QR-Code mit ihrer Handy-Kamera.

  4. 4
    -

    Am Handy: Häkchen und Foto. Das Häkchen setzt die Person selbst. Es ist ihre Einwilligung: Das Foto geht an BehördenKlar und an den KI-Dienst Anthropic (USA). - Dann tippt sie auf den großen Knopf mit 📷 und fotografiert den Brief. Am Handy steht alles in ihrer Sprache.

    -

    Ein Foto pro Brief, bei mehreren Seiten die mit Betreff und Frist. Nur den Brief fotografieren, keine Ausweise.

    + Die Person setzt das Häkchen und fotografiert den Brief. +

    Das Häkchen ist ihre Einwilligung. Am Handy steht alles in ihrer Sprache.

  5. 5
    -

    Etwa eine Minute warten. Dann steht die Erklärung am PC auf Deutsch und am Handy in der Sprache der Person. - Umschalten über dem Ergebnis, z. B. Deutsch العربية

    -

    Solange es rechnet: Handy-Bildschirm anlassen, keine andere App öffnen.

    + Etwa eine Minute warten. +

    Sie lesen die Erklärung am PC auf Deutsch, die Person am Handy in ihrer Sprache.

  6. 6
    -

    Kalender am Handy. Die Person tippt am Handy auf 📅 In meinen Kalender eintragen. Nicht am PC, sonst landet die Datei auf dem Dienst-PC.

    -

    Seite am Handy schon zu? Am PC 📱 Ergebnis aufs Handy mitnehmen klicken.

    -
    7. -
  7. 7
    -

    Fertig: Seite neu laden (Taste F5). Nächste Person: Sprache neu wählen.

    + Frist am Handy in den Kalender, dann Seite neu laden (F5). +

    Jetzt ist der PC bereit für die nächste Person.

-
- Wichtig -

Im Test nur übers Handy der Person, nicht selbst am Dienst-PC hochladen (dafür erst ein AVV). Frist immer am Originalbrief prüfen, Fristen „ab Zustellung“ selbst nachrechnen.

-

Beim Warten nicht neu laden. Falls doch: Ergebnis steht am Handy, dort Deutsch tippen. Ein QR-Code gilt für einen Brief.

- - - - - - - -
Meldungen am PC und was sie bedeuten
„⚠️ Am Handy hat es nicht geklappt: …“Am Handy steht, warum. Dort neu fotografieren.
„⚠️ Das dauert ungewöhnlich lange …“Erst aufs Handy schauen: Rechnet es noch, warten. Sonst dort den Knopf mit 🔁 tippen oder am PC Abbrechen, ab Schritt 3.
„Der QR-Code ist abgelaufen …“Schritt 3 wiederholen.
„⚠️ Keine Verbindung zum Server …“Internet prüfen. Sonst IT: behoerdenklar.de, *.workers.dev und challenges.cloudflare.com freigeben.
„Die kostenlosen Analysen sind aufgebraucht oder abgelaufen …“
„Der Zugang über … ist abgelaufen …“		Kontingent leer oder Test zu Ende: Justin anrufen, 0170 4969375. Danach das Lesezeichen neu öffnen.
+
+ Drei Regeln im Test +
    +
  • Nur übers Handy der Person.Briefe nicht selbst am PC hochladen.
    • +
  • Frist am Original prüfen.Die Erklärung ist eine Lesehilfe.
    • +
  • Nur den Brief fotografieren.Keine Ausweise oder Pässe.
    • +
-
- Bei Fragen einfach anrufen: Justin Klein · 0170 4969375
- Webklar GbR · Am Schwimmbad 10, 67722 Winnweiler · justin@webklar.com · behoerdenklar.de -
- Stand Oktober 2026 + Fragen? Justin Klein · 0170 4969375 + Wenn etwas hakt: Rückseite → +
+
+ + +
+
+ 📬 BehördenKlar by Webklar + Kurzanleitung Beratungs-PC · Seite 2 von 2 +
+ +

Kurzanleitung · Rückseite

+

Wenn etwas hakt

+ +

Meldungen am PCWas steht da, und was tun Sie?

+ + + + + + + + + + + + + +
„⚠️ Das dauert ungewöhnlich lange …“Erst aufs Handy schauen. Rechnet es noch: warten. Sonst am Handy den Knopf mit 🔁 tippen oder am PC Abbrechen und ab Schritt 3.
„⚠️ Am Handy hat es nicht geklappt …“Am Handy steht, warum. Dort einfach neu fotografieren.
„Der QR-Code ist abgelaufen …“Schritt 3 wiederholen. Ein QR-Code gilt für einen Brief.
„⚠️ Keine Verbindung zum Server …“Internet prüfen. Sonst Ihre IT fragen (unten).
Oben fehlt „🤝 Kostenlos über …“Unten auf der Seite 🤝 Sie haben einen Code von einer Beratungsstelle? öffnen und den Code eingeben.
„Die kostenlosen Analysen sind aufgebraucht oder abgelaufen …“ oder „Der Zugang über … ist abgelaufen …“Kontingent leer oder Test zu Ende. Bitte Justin anrufen: 0170 4969375. Danach das Lesezeichen neu öffnen.
+ +

Gut zu wissenKleine Dinge, die viel helfen

+
    +
  • Dari? „Farsi“ wählen.
    • +
  • Sprache zuerst, dann den QR-Code zeigen. Sonst ist das Handy auf Deutsch.
    • +
  • Beim Warten den Handy-Bildschirm anlassen und keine andere App öffnen. Den PC nicht neu laden.
    • +
  • Mehrere Seiten? Die Seite mit Betreff und Frist fotografieren.
    • +
  • Handy-Seite schon zu? Am PC 📱 Ergebnis aufs Handy mitnehmen klicken.
    • +
  • Kalender nur am Handy, sonst landet die Datei auf dem Dienst-PC.
    • +
  • Fristen „ab Zustellung“ bitte selbst nachrechnen.
    • +
  • Nicht 🔑 Zugang dauerhaft auf ein Handy geben klicken. Das gibt Ihren Zugang weiter.
    • +
  • Lesezeichen von Hand anlegen (mit „oe“, ohne „www“). Der Stern ☆ allein speichert den Code nicht.
    • +
+ +
+ Für Ihre IT: Bitte diese Adressen freigeben: + behoerdenklar.de · + behoerdenklar-proxy.behoerdenbrief.workers.dev · + challenges.cloudflare.com +
+ +
+ Fragen? Justin Klein · 0170 4969375 + justin@webklar.com · behoerdenklar.de
@@ -194,7 +229,7 @@ document.getElementById('qr').innerHTML = qr.createSvgTag({ cellSize: 4, margin: 0, scalable: true }); var codeEl = document.getElementById('codeText'); codeEl.textContent = CODE || 'wird beim Termin eingetragen'; - if (!CODE) { codeEl.style.fontSize = '9pt'; codeEl.style.letterSpacing = '0'; } + if (!CODE) { codeEl.style.letterSpacing = '0'; } var adresseEl = document.getElementById('adresseText'); adresseEl.textContent = 'behoerdenklar.de/demo?code=' + CODE; if (!CODE) { var l = document.createElement('span'); l.className = 'luecke'; adresseEl.appendChild(l); } diff --git a/marketing/praesentation-mbe/kurzanleitung-beratung.pdf b/marketing/praesentation-mbe/kurzanleitung-beratung.pdf index 530e06c..c5a6b18 100644 Binary files a/marketing/praesentation-mbe/kurzanleitung-beratung.pdf and b/marketing/praesentation-mbe/kurzanleitung-beratung.pdf differ