Skill🧩 Web-Entwicklung

Ausfüllbares PDF aus HTML/CSS

Version 1.0·Stand 2026-09-14·Markdown · kostenlos

Ein frei mit HTML und CSS gestaltetes PDF mit echten ausfüllbaren Formularfeldern erzeugen: Das Dokument wird zweimal per Headless-Browser gedruckt, einmal mit unsichtbaren Positionsmarken und einmal sauber. Aus den Marken entstehen die Feldpositionen, die Felder landen auf dem sauberen Druck. Reproduzierbar per Skript, ohne Layout-Programm.

🧭Worum es geht

Von der Fragen-Quelle über HTML mit eingebetteten Fonts, den doppelten Headless-Druck und das Setzen von Text- und Checkbox-Feldern bis zu Kopf- und Fußzeilen mit Seitenzahlen und einer verbindlichen Qualitätssicherung.

📄Was die Datei enthält

Zwei-Durchlauf-Prinzip mit absolut positionierten Positionsmarken
Feld-Registry mit sprechenden Feldnamen und Tooltips
Print-CSS für A4, randloses Deckblatt und saubere Kapitelumbrüche
Code-Bausteine zum Auslesen der Marken und Setzen der Felder mit PyMuPDF
QR-Code zur Online-Version und gestempelte Seitenzahlen
QA-Pflichtprogramm: Seitenzahl, Feldanzahl, Restmarken, Smoke-Test, PNG-Sichtung

🎯Welche Probleme sie löst

Formulare im eigenen Markenlayout, die sich trotzdem am Rechner ausfüllen lassen
Keine manuelle Feldplatzierung in einem PDF-Editor mehr
Änderungen am Fragebogen erzeugen per Knopfdruck ein neues, korrektes PDF
Gleiche Fragen und Nummern in PDF und Online-Formular

⚠️Welche Fehler ohne diesen Skill auftreten

Felder werden von Hand platziert und verrutschen bei jeder Textänderung
Marken im Textfluss verschieben den Umbruch, Felder sitzen daneben
Checkbox-Marken verschmelzen mit dem Optionstext und werden nicht gefunden
Zu breite Tabellen werden am Druckrand abgeschnitten
Doppelte Feldnamen spiegeln Eingaben in fremde Felder

🏷️Themen

pdfacroformformularfragebogenhtmlcssprintheadless-chromepymupdfpython

Skill = eine einzelne Fähigkeit bzw. ein Schritt – fokussiert und sofort einsetzbar.

Workflow = ein kompletter Prozess, der mehrere Skills zu einem Ergebnis verkettet.