Deze worksheet omschrijft hoe je een Snap WebHost enquête bouwt die zich aanpast, afhankelijk van het toestel waarmee de enquête wordt benaderd. De enquête is in dit geval aangepast op basis van de schermdimensies.
Om dit te doen moet je een aparte Snap WebHost editie maken voor elke schermgrootte (bijvoorbeeld voor PC, tablet en smartphone), en deze vervolgens publishen met de optie Publish all WebHost editions together. Dit plaatst alle verschillende vrageblijsten voor Snap WebHost in één zip bestand. Snap WebHost zal vervolgens de gepaste vragenlijst tonen aan de respondent, op basis van de schermdimensies van het toestel van de respondent
Achtergrond
De vragenlijsten worden naar verschillende toestellen verstuurd door Snap WebHost. Snap WebHosts sorteert de edities volgens pagina-afmetingen en selecteert de grootste enquête die op het scherm van het toestel past. Je kan de verschillende edities identificeren in de data dankzij de paradata variabele Id.format
Wil je de lay-out en het gedrag aanpassen voor verschillende toestellen, dan ken je dat ook doen, door de individuele vragenlijsten te gaan bewerken.
Stap 1: Opzetten van de verschillende edities
We gaan ervan uit dat je in het verleden reeds een enquête voor Snap WebHost hebt gebouwd, gebruik makend van het default Web template
Volg nu de stappen hieronder, om 2 andere WebHost edities te creëren voor Smartphone en Tablet.
- Open je enquête in Questionnaire – Design Mode met de button.
- Klik op de Editions and Style Templates button
- Klik [New…] om een nieuwe editie te maken. In het Publication Medium veld, selecteer Web enSnap WebHost.
- Selecteer Load Style en Default Smartphone.qsf in de dropdown lijst om de template van een smartphone te gebruiken. (Je kan ook navigeren in de stijlen via de button.)
- Wijzig de Edition Name om aan te geven voor welk toestel deze versie wordt gemaakt (bvb. Web: Smartphone)
- Klik [OK] om het New Survey Edition dialoogvenster te sluiten.
- Herhaal stap 3 en 4 maar selecteer ditmaal Default Tablet.qsf om een template voor een tablet te gebruiken
- Wijzig de Edition Name om aan te geven voor welk toestel deze versie wordt gemaakt (bvb. Web: Tablet)
- Klik [OK] om terug te keren naar het Questionnaire – Design Mode scherm
Ga na of je 3 webhost edities ziet in het Editions and Style Templates dialoogvenster, klik [OK] om terug te keren naar het Questionniare – Design Mode scherm.
Snap creëert voor elke editie een nieuw tabblad met als label de Edition Name.
Stap 2: Publish uw enquête
Wanneer je een enquête publisht, moet je Publish all WebHost editions together aanvinken.Dit plaatst alle vereiste bestanden voor alle zichtbare WebHost edities in een enkele zip folder. Wil je niet dat alle WebHost edities in één enkele zipfolder worden gepubliceerd, dan kan je de ongewenste edities verbergen. Verborgen edities zijn niet zichtbaar in het Questionnaire scherm en worden niet gepublished.
Edities die je niet wil publiceren verbergen
- Klik in de Questionnaire toolbar om het Editions and Style Templates dialoogvenster te tonen (of klik met je rechtermuis op één van de tabbladen en selecteer Editions and Style Templates).
- De beschikbare edities zijn aangevinkt. Om een editie te verbergen, vink je ze uit.
- Klik [OK] om terig te keren naar de vragenlijst. De verborgen edities zijn niet langer beschikbaar in de tabs onderaan links, en worden niet toegevoegd aan het zip bestand wanneer je een publish uitvoert.
Alle edities naar één bestand publiceren
- Selecteer File | Publish.
- Selecteer in de linkerkolom.
- Selecteer Publish Without Preview als Output Method.
- Selecteer in in de linkerkolom.
- Selecteer Publish all WebHost editions together.
- Klik [Publish] om de enquête te publiceren en het zip bestand te maken in de folder die je hebt aangegeven. Nu moet je de enquête opladen naar Snap WebHost zodat ze toegankelijk wordt voor de respondenten
Stap 3: Controleer de weergave van de enquête op je toestel(len)
Het is aangeraden om te controleren of je enquête correct wordt weergegeven op de toestellen. Je kan de test URL doormailen naar een account waar je toegang toe hebt vanop het toestel, of de test URL in de browser intypen van je toestel.
Om de test URL voor de enquête te verkrijgen:
- Log in op Snap WebHost.
- Selecteer de enquête
- Klik op de test URL en kopieer het adres vanuit je browser, OF klik met de rechtermuisknop op de test URL en selecteer "kopieer URL"
- Plak de URL in een e-mail en verstuur de mail naar de account die je kan openen vanop je toestel.
- Klik op de link en controleer of de enquête correct wordt weergegeven
TIP : beschik je niet over alle toestellen om na te gaan of alles correct wordt weergegeven? Er bestaan diverse simulatoren van mobiele toestellen op het internet waar je eenvoudig de URL kan invoeren, om te kijken hoe de enquête zal worden weergegeven op dat specifieke toestel. Wij gebruiken zélf dikwijls deze - gratis - simulator omdat er verschillende schermdimensies beschikbaar zijn, en je ook kan simuleren in portrait of landscape: http://www.mobiletest.me/
Je enquêtes aanpassen
Wil je de standaard look van je vragenlijsten aanpassen, dan kan je ze onafhankelijk van elkaar wijzigen en ze samen publishen. Je kan verschillende edities bouwen die er anders uitzien en zich ook anders gedragen
Aangepaste afbeeldingen voor elke editie
Wil je afzonderlijke afbeeldingen gebruiken voor verschillende toestellen, dan moet je dit doen door ze in de achtergrond te plaatsen, en ze niet rechtstreeks in te voegen.
Het is aangeraden om aparte afbeeldingen van de juiste grootte te maken, en de afbeelding niet te vergroten of te verkleinen.
- Maak de verschillende afbeeldingen die je wil gebruiken en pas ze aan voor grote en kleine schermen
- Ga naar Design Mode en selecteer in de toolbar het topic Background.
- Selecteer de zone waar je een achtergrondafbeelding wil plaatsen in de derde drop down lijst (zie de rode cirkel hierboven). Klik op [Picture]. Het Picture dialoogvenster verschijnt.
- Klik [Browse] en navigeer naar de afbeelding die in deze editie moet komen
- Stel de horizontale en verticale aflijning in.
- Selecteer Fixed. Dit zorgt dat de afbeelding getoond wordt in de afmetingen waarin ze is gecreëerd
- Ga naar de andere editie(s) en herhaal deze stappen met een andere afbeelding op de achtergrond.
- Klik om alle wijzigingen op te slaan
Indien je een kleur én een afbeelding hebt toegepast, zal de kleur worden getoond in de zones waar de afbeelding de ruimte niet opvult. Het background preview schermpje in de toolbar zal een combinatie tonen van de kleur en de afbeelding.
De vragen of tekst aanpassen voor de verschillende edities
Wil je minder tekst in één editie van je enquête, dan kan je verschillende versies van de tekst voorzien en de tekst tonen die gepast is voor de betrokken editie.
- Maak de verschillende instructies (of vragen)
- Klik met de rechtermuisknop op het item dat je wil verbergen en selecteer Hide Variable in de dropdown lijst.
- Ga naar de andere editie door het gewenste tabblad aan te klikken links onderaan het scherm.
- Verberg de tekst (of vragen) die je niet wil tonen in die editie
- Klik om de wijzigingen op te slaan. RVergeet niet de routing aan te passen indien je routing toepast op vragen die verborgen zijn.
Gebruik verschillende routing in de verschillende edities
Je kan kiezen welke vragen getoond worden door routing toe te passen die zich baseert op de ID.Format variabele.
Je moet kijken naar de ID.format variabele om de code voor een editie te zien.
- Klik op de Snap toolbar om het Variables scherm te tonen
- Scroll naar beneden om de ID.format variabele te vinden, en dubbelklik erop om ze te openen
- Noteer welke Code staat voor elke editie.
De routing instellen
- Creëer de verschillende vragen
- Selecteer de vragen die je wil tonen in de specifieke editie
- Klik met je rechtermuis op de vragen en selecteer Routing Rules of klik in het Questionnaire scherm op de toolbar. Het Routing Rules dialoogvenster verschijnt.
- Klik [Add] om een nieuwe routingregel te maken
- Selecteer Conditionally Ask Question en klik [OK].
- Het Rule Details dialoogvenster verschijnt.
- Typ ID.format=1 (en vervang 1 door de Code die hoort bij je editie). Dit betekent dat de vraag zal getoond worden indien het format Web:Snap WebHost is (althans voor de enquête in deze worksheet).
- Klik om de wijzigingen op te slaan.
Vergeet niet dat je de routing moet wijzigen indien je vragen verbergt waar een routing regel wordt op toegepast, of waarnaar respondenten worden geleid via routing
Controleren of je enquête de juiste inhoud toont voor verschillende toestellen
Je kan de inhoud van je enquête voor elk toestel controleren door elke editie in preview te tonen
- Open je enquête in Questionnaire – Design Mode met de knop.
- Selecteer File | Publish om het Publish Questionnaire dialoogvenster te tonen.
- Selecteer in de linkerkolom
- Selecteer Preview Only als Output Method. De Preview zal een nieuw scherm openen en de betreffende editie van enquête tonen zoals ze zou verschijnen in een web browser.
- Klik [Publish] om die editie van de enquête te tonen op je computer. Controleer of je de juiste vragen en afbeeldingen voor deze editie hebt gebruikt. Controleer of alle routing werkt (de standaard webeditie zal een vaste breedte hebben, waarbij smartphone en tablet edities gestretched worden om te passen op het scherm)
- Keer terug naar Snap en wijzig de editie voor een ander toestel, door onderaan links op het betrokken tabblad te klikken.
- Herhaal de preview stappen om zo elke editie die je creëerde te controleren.
Tip : preview je enquête op http://www.mobiletest.me/
Je kan op het internet verschillende tools vinden die een Tablet of Smartphone levensecht nabootsen. Publish je enquête naar Snap WebHost, kopieer de URL en plak die in http://www.mobiletest.me/ om je enquête voor verschillende beeldformaten voor mobiele toestellen te testen.
Er zijn andere oplossingen beschikbaar, maar Mobile Test gebruiken wij zélf dikwijls om het responsieve gedrag van onze eigen creaties te controleren.