{"id":921,"date":"2008-06-28T15:09:39","date_gmt":"2008-06-28T13:09:39","guid":{"rendered":"http:\/\/notizblog.org\/?p=921"},"modified":"2021-04-15T17:38:40","modified_gmt":"2021-04-15T15:38:40","slug":"hforms-semantische-formulare","status":"publish","type":"post","link":"https:\/\/notiz.blog\/2008\/06\/28\/hforms-semantische-formulare\/","title":{"rendered":"hForms – Semantische Formulare"},"content":{"rendered":"\n

Warum sollte nur die Ausgabe ((X)HTML) semantisch anreichern und die Eingabe vernachl\u00e4ssigen?<\/p>\n\n\n\n

Beim spielen<\/em> mit dem hCard-Mappers<\/a> und der Firefox-Microformats-API<\/a> kam mir die Idee, auch Formulare semantisch auszuzeichnen…<\/p>\n\n\n\n

In dem Artikel Use the new microformats API in your Firefox 3.0 Extensions<\/a><\/em> beschreibt Rob Crowther wie man mit Hilfe der Firefox-Microformats-API eine hCard speichert um sie zum Ausf\u00fcllen verschiedener Formulare weiterverwenden zu k\u00f6nnen.<\/p>\n\n\n\n

Das Problem: Das Prinzip funktioniert leider nur bei Formularen die dem festgelegten Aufbau entsprechen. Im Fall des Beispiels w\u00e4re das:<\/p>\n\n\n

<h1<\/span>><\/span>hCardFormFiller Target Form<\/h1<\/span>><\/span>\n<form<\/span> action<\/span>=\"#\"<\/span> method<\/span>=\"post\"<\/span>><\/span>\n    <label<\/span>><\/span>Name: <input<\/span> type<\/span>=\"text\"<\/span> id<\/span>=\"name\"<\/span> \/><\/span><\/label<\/span>><\/span><br<\/span> \/><\/span>\n    <label<\/span>><\/span>Email: <input<\/span> type<\/span>=\"text\"<\/span> id<\/span>=\"email\"<\/span> \/><\/span><\/label<\/span>><\/span><br<\/span> \/><\/span>\n    <label<\/span>><\/span>Home page: <input<\/span> type<\/span>=\"text\"<\/span> id<\/span>=\"homepage\"<\/span> \/><\/span><\/label<\/span>><\/span><br<\/span> \/><\/span>\n    <label<\/span>><\/span>Street Address: <input<\/span> type<\/span>=\"text\"<\/span> id<\/span>=\"address1\"<\/span> \/><\/span><\/label<\/span>><\/span><br<\/span> \/><\/span>\n    <label<\/span>><\/span>City: <input<\/span> type<\/span>=\"text\"<\/span> id<\/span>=\"address2\"<\/span> \/><\/span><\/label<\/span>><\/span><br<\/span> \/><\/span>\n    <label<\/span>><\/span>Region: <input<\/span> type<\/span>=\"text\"<\/span> id<\/span>=\"city\"<\/span> \/><\/span><\/label<\/span>><\/span><br<\/span> \/><\/span>\n    <label<\/span>><\/span>Postcode: <input<\/span> type<\/span>=\"text\"<\/span> id<\/span>=\"postcode\"<\/span> \/><\/span><\/label<\/span>><\/span><br<\/span> \/><\/span>\n    <input<\/span> type<\/span>=\"submit\"<\/span> \/><\/span>\n<\/form<\/span>><\/span><\/code><\/span>Code-Sprache:<\/span> HTML, XML<\/span> (<\/span>xml<\/span>)<\/span><\/small><\/pre>\n\n\n
Warum nicht gleich das Formular als hCard-From aufbauen?<\/p>\n\n\n
<form<\/span> action<\/span>=\"#\"<\/span> method<\/span>=\"post\"<\/span> id<\/span>=\"vcard\"<\/span> ><\/span>\n  <fieldset<\/span> id<\/span>=\"fn\"<\/span>><\/span>\n    <legend<\/span>><\/span>Name<\/legend<\/span>><\/span>\n    <label<\/span> for<\/span>=\"given-name\"<\/span>><\/span>Vorname:<\/label<\/span>><\/span>\n      <input<\/span> type<\/span>=\"text\"<\/span> id<\/span>=\"given-name\"<\/span> \/><\/span>\n    <label<\/span> for<\/span>=\"family-name\"<\/span>><\/span>Nachname:<\/label<\/span>><\/span>\n      <input<\/span> type<\/span>=\"text\"<\/span> id<\/span>=\"family-name\"<\/span> \/><\/span>\n  <\/fieldset<\/span>><\/span>\n  <label<\/span> for<\/span>=\"email\"<\/span>><\/span>Email:<\/label<\/span>><\/span>\n    <input<\/span> type<\/span>=\"text\"<\/span> id<\/span>=\"email\"<\/span> \/><\/span>\n  <label<\/span> for<\/span>=\"url\"<\/span>><\/span>Homepage:<\/label<\/span>><\/span>\n    <input<\/span> type<\/span>=\"text\"<\/span> id<\/span>=\"url\"<\/span> \/><\/span>\n  <fieldset<\/span> id<\/span>=\"adr\"<\/span>><\/span>\n    <legend<\/span>><\/span>Adresse<\/legend<\/span>><\/span>\n    <label<\/span> for<\/span>=\"street-address\"<\/span>><\/span>Stra\u00dfe:<\/label<\/span>><\/span>\n      <input<\/span> type<\/span>=\"text\"<\/span> id<\/span>=\"street-address\"<\/span> \/><\/span>\n    <label<\/span> for<\/span>=\"locality\"<\/span>><\/span>Stadt:<\/label<\/span>><\/span>\n      <input<\/span> type<\/span>=\"text\"<\/span> id<\/span>=\"locality\"<\/span> \/><\/span>\n    <label<\/span> for<\/span>=\"region\"<\/span>><\/span>Region:<\/label<\/span>><\/span>\n      <input<\/span> type<\/span>=\"text\"<\/span> id<\/span>=\"region\"<\/span> \/><\/span>\n    <label<\/span> for<\/span>=\"postal-code\"<\/span>><\/span>Postleitzahl:<\/label<\/span>><\/span>\n      <input<\/span> type<\/span>=\"text\"<\/span> id<\/span>=\"postal-code\"<\/span> \/><\/span>\n  <\/fieldset<\/span>><\/span>\n  <input<\/span> type<\/span>=\"submit\"<\/span> \/><\/span>\n<\/form<\/span>><\/span><\/code><\/span>Code-Sprache:<\/span> HTML, XML<\/span> (<\/span>xml<\/span>)<\/span><\/small><\/pre>\n\n\n
Sch\u00f6ne neue Welt \ud83d\ude42<\/p>\n","protected":false},"excerpt":{"rendered":"
Warum sollte nur die Ausgabe ((X)HTML) semantisch anreichern und die Eingabe vernachl\u00e4ssigen? Beim spielen mit dem hCard-Mappers und der Firefox-Microformats-API kam mir die Idee, auch Formulare semantisch auszuzeichnen… In dem Artikel Use the new microformats API in your Firefox 3.0 Extensions beschreibt Rob Crowther wie man mit Hilfe der Firefox-Microformats-API eine hCard speichert um sie […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"webmentions_disabled_pings":false,"webmentions_disabled":false,"activitypub_content_warning":"","activitypub_content_visibility":"","activitypub_max_image_attachments":4,"activitypub_interaction_policy_quote":"anyone","activitypub_status":"","footnotes":""},"categories":[2],"tags":[176,130,661,166,164,381],"class_list":{"0":"post-921","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-web","7":"tag-addon","8":"tag-firefox","9":"tag-forms","10":"tag-hcard","11":"tag-microformats","12":"tag-vcard","13":"h-entry","14":"hentry"},"_links":{"self":[{"href":"https:\/\/notiz.blog\/wp-api\/wp\/v2\/posts\/921","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/notiz.blog\/wp-api\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/notiz.blog\/wp-api\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/notiz.blog\/wp-api\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/notiz.blog\/wp-api\/wp\/v2\/comments?post=921"}],"version-history":[{"count":1,"href":"https:\/\/notiz.blog\/wp-api\/wp\/v2\/posts\/921\/revisions"}],"predecessor-version":[{"id":21355,"href":"https:\/\/notiz.blog\/wp-api\/wp\/v2\/posts\/921\/revisions\/21355"}],"wp:attachment":[{"href":"https:\/\/notiz.blog\/wp-api\/wp\/v2\/media?parent=921"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/notiz.blog\/wp-api\/wp\/v2\/categories?post=921"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/notiz.blog\/wp-api\/wp\/v2\/tags?post=921"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
Das Einheitliche Format f\u00fcr Ein- (Formular) und Ausgabe (Microformats) h\u00e4tte zur Folge, dass keine aufwendigen Mapper (wie z.B. hCard-Mapper<\/a>) mehr n\u00f6tig w\u00e4ren um ein Formular per hCard<\/a> auszuf\u00fcllen…<\/p>\n\n\n\n