Formatierung der Textbausteine verändert sich im Smartphone Layout

Question

Hallo SoSci Survey Support,

vielen Dank für die bisherige Hilfe!

Ich habe ein Problem mit der Darstellung meiner Textbausteine im Fragebogen. Ich habe zwei Layouts - ein normales Standard Layout und eins optimiert für Smartphones (keine kombinierten Fragen, etc.).

Im Smartphone Layout erscheint der Textbaustein in verschiedenen Größen, obwohl im Textbaustein selbst alles einheitlich ist.

Zur Veranschaulichung, das erste Bild zeigt den Pre-test im Smartphone Modus an: Das unterstrichene "in der Gewichtung" ist kleiner als der Rest des Satzes.

Das Bild darunter ist vom Textbaustein (der ganze Satz in einer Zeile) und alles ist einheitlich.

Woher kommt der Unterschied in der Formatierung und wie kriege ich alles einheitlich hin? Die Unterschiede fallen am Smartphone sehr deutlich auf.

Vielen Dank im Voraus!

Viele Grüße!

Answer 1

Im Smartphone Layout erscheint der Textbaustein in verschiedenen Größen, obwohl im Textbaustein selbst alles einheitlich ist.

Womöglich haben Sie den Text nicht manuell formatiert, sondern direkt mit Formatierung aus Word kopiert? In dem Fall kommt leider aus Word meist viel mehr Formatierung mit als man eigentlich haben möchte. Eine Schriftgröße hier, eine Schriftart dort, ...

Je nachdem, wie aufwändig die Formatierungen sind, empfehle ich die Darstellung "Einfacher Text", wo Sie mittels Wiki-Notation einfache Formatierungen einfügen können. Oder Sie wechseln in die HTML-Ansicht, wo Sie die vorhandenen Formatierungen ausführliche bearbeiten können.

Denkbar ist natürlich auch, dass Sie erstmal alle Formatierungen entfernen und dann beim "Formatierten Text" das ergänzen, was Sie haben möchten. Dabei haben Sie aber weniger Kontrolle über das Ergebnis als bei den vorgenannten Optionen.

Comments

Vielen Dank für Ihre Antwort.

Ich habe den Inhalt der Textbausteine von Textbausteinen aus einem anderen Projekt kopiert. In dem anderen Projekt funktioniert auch in der Smartphone Übersicht alles und alles sieht einheitlich aus. Deshalb mein Unverständnis warum es in diesem (neuen) Projekt nicht klappt..

Ihrem Hinweis folgend, ändere ich die Textbausteine von "formatiert" zu einfachem Text.

Wie füge ich Zeilenabstände ein? Enter hilft nicht genauso wenig wie <div>..

Vielen Dank im Voraus!

---

Wenn Sie einen Pretest-Link zu einer Seite mit dem ursprünglichen Textbaustein posten möchten, werfe ich gerne einen Blick darauf, woher die Formatierung kommt.

> Wie füge ich Zeilenabstände ein?

Wenn es Text sein soll, dann am besten gar nicht. Wenn es um Gestaltung geht, dann am besten nicht als "einfachen Text" (denn es ist dann ja kein einfacher Text), sondern als "HTML-Code".

<p>Absatz<p>
<p>Absatz<p>
<p style="margin-top: 2em">Absatz mit Abstand darüber</p>

---

Vielen Dank für Ihre Antwort.

Hier ist ein Link vom Pre-test in der das Smartphone Layout gut aussieht https://www.soscisurvey.de/studMa/index.php?i=ZD1X9S7IRIZ4&rnd=KUQT

und hier ein Link (vom anderen Projekt) in dem das Smartphone Layout sich unterscheidet: https://www.soscisurvey.de/finrebal/index.php?i=BJBF6QYQKEJ1&rnd=PCYD

Die Textbausteine habe ich von einem ins andere Projekt kopiert und würde gerne wissen, warum die Darstellung so unterschiedlich ist.

Vielen Dank!

---

Ich habe in einer separaten Antwort geantwortet (also nicht hier als Kommentar, sondern je nach Anzeige weiter oben bzw. weiter unten), damit ich zwei Screenshots ergänzen konnte.

Answer 2

Hier sehen Sie den HTML-Code, der für den besagten Ausschnitt hinterlegt ist:

Mit etwas Suchen zu erkennen die Stelle font-size: 13px rechts oben. Diese Formatierung ist im Textbaustein offenbar fest rein-kopiert wurden.

Im Textbaustein unter dem anderen Link ist dieses <span> ebenfalls enthalten - dort steht das <u>in der Gewichung</u> aber nicht innerhalb des <span>, sondern davor:

Ich vermute, dass an dem Text irgend eine Kleinigkeit geändert wurde und der WYSIWYG Texteditor, welcher für formatierte Texte zuständig ist, in diesem Zuge die Position geändert hat.

Comments

Vielen Dank!

Meinen Sie, das Problem lässt sich am schnellsten und besten lösen, wenn ich die Textbausteine des neuen Projektes (mit ungleicher Darstellung) als HTML Textbaustein verändere und speichere?

---

Wenn Sie am HTML-Code arbeiten, haben Sie zumindest die Kontrolle darüber, was wie formatiert wird. Sie sehen in den Screenshots oben auch, dass das nicht super-komplex ist ... dieses <span> mit dem Formatierungsmüll kann ja mehr oder weniger einfach entfernt werden.

---

Vielen Dank! Die Umsetzung hat funktioniert!