You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: content/blogs/_index.md
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -6,4 +6,4 @@ type: page
6
6
7
7
---
8
8
9
-
Dit is de test overzichtpagina
9
+
In mijn blogs vertel ik je over het ontstaan en de verdere ontwikkeling van deze website, de dingen die ik leer en de dingen die ik nog wil gaan leren.
summary: Dat je dit leest, betekent in ieder geval dat er iéts live op het internet staat. Maar daaraan ging natuurlijk een heleboel vooraf. In dit blog vertel ik je waarom en hoe ik dit project ben begonnen.
5
+
6
+
---
7
+
8
+
Dat je dit leest, betekent in ieder geval dat er iéts live op het internet staat. Maar daaraan ging natuurlijk een heleboel vooraf. In dit blog vertel ik je waarom en hoe ik dit project ben begonnen. In de volgende blogs neem ik je mee in wat ik inhoudelijk allemaal heb gedaan en hou ik je op de hoogte over nieuwe wijzigingen.
9
+
10
+
## Geen CMS!?
11
+
Op mijn [Over mij pagina](https://renateroke.github.io/overmij/) heb je al kunnen lezen over hoe ik in de digitale toegankelijkheid ben beland. En dat ik na jarenlang WCAG-onderzoeken doen - waarin ik je vertel wat je allemaal fout hebt gedaan - liever advies ging geven over hoe het dan wél moet. Met mijn ervaring in een aantal reguliere contentmanagementsystemen kwam ik daar best een end mee. Maar bij een nieuwe opdracht kwam in een situatie die ik zelf nog niet eerder had meegemaakt: er is helemaal geen cms. De website bestaat eigenlijk uit een gigantische map, met alles erin wat gezamenlijk een website maakt. En die gigantische map staat op GitHub. En er dus ook geen teksteditor, je schrijft alles in markdown. En om de pagina eruit te laten zien als je wil, moet je weer allemaal kleine bestandjes uit andere delen van de map aanroepen in het template van de pagina. Je kunt je misschien voorstellen dat dat voor iemand die wel van het concept 'GitHub' had gehoord, maar nog nooit van static site generators, even een flinke leercurve is. Om mijzelf te helpen zo snel mogelijk ervaring op te doen, besloot ik in mijn eigen tijd deze situatie na te gaan bootsen op een eigen website.
12
+
13
+
## Jekyll en hi!
14
+
Goed, ik moest dus iets gaan doen waarbij ik markdown zou leren schrijven en zou leren lokaal een repository te draaien om die vervolgens met de wereld te delen. Voor dat laatste is GitHub pages dus een logische plek. GitHub pages is de static site hosting service van GitHub, waar personen en organisaties gratis een statische website kunnen hosten zolang je dat doet vanuit een openbare repository. Als persoonlijke gebruiker kun je met een repository gekoppeld aan je eigen account een persoonlijke website hosten op jegebruikersnaam.github.io en die eventueel koppelen aan een custom domeinnaam. GitHub pages publiceert dan de HTML, CSS/SCSS en JavaScript bestanden uit je repository via een bouwproces naar de door jouw gekozen url. Om dit proces makkelijker te maken, biedt GitHub dit aan via Jekyll. Jekyll is een static site generator waarmee je bijvoorbeeld blogsites kunt maken. Jekyll werkt op basis van Ruby (een programmeertaal). Als je een paar keer op dit domein bent geweest de afgelopen tijd, heb je die Jekyll website in actie kunnen zien.
15
+
16
+
## Jekyll en bye
17
+
Ik zal het verder kort houden en niet een heel oncoherent vertaal typen, maar het kwam er op neer dat de (toegankelijke) functionaliteit die ik wilde van mijn gekozen basisthema te moeilijk aan te passen was (voor mij). Het was ook geen optie om zelf iets nieuws in elkaar te gaan zetten, want daar vond ik Ruby gewoon te ingewikkeld voor. Na plusminus een week is de hele website dan ook weer in de prullenbak beland. Ik moest op zoek naar iets nieuws. En na een aantal avonden het internet afspitten, review filmpjes kijken en advies vragen bij mensen met kennis van zaken, denk ik dat ik de oplossing heb gevonden.
18
+
19
+
## Hoi Hugo
20
+
Ik ben dus uitgekomen op [Hugo](https://gohugo.io/). Hugo is een static site generator op basis van de programmeertaal Go. In de basis werkt veel hetzelfde als bij Jekyll: je hebt een map vol templates, stylebestanden en contentbestanden die allemaal netjes naar elkaar verwijzen en dan komt er dus een HTML website uit rollen. Met voor mij als belangrijkste verschil dat ik Go nu al beter begrijp dan Ruby en dat dingen die een grote invloed hebben op de toegankelijkheid van een website, zoals het menu, al standaard beter in elkaar zitten. Het installeren was met de [Quick start documentatie van Hugo](https://gohugo.io/getting-started/quick-start/) een eitje. Behalve dan dat ik instructies nooit goed doorlees en mezelf daarmee later met problemen opzadel, maar daarover in een ander blog meer. Vervolgens was het tijd om een thema uit te gaan kiezen die ik als basis kon gaan gebruiken. Ik heb eerst nog overwogen zelf iets te gaan knutselen, maar nadat ik zag hoeveel bestanden er al in de meest basic thema's zaten, heb ik dat idee snel weer losgelaten. Het allerbelangrijkste waar het thema aan moest doen, is natuurlijk toegankelijkheid.
21
+
22
+
## De zoektocht naar een thema
23
+
In mijn zoektocht kwam ik allerlei overzichtspagina's van Hugo thema's terecht, waar ik kon filteren op letterlijk honderden verschillende tags. Maar accessible of accessibility was daar niet één van. Ik moest dus iets creatiever gaan googlen en vooral op zoek naar een basisthema met weinig poespas (want dan kan er ook weinig stuk gaan). Zo kwam ik uiteindelijk uit op het [Zen thema](https://github.com/frjo/hugo-theme-zen). Een barebones, maar vrij toegankelijk thema waarin ik in ieder geval snel een goed raamwerk had voor mijn nieuwe website.
24
+
25
+
## Wordt vervolgd
26
+
Gelukkig lijkt de website die je nu bekijkt niet meer heel erg op de [voorbeeldsite van Zen](https://zen-demo.xdeb.org/). Maar dat is natuurlijk niet allemaal vanzelf gegaan. Over hoe ik uiteindelijk van dát naar dít ben gekomen en hoe ik het online heb gekregen vertel ik je in het volgend blog.
<p>Dat je dit leest, betekent in ieder geval dat er iéts live op het internet staat. Maar daaraan ging natuurlijk een heleboel vooraf. In dit blog vertel ik je waarom en hoe ik dit project ben begonnen. In de volgende blogs neem ik je mee in wat ik inhoudelijk allemaal heb gedaan en hou ik je op de hoogte over nieuwe wijzigingen.</p>
109
+
<h2id="geen-cms">Geen CMS!?</h2>
110
+
<p>Op mijn <ahref="https://renateroke.github.io/overmij/">Over mij pagina</a> heb je al kunnen lezen over hoe ik in de digitale toegankelijkheid ben beland. En dat ik na jarenlang WCAG-onderzoeken doen - waarin ik je vertel wat je allemaal fout hebt gedaan - liever advies ging geven over hoe het dan wél moet. Met mijn ervaring in een aantal reguliere contentmanagementsystemen kwam ik daar best een end mee. Maar bij een nieuwe opdracht kwam in een situatie die ik zelf nog niet eerder had meegemaakt: er is helemaal geen cms. De website bestaat eigenlijk uit een gigantische map, met alles erin wat gezamenlijk een website maakt. En die gigantische map staat op GitHub. En er dus ook geen teksteditor, je schrijft alles in markdown. En om de pagina eruit te laten zien als je wil, moet je weer allemaal kleine bestandjes uit andere delen van de map aanroepen in het template van de pagina. Je kunt je misschien voorstellen dat dat voor iemand die wel van het concept ‘GitHub’ had gehoord, maar nog nooit van static site generators, even een flinke leercurve is. Om mijzelf te helpen zo snel mogelijk ervaring op te doen, besloot ik in mijn eigen tijd deze situatie na te gaan bootsen op een eigen website.</p>
111
+
<h2id="jekyll-en-hi">Jekyll en hi!</h2>
112
+
<p>Goed, ik moest dus iets gaan doen waarbij ik markdown zou leren schrijven en zou leren lokaal een repository te draaien om die vervolgens met de wereld te delen. Voor dat laatste is GitHub pages dus een logische plek. GitHub pages is de static site hosting service van GitHub, waar personen en organisaties gratis een statische website kunnen hosten zolang je dat doet vanuit een openbare repository. Als persoonlijke gebruiker kun je met een repository gekoppeld aan je eigen account een persoonlijke website hosten op jegebruikersnaam.github.io en die eventueel koppelen aan een custom domeinnaam. GitHub pages publiceert dan de HTML, CSS/SCSS en JavaScript bestanden uit je repository via een bouwproces naar de door jouw gekozen url. Om dit proces makkelijker te maken, biedt GitHub dit aan via Jekyll. Jekyll is een static site generator waarmee je bijvoorbeeld blogsites kunt maken. Jekyll werkt op basis van Ruby (een programmeertaal). Als je een paar keer op dit domein bent geweest de afgelopen tijd, heb je die Jekyll website in actie kunnen zien.</p>
113
+
<h2id="jekyll-en-bye">Jekyll en bye</h2>
114
+
<p>Ik zal het verder kort houden en niet een heel oncoherent vertaal typen, maar het kwam er op neer dat de (toegankelijke) functionaliteit die ik wilde van mijn gekozen basisthema te moeilijk aan te passen was (voor mij). Het was ook geen optie om zelf iets nieuws in elkaar te gaan zetten, want daar vond ik Ruby gewoon te ingewikkeld voor. Na plusminus een week is de hele website dan ook weer in de prullenbak beland. Ik moest op zoek naar iets nieuws. En na een aantal avonden het internet afspitten, review filmpjes kijken en advies vragen bij mensen met kennis van zaken, denk ik dat ik de oplossing heb gevonden.</p>
115
+
<h2id="hoi-hugo">Hoi Hugo</h2>
116
+
<p>Ik ben dus uitgekomen op <ahref="https://gohugo.io/">Hugo</a>. Hugo is een static site generator op basis van de programmeertaal Go. In de basis werkt veel hetzelfde als bij Jekyll: je hebt een map vol templates, stylebestanden en contentbestanden die allemaal netjes naar elkaar verwijzen en dan komt er dus een HTML website uit rollen. Met voor mij als belangrijkste verschil dat ik Go nu al beter begrijp dan Ruby en dat dingen die een grote invloed hebben op de toegankelijkheid van een website, zoals het menu, al standaard beter in elkaar zitten. Het installeren was met de <ahref="https://gohugo.io/getting-started/quick-start/">Quick start documentatie van Hugo</a> een eitje. Behalve dan dat ik instructies nooit goed doorlees en mezelf daarmee later met problemen opzadel, maar daarover in een ander blog meer. Vervolgens was het tijd om een thema uit te gaan kiezen die ik als basis kon gaan gebruiken. Ik heb eerst nog overwogen zelf iets te gaan knutselen, maar nadat ik zag hoeveel bestanden er al in de meest basic thema’s zaten, heb ik dat idee snel weer losgelaten. Het allerbelangrijkste waar het thema aan moest doen, is natuurlijk toegankelijkheid.</p>
117
+
<h2id="de-zoektocht-naar-een-thema">De zoektocht naar een thema</h2>
118
+
<p>In mijn zoektocht kwam ik allerlei overzichtspagina’s van Hugo thema’s terecht, waar ik kon filteren op letterlijk honderden verschillende tags. Maar accessible of accessibility was daar niet één van. Ik moest dus iets creatiever gaan googlen en vooral op zoek naar een basisthema met weinig poespas (want dan kan er ook weinig stuk gaan). Zo kwam ik uiteindelijk uit op het <ahref="https://github.com/frjo/hugo-theme-zen">Zen thema</a>. Een barebones, maar vrij toegankelijk thema waarin ik in ieder geval snel een goed raamwerk had voor mijn nieuwe website.</p>
119
+
<h2id="wordt-vervolgd">Wordt vervolgd</h2>
120
+
<p>Gelukkig lijkt de website die je nu bekijkt niet meer heel erg op de <ahref="https://zen-demo.xdeb.org/">voorbeeldsite van Zen</a>. Maar dat is natuurlijk niet allemaal vanzelf gegaan. Over hoe ik uiteindelijk van dát naar dít ben gekomen en hoe ik het online heb gekregen vertel ik je in het volgend blog.</p>
<p>In mijn blogs vertel ik je over het ontstaan en de verdere ontwikkeling van deze website, de dingen die ik leer en de dingen die ik nog wil gaan leren.</p>
Dat je dit leest, betekent in ieder geval dat er iéts live op het internet staat. Maar daaraan ging natuurlijk een heleboel vooraf. In dit blog vertel ik je waarom en hoe ik dit project ben begonnen.
0 commit comments