Handige tips voor gebruiksvriendelijke webapps

Bij het doen van sommige analyses hoop je dat de uitkomst je stille vermoeden niet bevestigt, maar weet je eigenlijk al dat het wel gaat gebeuren. Het overkwam me toen ik voor het Financieele Dagblad de top-10 treinstoringen in Nederland analyseerde. De 4 trajecten die ik in de afgelopen maanden het vaakst aflegde, hadden de meeste storingen te verduren. Mijn leukste bezigheid tijdens de uren vertragingen? Het maken van webmaps. In dit blog deel ik 7 handige tips die ik heb ontdekt, om kaarten zo gebruiksvriendelijk mogelijk te maken.

Een goede webapp is meer dan alleen een interactieve kaart. Met smartphones en een steeds betere toegankelijkheid tot internet wordt het eenvoudiger om interactieve kaarten op meerdere devices te bekijken. En dus moet je weten waar je rekening mee moet houden. Tijdens mijn stage bij Esri en het Financieele Dagblad heb ik ervaring opgedaan met kaarten die op het web en/of in de krant gepubliceerd moesten worden. Hierin heb ik veel geleerd van de Esri-collega’s.

Tip 1: Gebruik opmaakmogelijkheden van ArcGIS Pro

Ten eerste is het verstandig om de kaart die je gaat maken in de desktopversie van ArcGIS te maken: ArcGIS Pro. De mogelijkheden voor het maken van een mooie kaart zijn hierin veel groter dan in ArcGIS Online. Wanneer de kaart af is sla je hem op en deel je deze als webmap. Als dit is gedaan is de kaart in ArcGIS Online te openen, waarna deze webmap gedeeld kan worden als webapplicatie: een interactieve kaart in een interface.

Tip 2: Kies hoe je de webapp maakt

Er zijn veel mogelijkheden om een webapp te maken: vanuit ArcGIS Online kun je snel aan de slag met de Web AppBuilder for ArcGIS en een standaard template. Met de Web AppBuilder is er vrijheid om te kiezen welke opties de webapp allemaal krijgt. Zo kunnen verschillende thema’s, stijlen en layouts worden gekozen. Ook is er een groot aanbod aan widgets te kiezen voor de gebruiksvriendelijkheid van de kaart.

De andere mogelijkheid is om gebruik te maken van een template (zie afbeelding hieronder). Templates zijn webapps die al deels zijn ingericht, zo is er al een bepaald thema en kan er meestal maar weinig aan de stijl en layout worden veranderd. Echter hebben deze templates het voordeel dat je al snel een goed beeld krijgt van hoe de kaart eruit komt te zien.

Webapp-templates in ArcGIS Online.

Tip 3: Bepaal welke templates geschikt zijn voor welke toepassingen

Het is aan te raden om eerst alle templates een keer te bekijken en daarna de keuze te maken met welke je gaat werken. De templates hebben namelijk allemaal een andere functie. De Media Map is bijvoorbeeld handig wanneer de kaart ook op andere devices dan een computer moet worden bekeken. Hierin bestaat de mogelijkheid om scrollen met de muis uit te zetten, dit is handig wanner touchscreen-gebruikers de kaart bekijken, zo zoomt de kaart niet in en uit tijdens het scrollen. Een andere optie is de hover-functie, er hoeft niet met de muis geklikt te worden op een punt, want de pop-ups verschijnen dan automatisch. De Basic Viewer is zeer eenvoudig in het gebruik, maar minder aantrekkelijk gemaakt. Bij andere webapps is de mogelijkheid om een eigen stijl en layout te kiezen weer een stuk groter.

Tip 4: Controleer of de kaart écht wel openbaar/publiek gedeeld is

Na het kiezen van de juiste webapp en de juiste opmaak is de kaart klaar om gedeeld te worden, dit kan als webapp of embedded in een website. Let erop dat voordat de kaart gedeeld wordt deze eerst in de incognito-modus wordt geopend, zo weet je zeker dat de kaart ook echt openbaar staat. Moet je inloggen bij ArcGIS Online, dan moet de kaart of een kaartlaag nog op openbaar worden gezet.

Tip 5: Haal alle overbodige informatie weg (écht weg)

Het is belangrijk om overbodige informatie uit de kaart te halen, denk hierbij aan kolommen in de attribuut-tabel die niet nodig zijn, hier wordt de kaart namelijk trager van. Weg is pas écht weg als hij uit de tabel is gehaald. Het niet tonen van data maakt het laden van de kaart niet meteen sneller.

Tip 6: Let op dat de kaart mobiel ook reageert zoals je wilt

Wil je een kaart embedden in een website en deze moet ook voor op mobiel te gebruiken zijn let er dan op dat de kaart in een kleiner formaat wordt getoond. Door &mobileBreakPoint=200 aan een url toe te voegen, blijven webmaps zoals de originele pop-ups op alle schermen groter dan 200 pixels. Doe je dit niet, dan kan de kaart verkeerd worden weergeven op een mobiel. Met behulp van de Tryout Editor is het mogelijk om eenvoudig te controleren of de HTML-code op een webpagina werkt.

Tip 7: Maak een eigen basiskaart

Tot slot is het natuurlijk het leukst om de kaart zo persoonlijk mogelijk te maken. Vanuit Esri zijn er applicaties om een kaart te personaliseren. Denk hierbij aan het maken van een eigen basiskaart. Marty Doldersum, een eerdere stagiair, heeft daarin een basiskaart gemaakt voor het FD, die ik voor bijna alle FD-kaarten gebruikte (zie de afbeelding hieronder aan de linkerkant). Een andere leuke functie is de MapStyler-app, waar een kaart is op te maken aan de hand van een foto (zie afbeelding hieronder aan de rechterkant).

Volgend Artikel

GIS onmisbaar bij efficiënt samenwerken, maar het is en blijft mensenwerk

Lees dit artikel