Suchformular oder Kontaktformular – welche Methode nimmst du? HTML Formular Methoden GET und POST bestimmen, wie deine Daten zum Server gelangen. Hier lernst du den Unterschied und wann du welche Methode einsetzt.
Was sind GET und POST?
GET hängt alle Formulardaten an die URL an. Du kennst das von Suchmaschinen: Nach einer Suche siehst du die Begriffe in der Adresszeile. POST versteckt die Daten im Request-Body – unsichtbar für den Nutzer.
Warum die richtige Wahl wichtig ist
Falsche Methodenwahl = Sicherheitslücken! Stell dir ein Login-Formular mit GET vor: Passwörter würden sichtbar in der URL stehen und in Browserverläufen landen. Fatal!
Voraussetzungen
Du solltest HTML-Formulare kennen. Falls nicht, schau in unseren HTML-Grundlagen-Kurs. Texteditor und Browser mit Entwicklertools reichen fürs Experimentieren.
Schritt-für-Schritt-Anleitung
1. GET-Methode implementieren
<form action="/suche.php" method="get">
<label for="suchbegriff">Suchbegriff:</label>
<input type="text" id="suchbegriff" name="q" required>
<select id="kategorie" name="kategorie">
<option value="alle">Alle</option>
<option value="artikel">Artikel</option>
</select>
<button type="submit">Suchen</button>
</form>
Nach dem Absenden: /suche.php?q=HTML&kategorie=artikel. Die Daten sind sichtbar und bookmarkfähig!
2. POST-Methode implementieren
<form action="/kontakt.php" method="post">
<label for="name">Name:</label>
<input type="text" id="name" name="name" required>
<label for="nachricht">Nachricht:</label>
<textarea id="nachricht" name="nachricht" rows="5" required></textarea>
<button type="submit">Senden</button>
</form>
Die Daten verschwinden im Request-Body. Die URL bleibt sauber: /kontakt.php
[bildapi id="1" prompt="A clean illustration showing GET vs POST methods in HTML forms" name="html-form-methods-comparison" alt="Vergleich von GET und POST Methoden"]
GET vs. POST: Wann welche?
Nutze GET für:
- Suchformulare
- Filter und Sortierung
- Paginierung
- Alles, was bookmarkfähig sein soll
Nutze POST für:
- Login und Registrierung
- Kontaktformulare
- Datei-Uploads
- Alles mit sensiblen Daten
Code-Beispiele
Filterformular (GET)
<form action="/shop.php" method="get">
<fieldset>
<legend>Produktfilter</legend>
<label for="preis-min">Mindestpreis:</label>
<input type="number" id="preis-min" name="min" min="0">
<label for="preis-max">Höchstpreis:</label>
<input type="number" id="preis-max" name="max" min="0">
<button type="submit">Filtern</button>
</fieldset>
</form>
Newsletter (POST)
<form action="/newsletter.php" method="post">
<fieldset>
<legend>Newsletter abonnieren</legend>
<label for="email">E-Mail:</label>
<input type="email" id="email" name="email" required>
<label>
<input type="checkbox" name="datenschutz" required>
Datenschutz akzeptieren
</label>
<button type="submit">Anmelden</button>
</fieldset>
</form>
Sicherheitsaspekte
Achtung: POST ist NICHT automatisch sicher! Beide Methoden übertragen unverschlüsselt. Für echte Sicherheit brauchst du HTTPS.
- GET-Daten landen in Browserverläufen und Serverprotokollen
- POST-Daten sind versteckt, aber abfangbar ohne HTTPS
- Faustregel: GET für öffentliche, POST für private Daten
Häufige Fehler
Login mit GET
Passwörter in der URL = Sicherheitskatastrophe! Immer POST nutzen.
Umlaute zerschossen
Moderne Browser kodieren automatisch, aber serverseitig UTF-8 verwenden!
Methode fehlt
Ohne method-Attribut wird automatisch GET verwendet. Explizit angeben!
Debugging mit Entwicklertools
Öffne F12 → Network-Tab. Dort siehst du alle Requests mit Methode, URL und Daten. Bei GET stehen Parameter in der URL, bei POST im Request-Body.
Fazit
Du kennst jetzt die HTML Formular Methoden GET und POST: GET für öffentliche Daten und bookmarkfähige Ergebnisse, POST für private Informationen und Server-Änderungen. Beide brauchen HTTPS für echte Sicherheit!
Im nächsten Tutorial lernst du HTML Barrierefreiheit mit ARIA – wichtig für inklusive Webentwicklung.