Instructies ontwikkelen dashboard

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 een week voor publicatie je dashboard klaar is om te testen (en maak hiervoor een afspraak met Edwin de Jonge 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. Verklein de foto eventueel middels paint > formaat wijzigen.

R versie op server

  1. Gebruik R 3.5.2
  2. Maak gebruik van de packages die in global.R staan (andere packages zijn niet beschikbaar op de server)
  3. gebruik dashboard_start als startpunt (hierin zijn reeds vele zaken geregeld, zoals huisstijl)
  4. gebruik dashboard 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. Plaats content die bij elkaar hoort in dezelfde column()
  2. Maak alleen column()'s in een fluidRow()
  3. Volg de indeling van de voorbeeldpagina's in dit template. Met name de pagina 'Staaf- en kolomgrafieken' geeft een goed voorbeeld van de mogelijkheden:
    1. Begin met een h2() titel in een fluidRow(). (Nb.: de h1() is namelijk al gebruikt voor de titel van het hele dashboard, links bovenin de pagina.)
    2. Daaronder eventueel een wellPanel, met daarin een fluidRow(), en in die row een of meerdere column()'s, met keuzemogelijkheden of selecties voor de gebruiker.
    3. Dan de content in een of meerdere fluidRow()'s, met daarin steeds een of meerdere column()'s.
    4. Geef de column() waar een grafiek in staad de class = 'block' mee, zodat er een wit kader omheen verschijnt.
    5. Heeft een selectiebox voor de gebruiker invloed op alle grafieken op een pagina? Dan moeten ze bovenaan de pagina's in een wellPanel() staan. (Zoals de 'pick one or more cars' selectiebox in de staafgrafiekenpagina.)
    6. 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. (Zoals 'survived' en 'age' bij de laatste grafiek op de staafgrafiekenpagina.)
    7. Onderaan een download data knop.
  4. Test je dashboard op verschillende schermformaten. Dit kun je doen door je browservenster te verkleinen. Zorg dat alles er altijd goed uit ziet.
  5. Test, indien mogelijk, je dashboard in diverse browsers. Zorg dat alles er altijd goed uit ziet.

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

  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.

Tabellen

  1. 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')
  4. 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

Open data

  1. voorzie opendata van een tijdstempel (bv datum download)

Impactmonitor huiselijk geweld en kindermishandeling

Dit dashboard maakt integraal deel uit van de impactmonitor Aanpak Huiselijk Geweld en Kindermishandeling. Deze impactmonitor laat op structurele basis zien hoe het er in Nederland voor staat met de aanpak van huiselijk geweld en kindermishandeling en wat de impact is van deze aanpak op de levens van de betreffende mensen. De monitoring van de aanpak van huiselijk geweld en kindermishandeling heeft als doel bij te dragen aan het zichtbaar maken van lokale, regionale en landelijke resultaten. Hierbij gaat het zowel om uitvoering als beleid.


De impactmonitor is ontwikkeld vanuit het programma 'Geweld hoort nergens thuis' van het ministerie van Volksgezondheid, Welzijn en Sport (VWS), het ministerie van Justitie en Veiligheid (JenV) en de Vereniging van Nederlandse Gemeenten (VNG) en is door het CBS gemaakt in opdracht van het ministerie van Volksgezondheid, Welzijn en Sport (VWS). De impactmonitor is nadrukkelijk niet bedoeld om de voortgang van dit programma in beeld te brengen. Dat doet het programma in de eigen voortgangsrapportages.


De impactmonitor beschrijft de onderwerpen die de onderzoeksadviescommissie van het programma 'Geweld hoort nergens thuis' als het meest relevant heeft bestempeld. Een belangrijk uitgangspunt voor de impactmonitor is dat zo veel mogelijk wordt aangesloten op bestaande bronnen en dat aanvullende registraties worden voorkomen.


Meer achtergrondinformatie over de opzet en inhoud van de monitor is te vinden in:

Vergroting bereik Veilig Thuis

Verbinding zorg en veiligheid

Omvang huiselijk geweld en kindermishandeling

Aard en kenmerken

Verbetering outcome

Download

Download alle cijfers van de impactmonitor huiselijk geweld en kindermishandeling via deze link of onderstaande knop.


Download