joerghuelsermann.de Suchmaschinenoptimierung für fullmetalseo2013 mit Formularen

Suchmaschinenoptimierung für fullmetalseo2013 mit Formularen

Führen wir ein kleines Experiment mit Formularen durch, indem wir im Grunde einen Link nachbilden. Dazu benötigen wir nur ein Formular. Wir bauen aber mehrere um einige Fälle unterscheiden zu können. Anstatt mit einem Link den Abschnitt fullmetalseo2013 aufzurufen, werden wir ein Formular zu diesem Zweck einsetzen.

Sicher es wird auf jeden Fall schwierig eine Auswirkung dieser Formulare auf den Suchbegriff fullmetalseo2013 nachvollziehen zu können. Erstellen würde ich diese Seite aber nicht, wenn ich nicht dabei etwas Wissen über Formulare weitergeben könnte.

fullmetalseo2013 mit Methode Get aufrufen

<form action="/artikel/seo/#fullmetalseo2013" method="get">
<fieldset>
<legend>Formular mit Get Methode</legend>
<input type="submit" value="fullmetalseo2013" />
</fieldset>
</form>
fullmetalseo2013 durch Formular aufrufen
Formular mit Get Methode

fullmetalseo2013 mit Methode Post aufrufen

Im Grunde ist es reichlich sinnlos eine Unterscheidung zwischen der Kodierung von Daten zu treffen, wenn man keine übergibt.

Daten für fullmetalseo2013 werden als application/x-www-form-urlencoded gesendet

Die Angabe des entype Attributes entspricht der Voreinstellung und kann somit auch ausgelassen werden. Bei dieser Übertragung der Daten werden sie als Parameter gesendet.

<form action="/artikel/seo/#fullmetalseo2013" method="post" enctype="application/x-www-form-urlencoded">
<fieldset>
<legend>Formular mit POST Methode und Attribut enctype mit Wert application/x-www-form-urlencoded</legend>
<input type="submit" value="fullmetalseo2013" />
</fieldset>
</form>
fullmetalseo2013 durch Formular aufrufen
Formular mit POST Methode und Attribut enctype mit Wert application/x-www-form-urlencoded

Daten für fullmetalseo2013 werden als multipart/form-data gesendet

Es wird eine Datenreihe übergeben bei dieser Übertragungsform. Anwendung dieser Kodierung ist bim Hochladen von Dateien Vorraussetzung.

<form action="/artikel/seo/#fullmetalseo2013" method="post" enctype="multipart/form-data">
<fieldset>
<legend>Formular mit POST Methode und Attribut enctype mit Wert multipart/form-data</legend>
<input type="submit" value="fullmetalseo2013" />
</fieldset>
</form>
fullmetalseo2013 durch Formular aufrufen
Formular mit POST Methode und Attribut enctype mit Wert multipart/form-data

Daten für fullmetalseo2013 werden als text/plain gesendet

Mit dieser Übertragung der Daten habe ich mich in der Praxis noch nie befasst. Deshalb erwähne ich diese Möglichkeit nur der Vollständigkeit halber.

<form action="/artikel/seo/#fullmetalseo2013" method="post" enctype="text/plain">
<fieldset>
<legend>Formular mit POST Methode und Attribut enctype mit Wert text/plain</legend>
<input type="submit" value="fullmetalseo2013" />
</fieldset>
</form>
fullmetalseo2013 durch Formular aufrufen
Formular mit POST Methode und Attribut enctype mit Wert text/plain

Formular verweist auf die Startseite und ist deaktiviert und verfügt über die id fullmetalseo2013

Hintergrund dieses Formulares sind die neuen Attribute für die input und button Elemente unter HTML5. Ich gehe gerne den Weg Beispiele auch in der Praxis vorzuführen um ein besseres Verständnis zu entwickeln. Mit den Attributen formmethod, formenctype und formaction kann man die betreffenden Attribute in Formularen überschreiben. Dabei muss man nur über das Attribut form das entsprechende Formular ansprechen was über ein id Attribut mit dem selben Wert verfügen muss.

Es existieren drei Beispiele die dieses Formular überschreiben, wo ich dabei auch die drei Möglichkeiten vorstelle, wie man das Senden des Formulares auslöst. Aus diesem Grunde ist auch das folgende Formular durch das Attribut disabled deaktiviert.

<form id="fullmetalseo2013" action="/" method="POST">
<fieldset>
<legend>Deaktiviertes Formular</legend>
<input type="submit" value="Startseite" disabled="disabled" />
</fieldset></form>
fullmetalseo2013 durch Formular aufrufen
Deaktiviertes Formular

input Element mit type submit

Die Methode, die wahrscheinlich am häufigsten verwendet wird geschieht über das input Element. Ohne Angabe eines value Attributes wird ein je nach Browser unterschiedlicher Wert als Voreinstellung genommen zur Beschriftung dieses Elementes.

<input type="submit" value="fullmetalseo2013" form="fullmetalseo2013" formaction="/artikel/seo/#fullmetalseo2013" formmethod="GET" formenctype="application/x-www-form-urlencoded" />
fullmetalseo2013 durch Formular aufrufen

button Element mit type submit

Beim button Element müsste ich den Wert submit für das Attribut type nicht unbedingt setzen, weil es die Voreinstellung ist.

<button type="submit" form="fullmetalseo2013" formaction="/artikel/seo/#fullmetalseo2013" formmethod="GET" formenctype="application/x-www-form-urlencoded">fullmetalseo2013</button>
fullmetalseo2013 durch Formular aufrufen

input Element mit type image

Durch das Attribut type mit dem Wert image ist der Einsatz von Bilder, was auch SVG Dateien einschliesst möglich.

<input type="image" form="fullmetalseo2013" formaction="/artikel/seo/#fullmetalseo2013" formmethod="POST" src="/artikel/seo/fullmetalseo2013.svg" width="150" height="150" alt="fullmetalseo2013" formenctype="application/x-www-form-urlencoded" />
fullmetalseo2013 durch Formular aufrufen