Formatierung des Items/ Auswahlkästchen mit hinzugefügten Bildern

Question

Hallo Support-Team,
ich möchte gerne einen barrierefreien Fragebogen erstellen und möchte deswegen 5 Bilder (Smileys) in die 5 Antwortoptionen einfügen. Das habe ich nach der Internet-Anleitung gemacht und folgenden Code eingefügt:

html:

<h1>1</h1> <p> <h1>**sehr** **einfach**</ h1> <p>  <img src="1_sehr_einfach.PNG" />

Wenn ich den Fragebogen teste, passiert es aber leider, dass es zu viele Auswahlkästchen gibt und diese nicht anzuklicken sind:

Bei den Einstellungen der Graphik habe ich schon einiges ausprobiert und hier sind 5 Optionen vermerkt. Ich glaube, dass das Problem ist, dass das Programm NICHT automatisch die Abmessungen der Skalengrafik erkennt.
Könnt ihr mir da weiterhelfen - wie ich 5 Kästchen unter die 5 Bilder formatiert bekomme?

Eine weitere Frage: Wisst ihr wie ich die Schriftgröße der Frage verändern kann ohne es als fettgedruckte Überschrift zu formatierten?

Vielen Dank schonmal im Voraus!

Answer 1

Das HTML-Tag <h1> steht für eine Überschrift ersten Grades - Screenreader orientieren sich an sichlen Überschriften, daher sollte dieses Tag keinesfalls zur fett-Formatierung o.ä. eingesetzt werden.

Leider schreiben Sie nicht, mit welchem Fragetyp Sie aktuell arbeiten. Ich würde für das dargestellte Layout eine Frage "horizontale Auswahl" empfehlen. Dort können Sie die Beschriftungen und Bilder nach Bedarf unterbringen.

<dic style="fost-weight: bold;"><p>1</p><p>Sehr einfach</p><p><img src="1_sehr_einfach.PNG" alt="sehr einfach" /></p></div>