Liebe Forumsmitglieder,

wir versuchen momentan einen Paper-Pencil-Fragebogen auf online in LimeySurvey umzumünzen. Die meisten Fragetypen sind kein Problem, allerdings gibt es eine, bei der ich momentan nicht weiterkomme.
In der Paper-Pencil-Version gibt es eine Skala, auf der man auf einem Pfeil an einer beliebigen Stelle ein Kreuz setzen sollte (siehe Bild unten). Eine Möglichkeit dies online umzusetzen, wäre es evtl., unter dem Bild eine Punkteskala (zb. mit 7 Punkten mit je einem unter jeder Silhouette oder 13 Punkten auch für die Zwischenräume) zu setzen, bei denen die Teilnehmenden dann einen Punkt ankreuzen können. Es ist nicht ideal, aber eine Möglichkeit. Wisst ihr, ob das umzusetzen wäre? Oder habt ihr andere Ideen?

Ich danke euch für euren Input und Ideen, liebste Grüße,
Jenny

Hallo, Jenny,
ich würde Euch einen Schieberegler empfehlen.
Könnte dann so aussehen.


Klappt in diesem Fall bis zu Bildschirmgrößen >1024 px.
Darunter muss man dann mit @media-queries arbeiten, um die Responsivität zu synchronisieren.
Aber bei z.B. smartphones sind Schieberegler per se zu vermeiden. Ist einfach zu fitzelig.


Man könnte wohl auch mit dem Fragendesign "bootstrap-buttons" arbeiten

(Hier jetzt ohne viel Styling - aus Bequemlichkeit auch nur zwei verschiedene Silhouetten -, außer Oder auch mit dem Fragendesign "image-select".
Allerdings lassen beide dann keine Zwischenwerte zu.

Aber ich würde auf die Zwischenwerte verzichten. Was soll denn auch noch ein Zwischenwert zwischen 2 und 3, wo man fast keinen Unterschied sieht.
Nur um diejenigen zu befriedigen, die sich nie einigen können?

Schau es Dir an, und dann kannst Du Dich für weitere Fragen melden.

Joffm

Mit diesen Angaben klappt es auch auf dem Smartphone prima:
Evtl. muss das Bild ein bisschen anders zugeschnitten werden, oder der linke und rechte Rand ein bisschen umgestellt, damit es richtig passt.

Joffm

Hallo Joffm,

ich danke dir vielmals! Der Schieberegler sieht super aus, ich habe ihn zuvor nicht entdeckt. Wirklich perfekt!
Ich werde mich erstmal weiter einlesen und schauen, wie weit ich komme. Sollte ich dann noch Fragen habe, nehme ich dein Angebot auf dich zurückzukommen, gerne in Anspruch!

LG und alles Gute,
Jenny

Hallo, Jenny,
ich habe noch einen Zusatz zum css gemacht, da es auf einem Tablet hochkant noch einen Glitch hatte.
Hier noch einmal das gesamte css, das in den Fragentext kommen sollte.
Der letzte Teil ist neu. Du erkennst ja an der media-query, dass es hier nur um die Bildschirmbreite zwischen 768 und 1024 geht.
Noch einmal drei Bildchen.

Full Screen


Tablet: Breite 800px:


Smartphone: Breite 360px


Übrigens: Ich habe in den Text "kaum wahrnehmbar" einen "weichen Trenner" <wbr> eingesetzt, also "kaum wahr<wbr>nehmbar".
Dann sieht es etwas besser aus, als wenn die automatische Trennung "zuschlägt".

Joffm