Instructies ontwikkelen en vormgeven dashboard

verie sjabloon: 4.0.3

CCN

  1. Maak op tijd een afspraak met CCN / Huisstijl en bespreek je dashboard (email: CCN-Logistiek@cbs.nl)
  2. Elk dashboard dat wordt gepubliceerd moet besproken zijn met CCN
  3. Zorg dat minimaal twee weken voor publicatie je dashboard klaar is om te testen (en maak hiervoor een afspraak met Mirjam Zengers, Stephan Verschuren of Roelof Waaijman)

Screenshot en homepage foto

  1. plaats in de workdirectory een foto in png-formaat van het dashboard met als naam screenshot.png (kleine letters) en als afmeting 294px (breedte) bij 196px (hoogte). Dit kan je makkelijk doen met het programma paint (formaat wijzigen). Deze foto wordt in de overzichtspagina getoond.
  2. Maak de foto op de homepage niet te groot (pixels), alles wat geladen moet worden kost tijd. Ga uit van 1000 bij 500 pixels. Verklein de foto eventueel middels paint > formaat wijzigen.

Meta file

Voeg meta data over het dashboard toe in de file meta_project.yaml. Deze file kan je in het sjabloon vinden. Met deze info wordt de overzichtspagina verrijkt.

R versie op server

  1. Gebruik R 4.0.3
  2. Maak gebruik van de packages die in global.R staan (andere packages zijn niet beschikbaar op de server)
  3. gebruik cbsdashboard_start als startpunt (hierin zijn reeds vele zaken geregeld, zoals huisstijl)
  4. gebruik cbsdashboard_sjabloon als voorbeeld voor verschillende visualisaties
  5. let erop dat als je bestanden zijn opgeslagen als UTF-8 (de server draait op linux en linux heeft UTF-8 nodig). Dit voorkomt problemen met speciale leestekens

Vormgeving en nette webpagina's

  1. Het is raadzaam om je kort te verdiepen in het opbouwen van webpagina's in rijen en kolommen met Boostrap
    1. De basisbeginselen van het Bootstrap grid-systeem worden o.a. hier helder uitgelegd: https://www.w3schools.com/bootstrap4/bootstrap_grid_system.asp
    2. Bootstrap gebruikt rijen en kolommen. In Shiny maak je deze met de functiones fluidRow() en column().
    3. Maak alleen column()'s in een fluidRow() en andersom. Je maakt dus nooit rijen zonder kolommen er in, en nooit kolommen die niet in een rij staan.
    4. Niet alle content van een pagina hoeft in dit grid te staan. Gebruik alleen rijen en kolommen als je content naast elkaar wilt laten zien (bij grotere schermen)
  2. Volg de indeling van de voorbeeldpagina's in dit template:
    1. Begin met een h2() titel. (Nb.: de h1() is namelijk al gebruikt voor de titel van het hele dashboard, links bovenin de pagina.)
    2. Dan de content in een of meerdere fluidRow()'s, met daarin steeds een of meerdere column()'s.
    3. Geef de column() waar een grafiek in staat de class = 'block' mee, zodat er een wit kader omheen verschijnt.
    4. Heeft een selectiebox voor de gebruiker invloed op alle grafieken op een pagina? Dan moeten ze bovenaan de pagina's.
    5. Heeft een selectiebox invloed op één specifieke grafiek op de pagina? Zet deze dan in de column(), dus in hetzelfde witte kader als de grafiek.
  3. Test je dashboard op verschillende schermformaten, en zeker op een mobiel schermformaat. Dit kun je doen door je browservenster te verkleinen, of door via de 'inspecteer element' functionaliteit van je browser telefoons na te bootsen. Zorg dat alles er altijd goed uit ziet.
  4. Test, indien mogelijk, je dashboard in diverse browsers. Zorg dat alles er altijd goed uit ziet.

Links

Links naar andere pagina's in het dashboard, of naar websites van buiten, worden als knoppen weergegeven. Links naar een Statlinetabel (als bronvermelding) worden als tekstlink weergegeven.

Voorbeeld van een knop naar een externe website.

Voorbeeld van een knop naar een ander pagina/tab in het dashboard.

Voorbeeld van een tekstlink naar statline (bron) naar een ander pagina/tab in het dashboard. Deze link staat in een voetnoot-paragraaf.

