JOOST | Webdesign + Webtech

JOOST De WebsiteMaker + De BeeldMaker + De TekstMaker = De Creatieve Maker

IK DRAAG GRAAG MIJN DIGITALE STEENTJE BIJ AAN JOUW WEBSITE !


WEBDESIGN + WEBTECH : … … …

Mijn ervaringen met webdesign en webtechnieken

Inleiding. In al de jaren dat ik bezig ben met websites en fotografie heb ik uiteenlopende webtechnieken en opmaaktechnieken uitgeprobeerd en vervat in diverse opdrachten voor opdrachtgevers.

Ik ben bekend met alle versies van HTML, de taal die content weergeeft en structureert in webpagina’s. Tevens ben ik goed thuis in de opmaaktaal voor webpagina’s, CSS oftewel stylesheets.

Ik streef naar optimaal geschreven code voor webpagina’s met als doel dat de pagina’s in alle typen browsers snel, stabiel en identiek worden weergegeven. Een snelle laadtijd zorgt ervoor dat de bezoeker gemakkelijk toegang heeft tot je website en bovendien dat het de energiekosten op de webserver én jouw laptop drukt.

Mijn streven naar lagere energiekosten raakt ook aan mijn interesse voor alternatieve beeldformaten. Kleinere beeldbestanden zorgen voor meer ruimte op je hosting en ze laden sneller. Dat is vooral handig als je telefoon een zwakke(re) verbinding heeft.

Tevens heb ik grote belangstelling voor AMP en PWA, technieken binnen HTML met elk een eigen specifieke doelstelling, maar ook voor de laadtechniek ‘Lazy Loading’.

De technieken JSON en CSV/TSV vind ik interessant om ‘numerieke’ data op een overzichtelijke manier in een webpagina toe te passen. JSON is heel geschikt om vanuit één centraal punt een grote reeks foto’s gestructureerd aan te bieden. CSV/TSV vind ik zo interessant omdat je zonder gebruikmaking van een database online de data vanuit een simpel tekstbestand laadt. AppML is een vergelijkbare data-invoertechniek.

Validering van webpagina’s is een wat vergeten kindje in de digitale wereld. Aangezien browsers van meet af aan extreem ’tolerant’ jegens webpagina’s zijn, wordt in principe elke website geladen. Er is echter een keerzijde. Als de broncode van een webpagina fouten of overbodige code bevat, zal de browser meer tijd kwijt zijn om de aangeboden code te verwerken. Een homepage die lang bezig is om te laden – ik zie dit geregeld – jaagt bezoekers weg en verhoogt de energiekosten. Correct geschreven code biedt echter een optimaal korte laadtijd met alle voordelen vandien.

Versleutelde content. Beveiliging van content is een hot item tegenwoordig. Voor een bedrijf is het belangrijk dat klantgegevens veilig achter slot en grendel bewaard worden. Dit roept de vraag op of het beveiligen – lees niet-kopieerbaar – van de content op je website wenselijk en/of mogelijk is. Ja en nee. Het versleutelen van de broncode is mogelijk maar ook zo weer op te heffen. Ook kun je tekst op het scherm niet-markeerbaar maken en daardoor niet direct kopieerbaar. Want via de broncode kun je de tekst alsnog kopiëren. Je kunt ’t wel zien als een eerste rem.
Uitgangspunt van internet is echter dat informatie toegankelijk dient te zijn. Om die reden zou ik broncode nooit versleutelen als het al effectief mogelijk is. En in hoeverre vertraagt versleuteling het laden van de pagina zeker als de versleuteling alleen met een wachtwoord ongedaan kan worden gemaakt?
Er rest slechts één echte remedie tegen het jatten van je teksten: ze niet op internet plaatsen. Kortom, ‘beveiligen van je webcontent is niet effectief en onwenselijk wat mij betreft. Zorg er wel voor dat je veilige en up-to-date codering gebruikt in je website en op je webhosting.

HTML5 is tot dusverre de laatste versie in een reeks. HTML5 is na HTML4 – en in combinatie met CSS3 – een ongekend grote stap voorwaarts. …

XHTML5 is de XML-versie van HTML5. Deze versie heeft voordelen omdat ie bij de minst of geringste fout in de broncode een foutmelding geeft die ervoor zorgt dat de content niet meer getoond wordt. Voordeel is dat je pagina’s maakt die technisch optimaal zijn en supersnel laden. Nadeel is dat deze versie voor leken onbruikbaar is. Kennis van HTML is hier onontbeerlijk.

Zouden browsers de strikte regels voor XHTML volgen, dan zou meer dan 90% – misschien wel 95% – van het internet niet (meer) functioneren. Het internet bevat zoveel ’troep’ door slordig ontworpen editors of door slordig gedrag of ondeskundigheid van website-beheerders dat browsers noodgedwongen extreem tolerant jegens webcode zijn. Eigenlijk heel jammer want het internet zou door correct gebruikte code veel efficiënter werken.

Niettemin heb ik uiteindelijk voor HTML5 gekozen bij mijn website omdat de Developer Tool Lighthouse in Chrome XHTML5 niet meer toelaat bij het scannen op Performance, Accessibility, Best Practices en SEO. Anders had ik XHTML5 op mijn website gehandhaafd.

HTML6 is een speculatief thema. Komt er (ooit) een opvolger voor HTML5? Er is inmiddels het nodige over geschreven en gezegd.

CSS3 is de meest recente versie van Cascading Stylesheets, de opmaaktaal voor webpagina’s. Waar de voorganger CSS2 nog heel ‘statisch’ was heeft CSS3 er dynamische eigenschappen bij gekregen. Zo kun je in CSS3 een object veranderen van kleur of positie (met ‘Animations’) of een rotatie (’transform: rotate(20deg)’), scheeftrekken (’transform: skew(20deg)’) of vergroting (’transform: scale(20deg)’) geven gecombineerd met dynamische eigenschappen om het object in ‘beweging’ te brengen.
De filters voor afbeeldingen die eerder alleen met HTML Canvas bewerkstelligd konden worden, zijn een prachtaanvulling in de opmaak.

Snelle(re) toegang. Je wilt natuurlijk dat je website in de breedste zin van het woord ’toegankelijk’ is. Als je wilt dat mensen jouw website goed kunnen vinden, dan moet je SEO op orde zijn. Maar toegankelijkheid wordt ook gedragen door het gebruik van correcte code in de website zoals ik al eerder stelde. En helder gepresenteerde teksten zijn ook een garantie voor een goede toegang tot je website.

Samenvatting. Deze pagina is een weerslag van mijn opgedane kennis van en ruime ervaring met webdesign en webtechnieken. Ik word immers gedreven door nieuwsgierigheid en leergierigheid. Met die achtergrond ben ik in staat jou maatwerk voor een website te leveren en verder te kijken dan de aangeboden standaard van een webtaal of webplatform zoals WordPress.
Met bovenstaand verhaal motiveer ik ook mijn drive om technisch en qua opmaakopties de best mogelijke website voor jou te realiseren. In een gekozen WordPress-Thema streef ik ernaar om technische onvolkomenheden en overbodigheden te verwijderen alsook gewenste functionaliteiten en persoonlijke opmaak te integreren.


Ga voor de voorbeelden naar Mijn voorbeelden van webdesign en webtechnieken.

Scroll-to-top button