0 votes
in SoSci Survey (dt.) by s083489 (205 points)

Liebes Forum,
ich würde gerne, dass die Skalenpunkte einer Skala (voll beschriftet) bei der Darstellung auf einem Smartphone im Querformat nicht als Kärtchen nebeneinander dargestellt werden, sondern in der standardmäßigen Punktform, wie sie auf einem Monitor genutzt wird (siehe angehängte Bilder). Leider kann ich die entprechende CSS-Anweisung im Inspector nicht finden. Letztlich möchte ich also nur zwei Darstellungsvarianten zulassen: Blockdarstellung für Hochformat (funktioniert wunderbar), standardmäßige Skalenpunkte (Kreise) im Samrtphon Querformat und auf Monitoren.

Anbei auch ein Pretest-Link zur auf den Fotos abgebildeten Frage: https://www.soscisurvey.de/SCDGG_PS1/?act=QzW3yjVVnxD8M38uOzX4dG2w!

Vielen Dank für die Hilfe! :)

1 Answer

0 votes
by SoSci Survey (322k points)

ich würde gerne, dass die Skalenpunkte einer Skala (voll beschriftet) bei der Darstellung auf einem Smartphone im Querformat nicht als Kärtchen nebeneinander dargestellt werden, sondern in der standardmäßigen Punktform, wie sie auf einem Monitor genutzt wird

Damit würden Sie es Ihren Befragten ab unnötig scher machen - denn die kleinen Punkte trifft man auf dem kleinen Display denkbar schwer.

Aber wenn Sie das in Kauf nehmen möchten, können Sie in der Frage selbst von der dynamischen "Darstellung" auf die statische Darstellung umschalten. Im Hochformat wird es auf dem Smartphone dann aber zu Darstellungsfehlern kommen.

Im Prinzip wäre es natürlich auch möglich, die Abstufungen in der dynamischen Darstellung weiter zu verfeinern. Aber dafür ist ein wenig mehr CSS-Code erforderlich - wenn es gute Gründe gibt, welche diesen Aufwand rechtfertigen, führen Sie diese gerne aus.

by s083489 (205 points)
Alles klar das verstehe ich. Dann noch eine kurze Nachfrage dazu: Wie würde man es im CSS-Code umsetzen, wenn man für Smartphones ausschließlich die Blockdarstellung (wie im Hochformat) nutzen möchte?
by SoSci Survey (322k points)
Für das Umschalten zwischen horizontaler (etwas mehr Platz) und vertikaler (etwas weniger Platz, weil im Hochformat) ist der folgende CSS-Befehl verantwortlich:

@media (max-width: 641px) {
  div.s2input div.s2options {
    flex-direction: column !important;
  }
}

Würde man den Media-Selector ändern, z.B. wie folgt ...

@media handheld, (pointer: coarse) {
  div.s2input div.s2options {
    flex-direction: column !important;
  }
}

dann wäre die Darstellung der Kärtchen auf Mobilgeräten immer vertikal. Also auch wenn man ein Tablet mit viel Platz verwendet oder ein größeres Smartphone im Querformat.

Die Anweisung

div.s2input div.s2options  {
  flex-direction: row !important;
}

hingegen würde verhindern, dass von der horizontalen in die vertikale Darstellung umgeschaltet wird, wenn man das Gerät Hochformat hält.
by s083489 (205 points)
Vielen Dank für die rasche Antwort! Ich habe den Code:

@media handheld,
(pointer: coarse) {
  div.s2input div.s2options {
    flex-direction: column !important;
  }
}

mit in den <style> Bereich des Fragebogens eingefügt. Allerdings wechselt die Ansicht noch immer in die "row"-Kästchen bei Smartphone Querformat. Der Pretest oben in der Frage gilt noch. Hätten Sie eine Idee was das Problem sein könnte?

Vielen Dank im Voraus!
by SoSci Survey (322k points)
Vor dem flex-direction sind schon wieder unsichtbare seltsame Zeichen.
by s083489 (205 points)
Das ist ja ein Ding! Danke. Habe den Text direkt aus der Antwort hier kopiert und beim letzten Mal aus einer Antwort auf einer anderen Website. Werde ich in Zukunft als erste Fehlerquelle checken! Besten Dank!

Willkommen im Online-Support von SoSci Survey.

Hier bekommen Sie schnelle und fundierte Antworten von anderen Projektleitern und direkt von SoSci Survey.

→ Eine Frage stellen


Welcome to the SoSci Survey online support.

Simply ask a question to quickly get answers from other professionals, and directly from SoSci Survey.

→ Ask a Question

...