Nachname/Email-Script
bearbeitet von Gunnar Bittersmann@@Simon Schuller
> Ist das korrekt?
Nein.
> ~~~html, bad
> <html>
> ~~~
DOCTYPE fehlt. Angabe der Sprache des Inhalts fehlt.
Für deutschsprachige Seiten sollte das so aussehen:
~~~html
<!DOCTYPE html>
<html lang="de">
~~~
---
> ~~~html, bad
> <head>
> <title></title>
> <meta name="author" content="">
> <meta name="editor" content="html-editor phase 5">
> </head>
> ~~~
Im `head` sollte als erstes die Angabe der Zeichencodierung stehen. Wenn diese UTF-8 ist (was sie sein sollte):
~~~html
<meta charset="UTF-8">
~~~
`title` sollte nicht leer sein.
`<meta name="author" content="">` (mit leerer Angabe) macht keinen Sinn. Wenn du keinen Autor angeben willst, ganz weglassen.
`<meta name="editor" content="html-editor phase 5">` interessiert niemanden. Weglassen.
---
> ~~~html, bad
> <body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">
> ~~~
Die Farbangaben gehören nicht ins HTML, sondern ins Stylesheet (CSS).
---
> ~~~html, bad
> Geben Sie bitte folgende Datensaetze ein:
> ~~~
„Datensätze“ schreibt sich mit ä.
---
> ~~~html, bad
> Nachname.....: <input type="Text" name="username" size="50"/> <br>
> Email....: <input type="Text" name="usermail" size="50"/> <br>
> ~~~
`type="text"` ist default; muss also nicht angegeben werden.
Die Eingabefelder haben keine [Beschriftung](https://wiki.selfhtml.org/wiki/Label#label). Sie müssen aber eine haben.
So haben sie eine:
~~~html
<label>
Nachname: <input name="username" size="50">
</label><br>
<label>
Email: <input name="usermail" size="50">
</label><br>
~~~
Wobei anstatt `br`-Elemente zu verwenden besser die `label`-Elemente per Stylesheet auf `display: block` gesetzt werden sollte.
Die Punkte gehören nicht ins HTML. Wenn, dann sollten sie mit CSS erzeugt werden.
Oder so:
~~~html
<label for="username">Nachname:</label>
<input name="username" id="username" size="50">
<br>
<label for="usermail">Email:</label>
<input name="usermail" id="usermail" size="50">
<br>
~~~
oder besser:
~~~html
<p>
<label for="username">Nachname:</label>
<input name="username" id="username" size="50">
</p>
<p>
<label for="usermail">Email:</label>
<input name="usermail" id="usermail" size="50">
</p>
~~~
---
> ~~~html, bad
> <input type="Submit" name="senden" value="Absenden"/>
> ~~~
Für Buttons gibt es ein HTML-Element, das bevorzugt verwendet werden sollte:
~~~html
<button type="submit" name="senden">Absenden</button>
~~~
---
> ~~~html, bad
> <input type="Reset" name="reset" value="Abbrechen"/>
> ~~~
Reset-Button sind für Nutzer eher blöd als dass sie irgendeinen Nutzen hätten. Weg damit.
LLAP 🖖
--
“When UX doesn’t consider *all* users, shouldn’t it be known as ‘*Some* User Experience’ or... SUX? #a11y” —[Billy Gregory](https://twitter.com/thebillygregory/status/552466012713783297)
Nachname/Email-Script
bearbeitet von Gunnar Bittersmann@@Simon Schuller
> Ist das korrekt?
Nein.
> ~~~html, bad
> <html>
> ~~~
DOCTYPE fehlt. Angabe der Sprache des Inhalts fehlt.
Für deutschsprachige Seiten sollte das so aussehen:
~~~html, good
<!DOCTYPE html>
<html lang="de">
~~~
---
> ~~~html, bad
> <head>
> <title></title>
> <meta name="author" content="">
> <meta name="editor" content="html-editor phase 5">
> </head>
> ~~~
Im `head` sollte als erstes die Angabe der Zeichencodierung stehen. Wenn diese UTF-8 ist (was sie sein sollte):
~~~html
<meta charset="UTF-8">
~~~
`title` sollte nicht leer sein.
`<meta name="author" content="">` (mit leerer Angabe) macht keinen Sinn. Wenn du keinen Autor angeben willst, ganz weglassen.
`<meta name="editor" content="html-editor phase 5">` interessiert niemanden. Weglassen.
---
> ~~~html, bad
> <body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">
> ~~~
Die Farbangaben gehören nicht ins HTML, sondern ins Stylesheet (CSS).
> ~~~html, bad
> Geben Sie bitte folgende Datensaetze ein:
> ~~~
„Datensätze“ schreibt sich mit ä.
---
> ~~~html, bad
> Nachname.....: <input type="Text" name="username" size="50"/> <br>
> Email....: <input type="Text" name="usermail" size="50"/> <br>
> ~~~
`type="text"` ist default; muss also nicht angegeben werden.
Die Eingabefelder haben keine [Beschriftung](https://wiki.selfhtml.org/wiki/Label#label). Sie müssen aber eine haben.
So haben sie eine:
~~~html
<label>
Nachname: <input name="username" size="50">
</label><br>
<label>
Email: <input name="usermail" size="50">
</label><br>
~~~
Wobei anstatt `br`-Elemente zu verwenden besser die `label`-Elemente per Stylesheet auf `display: block` gesetzt werden sollte.
Die Punkte gehören nicht ins HTML. Wenn, dann sollten sie mit CSS erzeugt werden.
Oder so:
~~~html
<label for="username">Nachname:</label>
<input name="username" id="username" size="50">
<br>
<label for="usermail">Email:</label>
<input name="usermail" id="usermail" size="50">
<br>
~~~
oder besser:
~~~html
<p>
<label for="username">Nachname:</label>
<input name="username" id="username" size="50">
</p>
<p>
<label for="usermail">Email:</label>
<input name="usermail" id="usermail" size="50">
</p>
~~~
---
> ~~~html, bad
> <input type="Submit" name="senden" value="Absenden"/>
> ~~~
Für Buttons gibt es ein HTML-Element, das bevorzugt verwendet werden sollte:
~~~html
<button type="submit" name="senden">Absenden</button>
~~~
---
> ~~~html, bad
> <input type="Reset" name="reset" value="Abbrechen"/>
> ~~~
Reset-Button sind für Nutzer eher blöd als dass sie irgendeinen Nutzen hätten. Weg damit.
LLAP 🖖
--
“When UX doesn’t consider *all* users, shouldn’t it be known as ‘*Some* User Experience’ or... SUX? #a11y” —[Billy Gregory](https://twitter.com/thebillygregory/status/552466012713783297)