zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > (X)HTML
Seite neu laden Formular unter XHTML 1.0 Strict

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 10.07.2007, 15:58
Benutzerbild von SPMan
The Oncoming Storm
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 23.05.2004
Ort: Metropolis
Beiträge: 1.243
SPMan wird schon bald berühmt werden
Frage Formular unter XHTML 1.0 Strict

Hallo,

ich möchte mich erkundigen, da ja auch viele Attribute unter XHTML 1.0 Strict nicht mehr erlaubt sind, wie Ihr in der Regel ein Fomular aufbaut, bzw. wie man es am besten, auch unter Barriefreihen- und Gestaltungsapekten, unter XHTML 1.0 Strict aufbauen sollte.
Ich benutze PHP zur Kontaktformularabfrage/überprüfung und habe bisher nach Transitional validiert.
__________________
"Glück entsteht oft durch Aufmerksamkeit in kleinen Dingen."
- Wilhelm Busch
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 10.07.2007, 16:25
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 13.07.2006
Beiträge: 414
Maxefix ist ein sehr geschätzer MenschMaxefix ist ein sehr geschätzer MenschMaxefix ist ein sehr geschätzer Mensch
Standard

Rein vom technischen her gibt's in dem Fall wohl kaum Unterschiede zwischen Stricht und Transitional.

