Online koken HTML-sjabloon

Een gecentreerde kookgalerie klaar voor gebruik op statische pagina's

De kop ‘Online leren koken’ geeft de sectie een duidelijk thema en de toelichtende paragraaf biedt inleidende context voordat de visuele inhoud begint. Daaronder staan drie hoge afbeeldingstegels in één horizontale rij met smalle tussenruimtes, waardoor een compacte galerie ontstaat die een kookthema kan dragen zonder een lang tekstblok te vereisen. De HTML bevat twee carrouselslides met drie afbeeldingen per slide, zodat de voorbereide sectie via de bestaande navigatie meer beeldmateriaal kan tonen.

Knoppen voor vorige en volgende bepalen hoe bezoekers door de afbeeldingsgroepen bladeren, terwijl de lightboxweergave afzonderlijke galerieafbeeldingen van dichterbij laat zien. De zichtbare voorvertoning en de HTML tonen verschillende actieve afbeeldingen, maar beide bronnen ondersteunen dezelfde herbruikbare structuur: een kookgalerie met drie tegels en carrouselinteractie. De ‘Lees meer’-knop onder de afbeeldingen biedt een aparte route naar aanvullende informatie, waardoor de galerie gericht blijft op visuele ontdekking in plaats van elk detail in de sectie te forceren.

Binnen een statische HTML-pagina kan dit blok functioneren als een complete kookgaleriesectie tussen andere inhoudsgebieden. De omringende pagina kan bredere navigatie en context leveren, terwijl deze sectie een eigen kop, afbeeldingsreeks, bedieningselementen, lightboxweergave en vervolgactie toevoegt. Door de vaste indeling is het blok direct inzetbaar zonder de basisopbouw van de galerie opnieuw te hoeven ontwerpen.