Code formatieren klingt nach Kosmetik, ist aber der schnellste Weg, fremden Code zu verstehen: Eine einzeilige minimierte Datei mit 40.000 Zeichen wird nach dem Formatieren zu 1.200 lesbaren Zeilen mit sichtbarer Struktur. Und für den eigenen Code gilt: Wer die Formatierung einem Werkzeug überlässt, streitet nie wieder über Tabs, Leerzeichen und Klammerstil.
Fremden Code formatieren – in 20 Sekunden
- Datei oder Ausschnitt in den HTML/CSS/JS-Formatierer einfügen; die Sprache wird erkannt.
- Einrückung wählen – 2 Leerzeichen sind der Standard in JavaScript und CSS, 4 in vielen PHP- und HTML-Projekten.
- Formatieren und in den Editor kopieren. Jetzt sieht man Verschachtelung, Funktionsgrenzen und die Stelle, die man debuggen wollte.
Der Formatierer ändert nur Whitespace und Zeilenumbrüche; Logik, Strings und Kommentare bleiben identisch. Deshalb ist er auch für minimierte Produktionsdateien ungefährlich – zum Lesen, nicht zum Zurückspielen.
Die Konventionen, die sich durchgesetzt haben
| Sprache | Einrückung | Weitere Regeln |
|---|---|---|
| JavaScript | 2 Leerzeichen | Semikolons, einfache Anführungszeichen, abschließendes Komma in Objekten, max. 80–100 Zeichen pro Zeile |
| CSS | 2 Leerzeichen | Eine Deklaration pro Zeile, Leerzeile zwischen Regeln, Kleinschreibung |
| HTML | 2 oder 4 | Ein Attribut pro Zeile bei mehr als drei, Inline-Elemente nicht umbrechen |
| PHP | 4 Leerzeichen (PSR-12) | Öffnende Klammer von Funktionen auf neuer Zeile, Klassen in eigener Datei |
Den eigenen Code automatisch konsistent halten
- Prettier für JavaScript, CSS und HTML: ein Befehl, keine Diskussion. Einmal
.prettierrcins Projekt, „Format on Save“ im Editor aktivieren. - EditorConfig: eine
.editorconfig-Datei legt Einrückung und Zeilenenden für jeden Editor im Team fest. - Pre-Commit-Hook: formatiert vor jedem Commit, sodass Reviews nur noch Logik zeigen, nie Whitespace.
Was Formatierung nicht löst
Schlechte Namen, 300-Zeilen-Funktionen und fehlende Kommentare bleiben schlecht, nur ordentlich eingerückt. Formatieren ist der erste Schritt beim Lesen fremden Codes, nicht der letzte. Der zweite ist, die Funktionen umzubenennen, die man verstanden hat.
Häufige Fragen
Tabs oder Leerzeichen?
Leerzeichen sind heute Standard in fast allen Style-Guides; wichtig ist nur, dass das ganze Projekt dasselbe nutzt.
Kann Formatieren Code kaputt machen?
Nein, solange der Code gültig ist. Bei Syntaxfehlern bricht der Formatierer ab und zeigt die Stelle – das ist nützlich.
Wie formatiere ich JSON?
Mit dem JSON-Formatierer, der zusätzlich validiert und eine Baumansicht bietet.
Kostenlos, läuft im Browser, nichts wird hochgeladen, keine Anmeldung.
Weiterlesen
Mehr aus Entwickler- & Code-Tools.
