• Bron: CSS-Tricks
• Link: https://css-tricks.com/spiral-scrollytelling-in-css-with-sibling-index/

• Laat elementen in een spiraal verschijnen of bewegen tijdens het scrollen.
• Belangrijkste techniek: sibling-index()
• Geeft de positie van een element onder zijn broers/zussen.
• Hiermee kun je elk element anders draaien of verschuiven.

• HTML: meerdere elementen in een container ( of ).
• CSS: combineer rotate() + translateX() of translateY() met sibling-index() voor spiraalvorm.
• Scroll-effect: gebruik JavaScript of CSS scroll-timeline om de spiraal te laten bewegen bij scroll.

article {
  position: absolute;
  top: 50%; left: 50%;
  transform: rotate(calc(sibling-index() * 30deg)) translateX(100px);
}

Voorbeeld CodePen

• Bron: Una Kravets
• Link: https://una.im/border-shape/

• Introduceert de nieuwe CSS property border-shape.
• Hiermee kun je niet-rechthoekige borders maken.
• Je kunt vormen gebruiken zoals polygon, circle of andere custom shapes.
• Het element zelf krijgt een andere vorm, niet alleen een visueel mask.

• clip-path → knipt alleen het element visueel af.
• border-shape → verandert de daadwerkelijke vorm van het element.

Daardoor volgen ook:

• background
• border
• box-shadow
• focus outlines

automatisch dezelfde vorm.

• border-shape gebruikt shapes vergelijkbaar met clip-path.
• Je definieert een vorm waarin de border wordt getekend.
• De vorm bepaalt hoe de border en de inhoud van het element worden weergegeven.

.box {
  border: 4px solid hotpink;
  border-shape: polygon(
    0% 0%,
    100% 0%,
    80% 100%,
    20% 100%
  );
}

In 2026 veranderen er verschillende regels voor websites binnen Europa. Bedrijven moeten steeds beter rekening houden met privacy, toegankelijkheid en transparantie richting gebruikers. Er wordt ook strenger gecontroleerd of websites zich aan deze regels houden. Dit betekent dat websites duidelijker moeten zijn over hoe ze met gegevens omgaan en dat digitale diensten voor meer mensen toegankelijk moeten zijn.

In 2025 zijn al belangrijke stappen gezet richting deze veranderingen. Zo ging de European Accessibility Act op 28 juni 2025 in. Deze wet zorgt ervoor dat websites en digitale diensten toegankelijk moeten zijn voor iedereen, bijvoorbeeld ook voor mensen met een visuele of motorische beperking. Bedrijven kregen hiermee de verantwoordelijkheid om hun websites beter bruikbaar en inclusiever te maken.

Vanaf 2026 komen er nog meer regels bij, bijvoorbeeld rondom kunstmatige intelligentie. Met de Artificial Intelligence Act moeten websites duidelijk maken wanneer gebruikers met AI te maken hebben, zoals bij chatbots of automatische systemen. Het doel hiervan is dat bezoekers weten wanneer ze met een computerprogramma communiceren en niet met een persoon.

• Als webdeveloper moet je niet alleen aan design en code denken maar ook aan wetgeving.
• Toegankelijkheid wordt steeds belangrijker bij het maken van websites.
• Websites moeten duidelijk zijn over het gebruik van data en technologie, zoals AI.
• Het is belangrijk om op de hoogte te blijven van nieuwe regels, omdat deze invloed hebben op hoe je websites ontwikkelt.

Links die ik hiervoor heb gebruikt:

• https://addyosmani.com/blog/ai-coding-workflow/
• https://thenewstack.io/prompt-engineering-for-developers/

Een prompt is eigenlijk alles wat je aan een LLM vraagt. Het is de input die je zelf schrijft om een bepaald antwoord of resultaat terug te krijgen. Hoe je die prompt formuleert, bepaalt voor een groot deel wat je terugkrijgt.

Prompt engineering betekent dat je bewust en slim nadenkt over hoe je je vraag stelt aan AI. Het gaat dus niet alleen om wat je vraagt, maar vooral hoe je het vraagt.

Als frontend developer kun je AI gebruiken voor dingen zoals:

• code genereren
• bugs oplossen
• uitleg krijgen over bepaalde concepten

Wat ik vooral uit het artikel van Addy Osmani haal, is dat AI pas echt goed werkt als je zelf duidelijk bent.

Je kunt het eigenlijk vergelijken met samenwerken met een collega:
als je vaag bent, krijg je ook een vaag antwoord. Maar als je precies uitlegt wat je bedoelt, krijg je veel betere en bruikbare output.

Een paar dingen waar je op moet letten:

• Wees specifiek
  Zeg niet alleen “maak een website”, maar benoem welke tools je gebruikt, zoals React, Node.js of een bepaalde library.

• Geef context
  Leg uit wat je doel is, voor wie je iets maakt en wat je al hebt. Bijvoorbeeld: “Ik heb al een formulier, maar de validatie werkt nog niet goed.”

• Geef structuur aan je vraag
  Maak duidelijk wat je verwacht:

  • wil je code?
  • een uitleg?
  • een stap-voor-stap oplossing?

• Werk iteratief
  Verwacht niet meteen het perfecte antwoord. Stel vervolgvragen en stuur bij. Dat hoort er juist bij.

• Vraag om uitleg (niet alleen code)
  Dit helpt je om het zelf beter te begrijpen, in plaats van alleen iets te kopiëren.

Wat ik vooral heb geleerd, is dat een LLM geen “magische oplossing” is, maar meer een tool waar je goed mee moet leren werken.

Hoe beter jij je vraag stelt, hoe beter het resultaat. En dat maakt prompten eigenlijk ook gewoon een skill die je moet ontwikkelen als developer.