Bron: CBS StatLine

Gebruik van Bootstrap-kolommen

Bootstrap werkt met een zgn. 12-kolommensysteem. Dat wil zeggen dat een rij (fluidRow) virtueel in 12 kolommen verdeeld is, en je kunt elke kolom op die manier een breedte geven van 1 t/m 12. Je kunt dus bijvoorbeeld 2 kolommen van 6 breed maken, of 3 kolommen van 4 breed, of 1 kolom van 12 breed. Of je maakt 1 kolom van 4 breed met daarnaast een kolom van 8 breed. Zorg wel dat je altijd per rij op 12 kolommen uit komt.

Het mooie van bootstrap is dat bij een bepaalde schermbreedte het aantal kolommen automatisch wordt teruggebracht. Heb je bijvoorbeeld op een desktop twee kolommen van 6 naast elkaar staan, dan zullen deze op een mobiele telefoon of kleine tablet onder elkaar vallen.

Hieronder enkele voorbeelden:

kolom breedte 6
kolom breedte 6
kolom breedte 4
kolom breedte 4
kolom breedte 4
kolom breedte 4
kolom breedte 8

Bootstrap en Shiny bepalen standaard bij welke schermbreedte het aantal kolommen naast elkaar minder wordt. Je kunt dat eventueel zelf tweaken door classes mee te geven zoals 'col-lg-6' of 'col-md-6'. Lees meer hierover in documentatie van Bootrstrap. Shiny gebruikt standaard de 'col-sm-*'-clases.

Open data

Voorzie opendata van een tijdstempel (bv datum download).

Toegankelijkheid

