Summary  
This chapter explains the difference between vector graphics—which use mathematical equations to define scalable shapes without quality loss—and raster graphics, which use fixed pixels and lose quality when scaled.  

General domain of usage  
Graphic design  

Er zijn twee primaire typen grafische formaten die worden gebruikt in digitale media: **vectorafbeeldingen** en **rasterafbeeldingen**.

## Vectorafbeeldingen
Vectorafbeeldingen worden gemaakt met behulp van wiskundige vergelijkingen op basis van lijnen en vormen in plaats van pixels. Dit betekent dat vectorafbeeldingen vergroot of verkleind kunnen worden zonder kwaliteitsverlies, omdat ze resolutie-onafhankelijk zijn. Standaard bestandsformaten voor vectorafbeeldingen zijn onder andere **SVG**. Voer het volgende voorbeeld uit en controleer of er geen verschil is in de beeldkwaliteit, ondanks dat de afmetingen verschillen.

PGltZwogIHNyYz0iaHR0cHM6Ly9jb2RlZmluaXR5LWNvbnRlbnQtbWVkaWEuczMuZXUtd2VzdC0xLmFtYXpvbmF3cy5jb20vY29kZS0xL3ZlY3RvcitncmFwaGljK2V4YW1wbGUiCiAgYWx0PSJtaWNyb3dhdmUiCiAgd2lkdGg9IjgwIgovPgo8aW1nCiAgc3JjPSJodHRwczovL2NvZGVmaW5pdHktY29udGVudC1tZWRpYS5zMy5ldS13ZXN0LTEuYW1hem9uYXdzLmNvbS9jb2RlLTEvdmVjdG9yK2dyYXBoaWMrZXhhbXBsZSIKICBhbHQ9Im1pY3Jvd2F2ZSIKICB3aWR0aD0iMTYwIgovPgo8aW1nCiAgc3JjPSJodHRwczovL2NvZGVmaW5pdHktY29udGVudC1tZWRpYS5zMy5ldS13ZXN0LTEuYW1hem9uYXdzLmNvbS9jb2RlLTEvdmVjdG9yK2dyYXBoaWMrZXhhbXBsZSIKICBhbHQ9Im1pY3Jvd2F2ZSIKICB3aWR0aD0iMzIwIgovPg==

## Rasterafbeeldingen
Rasterafbeeldingen worden daarentegen opgebouwd uit pixels en zijn resolutieafhankelijk. Dit betekent dat wanneer een rasterafbeelding wordt vergroot, de pixels zichtbaarder worden, wat resulteert in kwaliteitsverlies. Veelvoorkomende bestandsformaten voor rasterafbeeldingen zijn **JPEG**, **PNG** en **GIF**. Laten we het volgende voorbeeld uitvoeren. Bij toenemende breedte worden de pixels duidelijker zichtbaar en neemt de beeldkwaliteit af.

PGltZwogIHNyYz0iaHR0cHM6Ly9jb2RlZmluaXR5LWNvbnRlbnQtbWVkaWEtdjIuczMuZXUtd2VzdC0xLmFtYXpvbmF3cy5jb20vY291cnNlcy9jNDY4MDUyZC02ZDQ3LTQ2NzctYjFkMS1mYjExYWNlNzE5YjEvbWVhZGlhLSUyNi10YWJsZXMva2V0dGxlLnBuZyIKICBhbHQ9ImtldHRsZSIKICB3aWR0aD0iNjQiCi8+CjxpbWcKICBzcmM9Imh0dHBzOi8vY29kZWZpbml0eS1jb250ZW50LW1lZGlhLXYyLnMzLmV1LXdlc3QtMS5hbWF6b25hd3MuY29tL2NvdXJzZXMvYzQ2ODA1MmQtNmQ0Ny00Njc3LWIxZDEtZmIxMWFjZTcxOWIxL21lYWRpYS0lMjYtdGFibGVzL2tldHRsZS5wbmciCiAgYWx0PSJrZXR0bGUiCiAgd2lkdGg9IjEyOCIKLz4KPGltZwogIHNyYz0iaHR0cHM6Ly9jb2RlZmluaXR5LWNvbnRlbnQtbWVkaWEtdjIuczMuZXUtd2VzdC0xLmFtYXpvbmF3cy5jb20vY291cnNlcy9jNDY4MDUyZC02ZDQ3LTQ2NzctYjFkMS1mYjExYWNlNzE5YjEvbWVhZGlhLSUyNi10YWJsZXMva2V0dGxlLnBuZyIKICBhbHQ9ImtldHRsZSIKICB3aWR0aD0iMzYwIgovPg==

Samengevat worden **vectorafbeeldingen** meestal gebruikt voor logo's, illustraties en andere ontwerpen die schaalbaarheid vereisen. Daarentegen worden **rasterafbeeldingen** gebruikt voor foto's en andere ontwerpen die een hoog detailniveau vereisen. Beide typen afbeeldingen hebben echter hun sterke en zwakke punten.

Welk type grafisch formaat is het meest geschikt voor logo's en illustraties die vergroot of verkleind moeten worden zonder kwaliteitsverlies?

Welk type grafisch formaat is het meest geschikt voor foto's en ontwerpen die een hoog detailniveau vereisen?

Kunnen rasterafbeeldingen vergroot of verkleind worden zonder kwaliteitsverlies?

Leer de basisprincipes van HTML (HyperText Markup Language), de basis van webontwikkeling. Deze cursus voor beginners behandelt tags, attributen, elementen en het structureren van webpagina's. Verwerf praktische vaardigheden in het maken van koppen, alinea's, lijsten, afbeeldingen, links, formulieren en tabellen. Ontdek best practices, optimalisatie en webtoegankelijkheid. Begin je webontwikkelingsreis met HTML.

Verken de werking van het web. Leer hoe gegevens over netwerken reizen, ontdek de rol van protocollen en ontrafel de mysteries van IP-adressen en domeinnamen. Krijg een hoogwaardig begrip van hoe webbrowsers en servers communiceren om webinhoud te leveren.

Ontdek de kracht van tags om inhoud te structureren, van koppen en alinea's tot lijsten en tabellen. Leer hoe je de elementen kunt verbeteren met attributen.

De kern van de HTML-documentstructuur. Leer de componenten van een HTML-document, inclusief de doctype-verklaring, head en body. Begrijp het doel van elk element en hoe ze bijdragen aan de algehele structuur van een webpagina.

Maak een webpagina aantrekkelijker met behulp van media zoals afbeeldingen, audio en video. Werk met gestructureerde tabelgegevens in de vorm van tabellen.

Ontdek de veelzijdigheid van HTML-formulieren. Leer intuïtieve en gebruiksvriendelijke formulieren ontwerpen door gebruik te maken van belangrijke concepten en technieken. Ontdek hoe formulieren gebruikersinteractie en gegevensverzending op websites mogelijk maken.

Inzicht in vector- en rasterafbeeldingen

Vectorafbeeldingen

Rasterafbeeldingen

1. Welk type grafisch formaat is het meest geschikt voor logo's en illustraties die vergroot of verkleind moeten worden zonder kwaliteitsverlies?

2. Welk type grafisch formaat is het meest geschikt voor foto's en ontwerpen die een hoog detailniveau vereisen?

3. Kunnen rasterafbeeldingen vergroot of verkleind worden zonder kwaliteitsverlies?