@@hmm > ich bau mal wieder an einer Webseite und möchte jetzt Html Inputfelder vom Typ "Button" Für Buttons gibt es das `button`-Element. Dieses solltest du nehmen, nicht `<input type="button">`{: .language-html.bad} > als Icon darstellen Im `button`-Element kannst du Markup unterbringen, auch ein `img`-Element. Alternativtext nicht vergessen! > und mit einem Tooltip ausrüsten. Dafür gibt es das `title`-Attribut. Bedenke, dass nur ein Teil der Nutzer sowas wie eine Maus hat und in den Genuss des Tooltips kommen kann. ~~~html <button id="v1" title="Auf nach San Escobar!"> <img src="https://upload.wikimedia.org/wikipedia/commons/f/ff/Flag_of_San_Escobar.svg" alt="San Escobar" width="42"/> </button> ~~~ Hinweise: * Icons sollten üblicherweise als Vektorgrafiken (SVG) vorliegen, nicht als Rastergrafiken (PNG, GIF, schon gar nicht JPEG) * Die Breite hab ich da mal mit reingesetzt; die sollte aber besser im Stylesheet angegeben werden. > Die Html Button bau ich mit JS. ?? > Im Internet werden Divs definiert Button dürfen **keine** `div`-Elemente sein. Solche wären nicht für alle Nutzer bedienbar. 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)

@@hmm > ich bau mal wieder an einer Webseite und möchte jetzt Html Inputfelder vom Typ "Button" Für Buttons gibt es das `button`-Element. Dieses solltest du nehmen, nicht `<input type="button">`{: .language-html.bad} > als Icon darstellen Im `button`-Element kannst du Markup unterbringen, auch ein `img`-Element. Alternativtext nicht vergessen! > und mit einem Tooltip ausrüsten. Dafür gibt es das `title`-Attribut. Bedenke, dass nur ein Teil der Nutzer sowas wie eine Maus hat und in den Genuss des Tooltips kommen kann. ~~~html <button id="v1" title="Auf nach San Escobar!"> <img src="https://upload.wikimedia.org/wikipedia/commons/f/ff/Flag_of_San_Escobar.svg" alt="San Escobar" width="42"/> </button> ~~~ Hinweise: * Icons sollten üblicherweise als Vektorgrafiken (SVG) vorliegen, nicht als Rastergrafiken (PNG, GIF, schon gar nicht JPEG) * Die Breite hab ich da mal mit reingesetzt; die sollte aber besser im Stylesheet angegeben werden. > Die Html Button bau ich mit JS. ?? 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)