Beeld

Image-galleries en slideshows zijn goed te gebruiken om afbeeldingen van kunst, fotografie of producten op het internet te laten zien. Ze maken het mogelijk de beperkte ruimte op het beelscherm optimaal te benutten. De op deze pagina getoonde mogelijkheden laten een aantal voor diverse toepassingen geschikte presentaties zien.

Slideshows zijn handig voor het tonen van afbeeldingen in een serieel verband. Bijvoorbeeld een fotoreportage of een serie kunstwerken die een onderlinge relatie met elkaar hebben. Een slideshow biedt de mogelijkheid ‘automatisch‘ een programma af te spelen. De toeschouwer krijgt zo een beeld van de hele in de slideshow opgenomen collectie. Nadeel van een slideshow is dat steeds maar één afbeelding te zien is. Om een bepaalde afbeelding nog eens te zien moet de gebruiker de slideshow stil zetten en naar de betreffende afbeelding navigeren.

Bekijk een voorbeeld van een slideshow

Een thumbnail image-gallery laat in de vorm van ‘thumbnails’ de complete collectie opgenomen afbeeldingen zien. Thumbnails zijn kleine afbeeldingen van (of details uit) de ‘grote‘ afbeeldingen. Door op een thumbnail te klikken verschijnt de afbeelding.
De presentatie van de thumbnails kan op verschillende manieren: statisch naast of rond de ‘grote‘ afbeelding maar ook in een al dan niet automatisch scrollend venster. Deze laatste optie biedt de mogelijkheid een groot aantal thumbnails (en afbeeldingen) in de image gallery op te nemen.

Bekijk een voorbeeld van een image-gallery

De lightbox is een interessante variant van de image gallery. Na het klikken op een thumbnail dimt het beeldscherm en verschijnt de afbeelding. Dit biedt de gebruiker een maximale focus op het getoonde zonder dat de andere elementen in de interface kunnen afleiden. Door op ‘sluit’ te klikken wordt het scherm weer ‘gewoon’ en kan een volgende afbeelding worden bekeken.

Bekijk een voorbeeld van een lightbox

Tenslotte de ’scroll pagina’. Dit soort pagina's worden steeds populairder omdat ze makkelijk met tablets te bekijken zijn. Het zijn ‘lange’ pagina’s waar door te scrollen naar de diverse content kan worden genavigeerd.
Het is zelfs mogelijk om een ‘one-page’ website te maken waarbij de hele website op 1 pagina staat. Een slim truukje - ‘lazy load’ - zorgt er voor dat de browser alleen download wat in de viewport te zien is (Om dit effect duidelijk te laten zien is in het voorbeeld een korte 'laadpauze' ingelast).

Bekijk een voorbeeld van een scroll page