Het CBS moet, net als andere overheidsinstellingen, haar informatie voor iedereen beschikbaar maken (zie https://www.digitoegankelijk.nl/ ). Een interactief dashboard met visualisaties is helaas niet voor iedereen toegankelijk, maar we zijn verplicht om een goede poging te doen.

Het uitgangspunt is dat alle informatie beschikbaar moet zijn, dus ook voor bijvoorbeeld mensen die niet of niet goed kunnen zien (en hun scherm laten voorlezen), of voor mensen die geen gebruik (kunnen) maken van een muis. Wanneer een bepaalde presentatie van informatie niet voor iedereen toegankelijk is, moeten we een alternatief aanbieden.

Daarnaast kunnen we zorgen voor een zo goed mogelijke structuur van de pagina's, een vormgeving met voldoende contrast, en geen afhankelijkheid van kleuren (i.v.m. kleurenblindheid). Hieronder volgen enkele aanbevelingen.

Structuur en navigatie

  1. Geef navigatie-links een betekenisvolle naam
  2. gebruik een goede structuur van koppen. De titel van het dashboard (linksboven in beeld) is een H1-kop. De titel van een pagina (in dit geval 'Instructies ontwikkelen dashboard' is een H2-kop. Tussenkopjes in de pagina zijn H3-koppen. Daaronder is nog niveau H4 beschikbaar, maar het heeft de voorkeur om niet zo diep te gaan. H5 en H6 zijn niet gestyled.
  3. gebruik duidelijke labels (bijvoorbeeld bij input velden) die beschrijven wat de functie van een element is. Mensen die hun scherm laten voorlezen moeten begrijpen wat iets is. Er staat dus niet iets als 'kies', maar wel 'kies je gemeente'.

Figuren en tabellen

  1. Figuren zijn natuurlijk lastig voor mensen die ze niet kunnen zien. Daarom moeten we een alternatief aanbieden door de data downloadbaar te maken, en deze in tabelvorm aan te bieden.
  2. Zorg daarom dat elke grafiek de opties hc_export(enabled=TRUE) heeft. Dan kan de gebruiker met het menuutje rechtsboven de data downloaden of raadplegen als tabel.
  3. Zorg dat elke tabel betekenisvolle kolomkoppen bevat (maak gebruik van dataframes of tibbles).

Geo-informatie

  1. Maak een toegankelijke kaart of een toegankelijk alternatief. Zie https://www.digitoegankelijk.nl/onderwerpen/geo-informatie

Vormgeving en kleur

  1. Wees niet afhankelijk van kleuren (men moet figuren kunnen interpreteren zonder kleuren te moeten onderscheiden)
  2. Zorg voor voldoende contrast (gebruik het cbs kleurenpalet, en kies goed of je daar witte of zwarte tekst op zet. Gebruik onderstaande afbeelding als voorbeeld (zet bijv. geen geel op een witte achtergrond, of zwart op donkerblauw).)
  3. Wees niet afhankelijk van zintuigelijke eigenschappen ('klik op de blauwe driehoek rechtsonder')
Overzicht van kleuren en contrasten

Afbeeldingen, iconen, logo's

  1. zorg dat elk figuur of icoon een alternatieve tekst heeft (zodat slechtzienden de tekst kunnen laten oplezen). Dit kan je doen door een alt-attribuut toe te voegen (alt = 'tekst')
  2. Is het decoratief (bijvoorbeeld een foto), geeft dan een lege alt mee (alt = "")
  3. Combineer afbeeldingen en teksten die naar dezelfde content linken
  4. Gebruik je een afbeelding als hyperlink, gebruik dan een alt-tekst die de link beschrijft
  5. tekst, link naar cbs website

Stapeling en (multi)problematiek tijdens de coronapandemie

Behoefte aan inzicht in sociale gevolgen corona

De coronacrisis heeft grote sociaal-maatschappelijke gevolgen. Daarom bestaat vanuit verschillende departementen de behoefte aan meer inzicht in de omvang van de sociale gevolgen en de samenhang in die gevolgen. In het kader hiervan zijn verschillende kennistrajecten in het sociaal domein opgezet. Eén onderdeel hiervan is dit dashboard.

Gebruik van regelingen en voorzieningen en (signalen van) problematiek

Dit dashboard bevat gegevens over (stapeling van) het gebruik van regelingen en voorzieningen en enkele (signalen van) vormen van problematiek in het sociaal domein. Hierbij worden verschillende doelgroepen en achtergrondkenmerken onderscheiden. Daarnaast is het mogelijk om voor Nederland als geheel de resultaten te bekijken, maar ook per gemeente of stedelijk vernieuwingsgebied.

Monitoring van huishoudens van eind 2019 tot eind 2020

De gegevens hebben betrekking op alle huishoudens die op 31 december 2019 stonden ingeschreven in de Basisregistratie Personen (BRP). Het doel is om deze huishoudens te volgen van het laatste kwartaal van 2019 tot en met het vierde kwartaal van 2020. De huidige versie van het dashboard bevat (waar mogelijk) gegevens tot en met het derde kwartaal van 2020.

Dashboard in ontwikkeling

Het huidige dashboard is de eerste versie. Gedurende 2021 zal dit dashboard verder ontwikkeld worden en nog tweemaal aangevuld worden met recentere gegevens en voortschrijdende inzichten.

Bekostigd door:

Het ministerie van Sociale Zaken en Werkgelegenheid (SZW), het ministerie van Justitie en Veiligheid (J&V), het ministerie van Binnenlandse Zaken en Koninkrijksrelaties (BZK), het ministerie van Volksgezondheid, Welzijn en Sport (VWS) en het ministerie van Onderwijs, Cultuur en Wetenschap (OCW).

Kruisen van regelingen en voorzieningen en (signalen van) problematiek

In onderstaande tabel kan het gebruik van verschillende regelingen en voorzieningen en (signalen van) vormen van problematiek met elkaar gekruist worden. Onder 'Kies variabele (kolom)' en 'Kies variabele(n)' kunt u variabelen selecteren om de gewenste kruising te maken. Daarnaast is het mogelijk om de tabel weer te geven voor Nederland als geheel, een specifieke gemeente of een stedelijk vernieuwingsgebied ('Kies een regio'), voor een specifieke doelgroep ('Kies een doelgroep') en voor een specifiek peilmoment ('Kies een peilmoment').

Het is mogelijk om de uitkomsten weer te geven in absolute aantallen of in percentages. Het percentage is berekend als het aandeel huishoudens waarvoor naast de geselecteerde kolomvariabele ook de betreffende rijvariabele geldt (bv. 3% van de huishoudens met een AO-uitkering heeft ook bijstand op 31-12-2019). Een huishouden kan gebruik maken van meerdere regelingen en/of voorzieningen, waardoor percentages niet optellen tot 100%.

Voor de verschillende peilmomenten zijn niet alle gegevens al beschikbaar. Afhankelijk van de beschikbaarheid is het mogelijk om specifieke variabelen weer te geven in de tabel.

Ontwikkeling van instroom in regelingen, voorzieningen en problematiek

Op deze pagina wordt in de lijngrafiek de ontwikkeling van de instroom in regelingen, voorzieningen en problematiek weergegeven. Onder 'Kies variabele' kunt u een regeling, voorziening of (signaal van) problematiek selecteren. Het is mogelijk om maximaal vijf regio's ('Kies maximaal 5 regio's') te selecteren waarvoor de ontwikkeling weergegeven wordt (totaal Nederland, gemeenten of stedelijke vernieuwingsgebieden). Daarnaast is het mogelijk om de figuur weer te geven voor een specifieke doelgroep ('Kies een doelgroep'). In de staafdiagram worden per peilmoment de achtergrondkenmerken ('Kies een achtergrondkenmerk') van huishoudens - die zijn ingestroomd in de gekozen regeling, voorziening of problematiek - weergegeven. In deze staafdiagram kunnen de resultaten van maximaal één regio te gelijk weergegeven worden ('Kies een regio').

Het is mogelijk om de uitkomsten weer te geven in absolute aantallen of in percentages. Het percentage in de lijndiagram is berekend als het aandeel huishoudens binnen de doelgroep dat is ingestroomd t.o.v. het totaal aantal huishoudens binnen de doelgroep voor wie op hetzelfde moment de geselecteerde variabele geldt (bv. 5% van alle huishoudens met bijstand op 31-03-2020 is instromer en had 3 maanden eerder nog geen bijstandsuitkering in het huishouden).

Voor de verschillende peilmomenten zijn niet alle gegevens al beschikbaar. Afhankelijk van de beschikbaarheid is het mogelijk om specifieke variabelen weer te geven in de figuur.

Nb. In de staafdiagram zijn sommige categorieën erg klein. Het is mogelijk hierop in te zoomen door met uw muis over de figuur te slepen. Daarnaast is het mogelijk om categorieën niet weer te geven in de figuur door deze in de legenda te de-selecteren.

Loading...
Loading...

Stapeling van gebruik regelingen en voorzieningen

Op deze pagina wordt de stapeling binnen huishoudens weergegeven. Met stapeling wordt hier bedoeld het aantal regelingen en/of voorzieningen waarvan binnen een huishouden gebruik gemaakt wordt. Indien dezelfde regeling/voorziening door meerdere personen binnen het huishouden gebruikt wordt, telt deze één keer mee. De figuren kunnen worden weergegeven voor Nederland als geheel, een specifieke gemeente of een stedelijk vernieuwingsgebied ('Kies een regio') en voor een specifieke doelgroep ('Kies een doelgroep'). In de bovenste figuur wordt de ontwikkeling van de stapeling weergegeven. In de onderste figuur wordt de stapeling naar achtergrondkenmerken weergegeven. Door een achtergrondkenmerk te kiezen ('Kies een achtergrondkenmerk') worden de resultaten uitgesplitst naar de verschillende categorieën van het gekozen kenmerk. De figuur kan daarnaast worden weergegeven voor verschillende peilmomenten ('Kies een peilmoment').

Voor de verschillende peilmomenten zijn niet alle gegevens al beschikbaar. Afhankelijk van de beschikbaarheid is het aantal regelingen en/of voorzieningen berekend.

Nb. In de staafdiagram zijn sommige categorieën erg klein. Het is mogelijk hierop in te zoomen door met uw muis over de figuur te slepen. Daarnaast is het mogelijk om categorieën niet weer te geven in de figuur door deze in de legenda te de-selecteren.
Loading...
Loading...

Bronnen

Begrippen

Afkortingen

Download

Datasets met uw eigen gekozen selectie kunt u downloaden op de verschillende tabbladen. Via onderstaande knoppen kunnen alle datasets, die in het dashboard zijn gebruikt, in hun geheel gedownload worden (in .csv format). Deze bestanden kunnen onder andere geopend worden in Excel, R of SPSS.

Let op! De bestanden bevatten een groot aantal records waardoor een deel van de bestanden niet volledig wordt ingeladen in Excel.