tag:forum.selfhtml.org,2005:/self Suchformular aufhübschen – SELFHTML-Forum 2017-07-27T13:03:15Z https://forum.selfhtml.org/self/2017/jul/26/suchformular-aufhuebschen/1700122#m1700122 Sophie 2017-07-26T20:17:04Z 2017-07-26T20:17:04Z Suchformular aufhübschen <p>Hallo,</p> <p>ich bin für jeden Tipp dankbar. Wie könnte ich mein hässliches Formular etwas aufhübschen dass es nicht mehr so amateurhaft aussschaut? Vielleicht die Lables weg? Oder oben drüber? Ich habe keine Ahnung </p> <p><a href="/images/b432223e-2e28-45c5-8630-822f7f9856bb.jpg" rel="noopener noreferrer"><img src="/images/b432223e-2e28-45c5-8630-822f7f9856bb.jpg?size=medium" alt="" loading="lazy"></a></p> <p>Mein HTML schaut so aus:</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>suchkriterien-Zeiten<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>form</span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>form1<span class="token punctuation">"</span></span> <span class="token attr-name">method</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>post<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>name<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Name<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>select</span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>name<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>name<span class="token punctuation">"</span></span> <span class="token special-attr"><span class="token attr-name">style</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value css language-css"><span class="token property">width</span><span class="token punctuation">:</span> 15em<span class="token punctuation">;</span></span><span class="token punctuation">"</span></span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span><span class="token punctuation">></span></span>-- Bitte wählen --<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>option</span><span class="token punctuation">></span></span> <span class="token prolog"><?php $aPersonal = Personal_Uebersicht($mysqli); foreach($Personal as $array){ ?></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><?php echo htmlspecialchars($array['per_code']);?><span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token prolog"><?php echo htmlspecialchars($array['per_vorname']) ." ". htmlspecialchars($array['per_name']);?></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>option</span><span class="token punctuation">></span></span> <span class="token prolog"><?php } ?></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>select</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>projektnummer<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Projektnummer<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>projektnummer<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>projektnummer<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>datum_von<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Von<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>datum_von<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>datum_von<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span> <span class="token special-attr"><span class="token attr-name">style</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value css language-css"><span class="token property">width</span><span class="token punctuation">:</span> 10em<span class="token punctuation">;</span></span><span class="token punctuation">"</span></span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>datum_bis<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Bis<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>datum_bis<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>datum_bis<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span> <span class="token special-attr"><span class="token attr-name">style</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value css language-css"><span class="token property">width</span><span class="token punctuation">:</span> 10em<span class="token punctuation">;</span></span><span class="token punctuation">"</span></span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>submit<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>abschicken<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>abschicken<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Suchen<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>btn_ok<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>form</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> </code></pre> <p>PS: An die Administratoren @Matthias Apsel @Christian Kruse warum ist der Upload nicht mehr so schön wie früher dass man einfach etwas rein kopieren kann? Ich muss umständlich auf das Bild oben in der Leiste gehen, dann auf Upload, alles etwas umständlicher?</p> https://forum.selfhtml.org/self/2017/jul/26/suchformular-aufhuebschen/1700124#m1700124 Matthias Apsel matthias.apsel@selfhtml.org http://brückentage.info 2017-07-26T20:19:05Z 2017-07-26T20:22:15Z Suchformular aufhübschen <p>Hallo Sophie,</p> <blockquote> <p>warum ist der Upload nicht mehr so schön wie früher dass man einfach etwas rein kopieren kann?</p> </blockquote> <p>Weil das Drag und Drop häufiger Anlass zu Kritik als zu Lob gab.</p> <p>Bis demnächst<br> Matthias</p> <div class="signature">-- <br> Rosen sind rot. </div> https://forum.selfhtml.org/self/2017/jul/26/suchformular-aufhuebschen/1700157#m1700157 1unitedpower 2017-07-27T07:32:48Z 2017-07-27T07:32:48Z Suchformular aufhübschen <blockquote> <p>ich bin für jeden Tipp dankbar.</p> </blockquote> <p>Tipp: Lass dich von anderen Suchformularen inspirieren, zum Beispiel das von <a href="http://www.fluege.de/" rel="nofollow noopener noreferrer">http://www.fluege.de/</a> oder <a href="https://www.airbnb.de" rel="nofollow noopener noreferrer">https://www.airbnb.de</a>.</p> <blockquote> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>form</span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>form1<span class="token punctuation">"</span></span> <span class="token attr-name">method</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>post<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> </code></pre> </blockquote> <p>Suchformulare sollten <code>get</code> und nicht <code>post</code> verwenden. Dann werden die Suchparameter in die Adresse der Ergebnisseite mit aufgenommen und du kannst den Link speichern und teilen und musst nicht jedesmal das Formular erneut ausfüllen.</p> https://forum.selfhtml.org/self/2017/jul/26/suchformular-aufhuebschen/1700161#m1700161 Henry 2017-07-27T08:34:08Z 2017-07-27T08:34:08Z Suchformular aufhübschen <p>Hallo Sophie,</p> <blockquote> <p>ich bin für jeden Tipp dankbar. Wie könnte ich mein hässliches Formular etwas aufhübschen dass es nicht mehr so amateurhaft aussschaut? Vielleicht die Lables weg? Oder oben drüber? Ich habe keine Ahnung </p> </blockquote> <p>Da lässt sich, dank CSS3, designtechnisch mittlerweile eine Menge machen. Und Beispiele/Anregungen gibt's <a href="http://www.bing.com/search?q=css+nice+forms&go=Anfrage+senden&qs=ds&form=QBLH&pc=EUPP_" rel="nofollow noopener noreferrer">ohne Ende im Netz</a>. <a href="https://www.sanwebe.com/2014/08/css-html-forms-designs" rel="nofollow noopener noreferrer">zb. dies</a>. Ich weiß zwar nicht warum du explizit nach Suchformular fragst, aber letztendlich ist es auch nur ein Eingabefeld oder verstehe ich dich falsch?</p> <blockquote> <p>An die Administratoren @Matthias Apsel @Christian Kruse warum ist der Upload nicht mehr so schön wie früher dass man einfach etwas rein kopieren kann? Ich muss umständlich auf das Bild oben in der Leiste gehen, dann auf Upload, alles etwas umständlicher?</p> </blockquote> <p>Ja, finde ich auch schade, ließ sich aber wohl leider nicht vermeiden. Ertappe mich auch gerade dabei, dass ich bei dem Folgenden einen Screenshot <strong>nicht</strong> mitliefere, weil nicht unbedingt notwendig und ich zu lustlos für die ganzen Klicks bin.</p> <p>@Admins</p> <ul> <li> <p>War etwas verwirrt, weil schon Antwort akzeptiert stand. Wollte schon wieder weiter als ich merkte, dass sich die Antwort nur auf den Upload bezog. Dabei fiel mir auch auf, dass ich den Häkchen-Button (Antwort akzeptiert) anklicken kann. Weiß zwar nicht ob das überhaupt eine Auswirkung hat, aber dürfte doch eigentlich nicht sein?</p> </li> <li> <p>Wollte zuerst anders antworten und hatte aber schon "Zitat einfügen" benutzt. OK, dann auf Abbrechen und wieder neu auf "antworten". Geht aber nicht, weil die Option dann weg ist, musste erst Seite komplett neu laden. Ist das so gewollt?</p> </li> </ul> <p>Gruss<br> Henry</p> https://forum.selfhtml.org/self/2017/jul/26/suchformular-aufhuebschen/1700125#m1700125 Sophie 2017-07-26T20:20:11Z 2017-07-26T20:20:11Z Suchformular aufhübschen <p>Hallo @Matthias Apsel</p> <p>danke für die Antwort, dann weiß ich bescheid.</p> https://forum.selfhtml.org/self/2017/jul/26/suchformular-aufhuebschen/1700127#m1700127 Gunnar Bittersmann selfhtml@bittersmann.de http://bittersmann.de 2017-07-26T20:26:20Z 2017-07-26T20:26:20Z Bildupload <p>@@Matthias Apsel</p> <blockquote> <blockquote> <p>warum ist der Upload nicht mehr so schön wie früher dass man einfach etwas rein kopieren kann?</p> </blockquote> <p>Weil das Drag und Drop häufiger Anlass zu Kritik als zu Lob gab.</p> </blockquote> <p>?? Hab’ ich da was verpasst? Was gab’s daran zu kritisieren? Warum fragt mich keiner, wenn ich mal was zu loben habe?</p> <p>Und wie kann man jetzt ein Bild einfügen? Nein, keins von der lokalen Platte, sondern wo ist die Funktion hin, die mal hinter dem Bild-Icon steckte: einen URI zu einem Bild anzugeben?</p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> https://forum.selfhtml.org/self/2017/jul/26/suchformular-aufhuebschen/1700132#m1700132 Gunnar Bittersmann selfhtml@bittersmann.de http://bittersmann.de 2017-07-26T20:33:59Z 2017-07-26T20:33:59Z Bildupload <p>@@Gunnar Bittersmann</p> <p>Wo wir gerade dabei sind: „Bitte geben Sie einen Bild-Titel an“</p> <p>Äh nein, bitte tun Sie’s nicht! Nervige Tooltips nerven. Das braucht kein Mensch.</p> <p>Kann man dieses Eingabefeld bitte in die Mülltonne entsorgen‽</p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> https://forum.selfhtml.org/self/2017/jul/26/suchformular-aufhuebschen/1700134#m1700134 Matthias Apsel matthias.apsel@selfhtml.org http://brückentage.info 2017-07-26T20:36:12Z 2017-07-26T20:36:12Z Bildupload <p>Hallo Gunnar Bittersmann,</p> <blockquote> <p>?? Hab’ ich da was verpasst? Was gab’s daran zu kritisieren?</p> </blockquote> <p>Es hat einfach nicht zuverlässig funktioniert.</p> <blockquote> <p>Und wie kann man jetzt ein Bild einfügen? Nein, keins von der lokalen Platte, sondern wo ist die Funktion hin, die mal hinter dem Bild-Icon steckte: einen URI zu einem Bild anzugeben?</p> </blockquote> <p>Wir wollen die Bilder bei uns haben<sup class="footnote-ref"><a href="#fn1" id="fnref1">[1]</a></sup>, deshalb haben wir das Einbinden fremder Bilder erschwert, nur noch über Markdown-Syntax.</p> <p>Bis demnächst<br> Matthias</p> <div class="signature">-- <br> Rosen sind rot. </div> <hr class="footnotes-sep"> <section class="footnotes"> <ol class="footnotes-list"> <li id="fn1" class="footnote-item"><p>damit sie auch nach Jahren noch beim Beitrag stehen und auch das Urheberrecht spielte eine, wenn auch untergeordnete, Rolle. <a href="#fnref1" class="footnote-backref">↩︎</a></p> </li> </ol> </section> https://forum.selfhtml.org/self/2017/jul/26/suchformular-aufhuebschen/1700162#m1700162 Gunnar Bittersmann selfhtml@bittersmann.de http://bittersmann.de 2017-07-27T08:51:49Z 2017-07-27T08:51:49Z Suchformular aufhübschen <p>@@Henry</p> <blockquote> <p><a href="https://www.sanwebe.com/2014/08/css-html-forms-designs" rel="nofollow noopener noreferrer">zb. dies</a></p> </blockquote> <p>Bei <em lang="en">„Some forms here do not have labels, they rely on HTML5 placeholder attribute“</em> ist man glatt geneigt aufzuhören zu lesen (und das ist kein Ding von <em lang="en">„older browsers do not support this“</em>). <a href="http://mentalized.net/journal/2010/08/05/dont-use-placeholder-text-as-labels/" rel="nofollow noopener noreferrer">Nicht machen,</a> Kinder! <a href="http://www.456bereastreet.com/archive/201204/the_html5_placeholder_attribute_is_not_a_substitute_for_the_label_element/" rel="nofollow noopener noreferrer">Placeholder sind kein Ersatz für Label.</a></p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> https://forum.selfhtml.org/self/2017/jul/26/suchformular-aufhuebschen/1700164#m1700164 Henry 2017-07-27T09:30:50Z 2017-07-27T09:30:50Z Suchformular aufhübschen <p>Hallo Gunnar,</p> <blockquote> <p>Bei <em lang="en">„Some forms here do not have labels, they rely on HTML5 placeholder attribute“</em> ist man glatt geneigt aufzuhören zu lesen (und das ist kein Ding von <em lang="en">„older browsers do not support this“</em>). <a href="http://mentalized.net/journal/2010/08/05/dont-use-placeholder-text-as-labels/" rel="nofollow noopener noreferrer">Nicht machen,</a> Kinder! <a href="http://www.456bereastreet.com/archive/201204/the_html5_placeholder_attribute_is_not_a_substitute_for_the_label_element/" rel="nofollow noopener noreferrer">Placeholder sind kein Ersatz für Label.</a></p> </blockquote> <p>Da hättest du natürlich recht, wenn es dort so wäre (weiß nicht warum die das schreiben), denn nur ganz wenige Beispiele dort haben keine Labels.</p> <p>Gruss<br> Henry</p> https://forum.selfhtml.org/self/2017/jul/26/suchformular-aufhuebschen/1700167#m1700167 Gunnar Bittersmann selfhtml@bittersmann.de http://bittersmann.de 2017-07-27T09:36:43Z 2017-07-27T09:36:43Z Suchformular aufhübschen <p>@@Henry</p> <blockquote> <blockquote> <p>Bei <em lang="en">„Some forms here do not have labels, they rely on HTML5 placeholder attribute“</em> ist man glatt geneigt aufzuhören zu lesen (und das ist kein Ding von <em lang="en">„older browsers do not support this“</em>). <a href="http://mentalized.net/journal/2010/08/05/dont-use-placeholder-text-as-labels/" rel="nofollow noopener noreferrer">Nicht machen,</a> Kinder! <a href="http://www.456bereastreet.com/archive/201204/the_html5_placeholder_attribute_is_not_a_substitute_for_the_label_element/" rel="nofollow noopener noreferrer">Placeholder sind kein Ersatz für Label.</a></p> </blockquote> <p>Da hättest du natürlich recht, wenn es dort so wäre (weiß nicht warum die das schreiben), denn nur ganz wenige Beispiele dort haben keine Labels.</p> </blockquote> <p>Und diese ganz wenigen sind einige zu viel.</p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> https://forum.selfhtml.org/self/2017/jul/26/suchformular-aufhuebschen/1700175#m1700175 Julius 2017-07-27T10:40:58Z 2017-07-27T10:43:13Z Suchformular aufhübschen <p>Hallo Henry,</p> <blockquote> <p>Da hättest du natürlich recht, wenn es dort so wäre (weiß nicht warum die das schreiben), denn nur ganz wenige Beispiele dort haben keine Labels.</p> </blockquote> <p>Aber die, die welche haben, sind falsch, die Label beziehen sich nicht auf das zugehörige Eingabefeld. Beispielsweise folgendes Schnipselchen:</p> <pre><code class="block bad language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>name<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Name<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>name<span class="token punctuation">"</span></span> <span class="token attr-name">maxlength</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>100<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> </code></pre> <p>Entweder müsste es so:</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>name<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Name<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>name<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>name<span class="token punctuation">"</span></span> <span class="token attr-name">maxlength</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>100<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> </code></pre> <p>oder so gemacht werden:</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span><span class="token punctuation">></span></span> Name <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>name<span class="token punctuation">"</span></span> <span class="token attr-name">maxlength</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>100<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> </code></pre> <p>Des weiteren bin ich mir unsicher, ob man bei einem Namen <code>maxlength</code> setzen sollte, bei einem Nickname vielleicht ja, aber sonst? Bei URLs ist das sogar ziemlich hinderlich.</p> <p>Auch ist mir aufgefallen, dass das <code>required</code>-Attribut trotz Pflichtfeld nicht gesetzt wurde.</p> <p>Insgesamt: Wenn man Design-Anregungen braucht, ok. Aber bitte das Markup nicht einfach so kopieren und die Beispiele mit den falsch benutzten placeholdern bitte nicht nachbauen (was Gunnar ja schon sagte).</p> <p>Gruß<br> Julius</p> https://forum.selfhtml.org/self/2017/jul/26/suchformular-aufhuebschen/1700177#m1700177 Henry 2017-07-27T10:54:59Z 2017-07-27T11:02:21Z Suchformular aufhübschen <p>Hallo Julius,</p> <blockquote> <p>Insgesamt: Wenn man Design-Anregungen braucht, ok. Aber bitte das Markup nicht einfach so kopieren und die Beispiele mit den falsch benutzten placeholdern bitte nicht nachbauen (was Gunnar ja schon sagte).</p> </blockquote> <p>Das es nur als Anregung dienen soll, habt ihr beide natürlich recht und deine detaillierten Schwachstellen verdienen mal wieder einen Punkt danke.</p> <p>Gruss<br> Henry</p> <p>*unwichtiger Nachtrag<br> Habe jetzt erst bei deiner Bewertung die Medaille "Enthusiast" bekommen (Der Anwender hat mindestens einen Beitrag positiv bewertet), obwohl ich schon mehrmals Bewertungen vorgenommen habe. Denke das hat mit dem <a href="https://forum.selfhtml.org/meta/2017/jul/22/punktevergabe-und-mitgliederbereich/1699767#m1699767" rel="noopener noreferrer">ursprünglichen und bereits behobenen Problem</a> zu tun. Müsste dann wahrscheinlich noch ein Updatescript über die User laufen?</p> https://forum.selfhtml.org/self/2017/jul/26/suchformular-aufhuebschen/1700196#m1700196 Julius 2017-07-27T13:03:15Z 2017-07-27T13:11:24Z Suchformular aufhübschen <p>Hallo Henry,</p> <blockquote> <p>Habe jetzt erst bei deiner Bewertung die Medaille "Enthusiast" bekommen (Der Anwender hat mindestens einen Beitrag positiv bewertet), obwohl ich schon mehrmals Bewertungen vorgenommen habe. Denke das hat mit dem <a href="https://forum.selfhtml.org/meta/2017/jul/22/punktevergabe-und-mitgliederbereich/1699767#m1699767" rel="noopener noreferrer">ursprünglichen und bereits behobenen Problem</a> zu tun. Müsste dann wahrscheinlich noch ein Updatescript über die User laufen?</p> </blockquote> <p>Wenn ich das richtig verstanden habe, wird nur wenn du eine Bewertung erhalten hast überprüft, ob du dadurch auch neue Medaillen erhältst.</p> <p>Medaillen wie „Jährling“ werden dagegen von der Software in regelmäßigen Abständen überprüft.</p> <p>Gruß<br> Julius</p>