Nieuwe website

Op dit domein oskvr.info had ik een landingspagina met korte informatie over mij en links naar mijn sociale media. Op een ander webadres stond mijn blog. Ik heb mijn blog nu geheel in eigen beheer genomen en op deze website geplaatst. Vanaf 2021 blog ik op oskvr.info.

Waarom en hoe heb ik dat gedaan?

Notitie van op
Tags:

Kladblok met vulpen
Een eigen webstek voor mijn notities (Foto van Aaron Burden via Unsplash)

Het was gemakkelijk om een blog te beginnen bij Svbtle, een SaaS-weblogservice. In een half uur had ik een account aangemaakt en de nodige profielgegevens erin gezet. Ik kon daarna meteen beginnen met het typen van tekst en uploaden van foto's. De keerzijde van deze technische ontzorging is het ontbreken van invloed op de structuur en opmaak van het weblog. Ik had kleinigheden aan te merken op Svbtle, technische ongemakken en opmaakdetails die ik niet gebruikersvriendelijk vond. Op mijn verbetersuggesties aan de beheerder van Svbtle kreeg ik geen enkele respons. Dat voelde niet goed. Jammer.

Tegelijk was die negatieve ervaring een goede stimulans om er zelf wat mee te doen. In de donkere decemberdagen was ik langer in huis. Nu de bewegingsvrijheid vanwege de SARS-CoV-2-pandemie beperkt is, zijn we ook niet op reis gegaan tijdens de feestdagen. Knutselen met websites vind ik ontspannend en leuk om te doen. Nu ik vorig jaar weer een eigen webdomein had gehuurd, zou ik daar een weblog in eigen beheer kunnen nemen. Mijn webhost Transip biedt de optie om Wordpress te installeren en daarmee te gaan bloggen. Ik deed dit niet, omdat ik niet afhankelijk wilde worden van de voor mij technisch te ingewikkelde database, theme's en plugins van dit cms.

Ik wilde een eenvoudig blog maken. Een webstek waar ik notities kan publiceren, in een digitaal notitieblok. Mijn eigen notitieblok, in eigen beheer, zonder digitale vervuiling. De techniek zou ook eenvoudig moeten zijn, omdat ik de programmering wil kunnen begrijpen en zelf kunnen wijzigen en aanpassen. Ik heb te weinig kennis van databasebeheer en javascript, dus daar wil ik geen gebruik van maken. Twintig jaar geleden heb ik mij HTML en CSS eigen gemaakt en daar websites mee geprogrammeerd. Zou ik daarmee, op basis van die inmiddels ietwat verstofte kennis, een eigen weblog kunnen bouwen? Ik ging er gewoon mee aan de slag.

Om de nieuwste ontwikkelingen van de webstandaarden te leren ben ik eerst online naar W3Schools gegaan. Ik bestudeerde daar de semantic elements in HTML5 en bedacht hoe ik daarmee mijn webstek zou kunnen structureren. Ik leerde waarom responsive webdesign belangrijk is geworden in de opmaak met CSS3. Toen ik in de beginjaren van het web websites maakte, hoefden die slechts geschikt zijn voor een PC met een monitor met 640 pixels breedte. Tegenwoordig wordt een website meestal bekeken op een van de vele smartphones, maar moet ook goed bruikbaar zijn op een tablet, notebook en supergroot beeldscherm.

En zo kwam ik vanzelf op andere studiestof: wat zijn tegenwoordig de beginselen van een gebruikersvriendelijke website? Ik had daar destijds samen met Peter Kassenaar een boek over geschreven. Die kennis had ik nog wel paraat. Ik sloeg er nog eens onze 'richtlijnen' op na. Die zijn nog steeds toepasbaar. En ik las de actuele versie van Jakob's heuristics. Met pen en papier maakte ik vervolgens schetsen van webpagina's en een schema voor de mappenstructuur van mijn website.

Wat nog ontbrak en waar ik meer over wilde weten was typografie. Welke lettertypes en welke tekstopmaak zijn geschikt voor de huidige veelheid aan schermformaten? Destijds waren eerst Netscape en daarna MS Windows met Internet Explorer, met de letters Arial en Verdana, de standaard voor webdesign. Er zijn nu veel meer webbrowsers en webfonts beschikbaar en de scherpte van de beeldschermen is veel beter geworden.

Ik ben op zoek gegaan en vond op het web de nodige actuele extra kennis en richtlijnen voor tekstopmaak bij modern responsive webdesign. In het online boek van Matthew Butterick las ik dat Charter een goed serif-lettertype is voor lange leestekst, geschikt dus voor mijn online notities. Ik heb het webfont van Charter op mijn webstek geplaatst en gekoppeld in mijn CSS. Zo is dit lettertype met zekerheid in elke browser zichtbaar. Matthew geeft ook richtlijnen voor optimale relatieve lengte en hoogte van tekstregels.

Van Oliver Reichenstein leerde ik de Basics en de The 100% Easy-2-Read Standard over het aanpassen van de lettergrootte aan leesafstanden bij gebruik van verschillende soorten computers.

Bij het bestuderen van de Axioms van Heydon Pickering en Andy Bell werd mij ineens duidelijk hoe ik die richtlijnen voor schermtekst met louter CSS in de opmaak van mijn website kan programmeren. Ik weet nu waarom je de grootte van de letters voor diverse schermformaten het beste met hoeveelheden rem varieert en hoe je de breedte van de content met cu instelt om de gewenste lengte van de tekstregels op alle mogelijke beeldschermen gelijk te houden.

Craig Hockenberry overtuigde mij dat herkenbaarheid van lettertypes een website gebruikersvriendelijker maakt. In zijn blog las ik hoe ik met CSS kan programmeren dat op elke soort computer het eigen standaard (sans-serif) systeem-lettertype in de browser getoond wordt.

Bij Nicolas Gallagher vond ik een set CSS-truukjes waarmee je kunt voorkomen dat programmeren met recente updates van HTML en CSS problemen geeft bij de weergave van de website in oude webbrowsers.

Al met al heb ik veel bijgeleerd. Vervolgens ben ik gaan programmeren, met de app Textastic op mijn iPad Mini met toetsenbord. Ik maakte een CSS-bestand en de nodige HTML-bestanden. Ik bestudeerde hoe RSS in elkaar zit, waarna ik een eigen feed, een XML-bestand, heb gemaakt. De tekst van mijn notities en andere webpagina's op mijn webstek schrijf ik in de app Ulysses en plaats ik met Textastic in het daarvoor gemaakte HTML-bestand. Dat bestand zet ik tenslotte direct vanuit Textastic met SFTP op de server bij Transip. Dit gaat al vrij vlot, maar ik knutsel nog aan het vergemakkelijken van deze workflow op mijn iPad of iPhone met behulp van de Drafts-app.

Ik was met dit alles prettig doende rond en tijdens de feestdagen. Kort voor nieuwjaar vond ik het resultaat goed genoeg om online te zetten. Na het testen van de code met de validator van het W3C heb ik resterende (type)foutjes uit de code van mijn CSS-, RSS- en HTML-ontwerpen kunnen halen. Nu ik het weblog op mijn iPhone en iPad in eigen technisch beheer heb, kan ik altijd nog gaande het gebruik daarin correcties en veranderingen aanbrengen.

Het resultaat van mijn geknutsel is uiteraard open source. De liefhebbers kunnen alles bekijken in de broncode van deze website. Verbetersuggesties zijn welkom!