Wegen Barrierefreiheit: Labels verwenden, Fieldsets und Legends auch (kann man ja ausblenden, wenn sie nicht ins Layout passen. Schön finde ich persönlich auch Title-Attribute bei den Input-Feldern (siehe Beispiel). Wär schön, wenn das Formular per CSS formatiert wird, wobei da eine Tabelle meiner Meinung nicht so tragisch wäre.
PHP-Code:
<form action="index.php" method="post">
  <
fieldset>
    <
legend>Ihre Kontaktdaten:</legend>
      <
label for="name">Ihr Name:</label>
      <
input type="text" name="name" id="name" title="Bitte geben Sie Ihren Namen an." value="" />
      <
br class="clear" />
      <
label for="email">Ihre E-Mail-Adresse:</label>
      <
input type="text" name="email" id="email" title="Bitte geben Sie Ihre E-Mail-Adresse an." value="" />
      <
br class="clear" />
  </
fieldset>
</
form
Gruß

Max
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 10.07.2007, 16:45
Benutzerbild von SPMan
The Oncoming Storm
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 23.05.2004
Ort: Metropolis
Beiträge: 1.243
SPMan wird schon bald berühmt werden
Standard

Okay,

dann ist es ja nicht viel anders zu dem, wie ich es bisher gehandhabt habe.
Tabellen zur Anordnung von Formularen habe ich auch schon lange nicht mehr genutzt.
<legend> habe ich allerdings bisher nicht genutzt, wohl aufgrund, dass ich bisher in einem Formlat nie gruppieren musste.
(wie z.B. bei einem Bestelltformular: Ihre Adresse / Lieferanschift(wenn abweichend) / Kontodaten, o.ä.)

Darf ich fragen, warum Du nach jedem Element zu clearen scheinst (oder wofür ist das <br /> in Verbindung mit der Klasse da?)?

Wie gehe ich mit <option></option>, wenn der erste Eintrag leer sein soll? Denn ich möchte nicht schon für den Besucher eine Wertung vornehmen(z.B. Herr/Frau oder Firma zuerst).
__________________
"Glück entsteht oft durch Aufmerksamkeit in kleinen Dingen."
- Wilhelm Busch
Mit Zitat antworten
  #4 (permalink)  
Alt 10.07.2007, 17:00
Benutzerbild von ArcVieh
//
XHTMLforum-Kenner
 
Registriert seit: 19.12.2006
Ort: Gütersloh
Beiträge: 1.844
ArcVieh sorgt für eine eindrucksvolle AtmosphäreArcVieh sorgt für eine eindrucksvolle Atmosphäre
Standard

Code:
<form action="" method="POST">
	<fieldset>
		<legend>Daten sammeln</legend>
		<dl>
			<dt><label for="name">Ihr Name</label></dt>
			<dd><input type="text" id="name" name="name" /></dd>
			<dt><label for="mail">E-Mail</label></dt>
			<dd><input type="text" id="mail" name="mail" /></dd>
		</dl>
	</fieldset>
	<fieldset>
		<legend>Eintrag hinterlassen</legend>
		<dl>
			<dt><label for="text">Ihr Eintrag</label></dt>
			<dd><textarea name="text" id="text" rows="25" cols="15"></textarea></dd>
			<dt><label for="enter">Eintrag absenden</label></dt>
			<dd><input type="submit" name="enter" id="enter" value="Enter" /></dd>
		</dl>
	</fieldset>
</form>
Das alles in einem form- Tag zu verschachteln macht folgenden Sinn: Man kann es in der CSS besser selektieren.
Er verwendet das <br/> zum clearen, er will das label neben dem input haben, daher muss er floaten. Eine Klasse clearfix zu verwenden ist aber öde, Easy Clearing mit dem Pseudo-Element after ist da eher zu empfehlen.

EDIT: Siehe auch hier.
__________________
CSS-FAQ beantwortet die meisten Fragen | Retro coding gegen Divitis | Code validieren & posten für Hilfe

Geändert von ArcVieh (10.07.2007 um 17:05 Uhr)
Mit Zitat antworten
  #5 (permalink)  
Alt 10.07.2007, 17:12
Benutzerbild von SPMan
The Oncoming Storm
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 23.05.2004
Ort: Metropolis
Beiträge: 1.243
SPMan wird schon bald berühmt werden
Standard

Mmmh... diese Verschachtelung bei einem Formular war mir bisher wirklich neu.
Wie erwähnt, habe ich <legend> bisher nicht genutzt, da ich einfach keine Gruppierung vornehmen musste.
__________________
"Glück entsteht oft durch Aufmerksamkeit in kleinen Dingen."
- Wilhelm Busch

Geändert von SPMan (10.07.2007 um 19:15 Uhr)
Mit Zitat antworten
  #6 (permalink)  
Alt 10.07.2007, 17:17
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 13.07.2006
Beiträge: 414
Maxefix ist ein sehr geschätzer MenschMaxefix ist ein sehr geschätzer MenschMaxefix ist ein sehr geschätzer Mensch
Standard

Zitat:
Zitat von SPMan Beitrag anzeigen
Darf ich fragen, warum Du nach jedem Element zu clearen scheinst (oder wofür ist das <br /> in Verbindung mit der Klasse da?)?
Wie ArcVieh schon richtig erkannt hat, floate ich das Label und die Input-Felder. Also muss ich auch wieder clearen. Und da ich ein <br /> sowieso brauch (sonst siehts ohne CSS noch katastrophaler aus...) kann ich das ja gleich dafür hernehmen.
Zitat:
Zitat von SPMan Beitrag anzeigen
Wie gehe ich mit <option></option>, wenn der erste Eintrag leer sein soll? Denn ich möchte nicht schon für den Besucher eine Wertung vornehmen(z.B. Herr/Frau oder Firma zuerst).
PHP-Code:
<select name="anrede" id="anrede" size="1">
  <
option value="">-- Bitte wählen Sie aus --</option>
  <
option value="Frau">Frau</option>
  <
option value="Herr">Herr</option>
  <
option value="Firma">Firma</option>
</
select
Wäre IMO die beste Lösung.

Die Lösung von ArcVieh find ich auch sehr gut. Eine Definitionsliste macht in dem Fall ja Sinn.

Gruß

Max
Mit Zitat antworten
  #7 (permalink)  
Alt 10.07.2007, 17:36
Benutzerbild von ArcVieh
//
XHTMLforum-Kenner
 
Registriert seit: 19.12.2006
Ort: Gütersloh
Beiträge: 1.844
ArcVieh sorgt für eine eindrucksvolle AtmosphäreArcVieh sorgt für eine eindrucksvolle Atmosphäre
Standard

Zitat:
Zitat von Maxefix Beitrag anzeigen
Und da ich ein <br /> sowieso brauch (sonst siehts ohne CSS noch katastrophaler aus...)
Daher verwende ich unter anderem eine definitions Liste.
Fieldsets sind dazu gedacht um Formulare logisch zu gruppieren, SPMan.

EDIT: Wieso, wenn Du schon ein br verwendest, dem br eine Klasse zuweisen?
Code:
form fieldset br {
   clear:both;
}
__________________
CSS-FAQ beantwortet die meisten Fragen | Retro coding gegen Divitis | Code validieren & posten für Hilfe

Geändert von ArcVieh (10.07.2007 um 18:05 Uhr)
Mit Zitat antworten
  #8 (permalink)  
Alt 11.07.2007, 12:56
Benutzerbild von SPMan
The Oncoming Storm
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 23.05.2004
Ort: Metropolis
Beiträge: 1.243
SPMan wird schon bald berühmt werden
Standard

Ich möchte nun versuche das Formular in einer Definitionsliste unterzubringen.
Gibt es da, einschl. CSS(Gestaltung bei Formularen mit Definitionsliste), irgendwelche Praxisbeispiele?
Denn es sollte, wenn möglich, in etwas so...

...aussehen.
__________________
"Glück entsteht oft durch Aufmerksamkeit in kleinen Dingen."
- Wilhelm Busch
Mit Zitat antworten
  #9 (permalink)  
Alt 11.07.2007, 13:03
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Ganz einfach: dt mit passender Breite links floaten (kann auch clearen, muß aber nicht) und text-align: right; zuweisen, und dd bekommt passenden margin-left, sowie margin-bottom (kann auch padding sein) für den vertikalen Abstand zur nächsten Zeile (dt hat keinerlei margin).
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 12.07.2007, 01:12
Benutzerbild von SPMan
The Oncoming Storm
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 23.05.2004
Ort: Metropolis
Beiträge: 1.243
SPMan wird schon bald berühmt werden
Standard

Sooo... ich habe mich gerade die ganze letzte Zeit mit dem PHP-Teil meines Formulars herumgeschlagen, bis ich bemerkt habe, dass das Formular nur auf meine Account nicht funktioniert. Selbst bei dem selben Hoster auf einem anderen Server funktioniert es. Mal sehen, was der Hoster schreiben wird.

Nichtsdestotrotz habe ich mal das bisherige Ergebnis (nur XHTML auf dem Freehostserver) online gestellt. Es passt zwar noch nicht 100%ig(die Felder), aber ich hoffe, dass ich es im Grunde richtig umgesetzt habe.
Etwaige Verbesserungsvorschläge für das Formular, auch optisch, "höre" ich mir gerne an. LINK
__________________
"Glück entsteht oft durch Aufmerksamkeit in kleinen Dingen."
- Wilhelm Busch
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
IE6 und transparente Hintergrundbilder (XHTML 1.0 Strict) opa-rudi CSS 1 11.11.2008 12:59
html 4.01 > xhtml 1.0 strict / ie Problem ringelwürmsche (X)HTML 8 09.10.2008 19:38
XHTML 1.0 strict: interpretation von alt und title (IMG) vom IE7, Opera und Firefox braindead (X)HTML 5 11.03.2007 17:57
XHTML 1.0 Transitional VS. Strict Despairing (X)HTML 24 07.06.2006 21:07
XHTML 1.0 strict und input in formular Heavenfighter (X)HTML 5 10.08.2004 11:48


Alle Zeitangaben in WEZ +2. Es ist jetzt 09:07 Uhr.