Bij het maken van documentatie is consistentie in je visuele presentatie cruciaal. Volg deze richtlijnen om ervoor te zorgen dat je afbeeldingen een professionele en samenhangende flow behouden doorheen het document.
1. Consistentie in beeldstijlen
- Kleuren voor pijlen en markeringen: Gebruik hetzelfde kleurenschema voor pijlen, markeringen en annotaties. Als je bijvoorbeeld rode pijlen gebruikt om specifieke gebieden in een afbeelding aan te wijzen, gebruik dan dezelfde tint rood in het hele document.
- Pijlstijl en -grootte: Zorg ervoor dat de pijlstijl (bijv. recht, gebogen) en dikte consistent blijven in de afbeeldingen om een rommelig uiterlijk te voorkomen.
2. Uniformiteit schermafbeelding
Hulpmiddelen voor het maken van schermafbeeldingen:
- Met Snipping Tool (beschikbaar op Windows) kun je snel en efficiënt specifieke delen van het scherm vastleggen.
- Light shot(A chrome Extension) biedt geavanceerde functies voor het vastleggen en annoteren van schermafbeeldingen en kan in de browser zelf bewerken.
Afmetingen schermafbeeldingen: Zorg ervoor dat alle schermafbeeldingen op vergelijkbare zoomniveaus worden genomen om de proportionaliteit te behouden. Houd de grootte van de afbeeldingen uniform voor een schone en gestructureerde uitstraling.
Opvulling en marges: Zorg voor een gelijke padding rond alle zijden van de schermafbeeldingen om ze ruimte te geven om te ademen. Een opvulling van 10-20 pixels aan alle vier zijden van de afbeelding is een goede standaard.
3. Bijsnijden en kadreren
- Focusgebied: Snijd je schermafbeeldingen bij om alleen te focussen op het relevante gebied. Vermijd het opnemen van onnodige delen van het scherm (zoals browsertabbladen of achtergrondelementen), die de lezer kunnen afleiden.
- Consistentie in bijsnijden: Volg een uniforme bijsnijdstijl-centreer het belangrijkste kenmerk of gebruik de regel van derden om de compositie in evenwicht te brengen.
4. Beeldkwaliteit en formaten
- Resolutie: Zorg ervoor dat alle afbeeldingen een resolutie hebben die hoog genoeg is om duidelijk te worden weergegeven op elk scherm. Vermijd wazige of korrelige afbeeldingen, omdat deze de algehele kwaliteit van de inhoud verminderen.
- Hulpmiddelen voor converteren naar WebP-indeling:
- Squoosh (een browsergebaseerd afbeeldingscompressieprogramma) maakt eenvoudige conversie naar WebP mogelijk met behoud van kwaliteit.
- Imagify (een WordPress plugin) helpt om afbeeldingen automatisch te converteren en te optimaliseren voor WebP-indeling.
- Bestandsformaat: Gebruik WebP-indeling voor afbeeldingen om een balans te vinden tussen kwaliteit en bestandsgrootte. WebP biedt efficiënte compressie zonder verlies van beeldhelderheid, waardoor het ideaal is voor webgebaseerde documentatie.
5. Afbeeldingen benoemen
- Beschrijvende naamgeving: Geef de afbeeldingen een naam gebaseerd op de inhoud die ze illustreren. Gebruik duidelijke en relevante namen zoals “login-pagina-screenshot.webp” of “submit-button-highlight.webp”. Dit helpt niet alleen bij de organisatie, maar verbetert ook de SEO van je documentatie.
- Geef een alternatieve naam op voor de afbeelding en voeg de juiste naam toe aan de afbeelding
6. Plaatsen en uitlijnen van afbeeldingen
- Uitlijning: Zorg voor een consistente uitlijning in je hele document. Of je nu kiest voor gecentreerd of links uitgelijnd, blijf bij één stijl om een samenhangende lijn te creëren. Als je gecentreerde uitlijning gebruikt voor één afbeelding, zorg er dan voor dat alle andere afbeeldingen hetzelfde patroon volgen.
- Kies een van de uitlijningen in het hele document
7. Annotaties en Callouts
- Letterstijl annotatie: Gebruik een uniforme letterstijl en -grootte voor annotaties. Schreefloze lettertypes zoals Arial of Helvetica werken goed voor strakke, professionele documentatie.
- Plaatsing van annotaties: Plaats annotaties op logische locaties in de buurt van de relevante delen van de afbeelding, maar zorg ervoor dat ze belangrijke delen van de afbeelding niet blokkeren.
8. Professionaliteit in presentatie
- Professionele toon: Vermijd rommelige of te complexe afbeeldingen. Houd het ontwerp helder en eenvoudig en concentreer je op de belangrijkste informatie.
- Relevantie: Zorg ervoor dat elke afbeelding een duidelijk doel heeft en relevant is voor de inhoud. Onnodige afbeeldingen kunnen lezers in verwarring brengen en het professionalisme van je documentatie verminderen.
9. Gebruik van Canva en vergelijkbare tools
- Afbeeldingen ontwerpen: Gebruik tools zoals Canva voor het maken van professioneel ogende pijlen, callouts en annotaties. Canva biedt sjablonen die je kunt aanpassen aan je ontwerpstijl en die consistent blijven in het hele document.
10. Toegankelijkheid en belangrijke punten
- Alt-tekst: Geef beschrijvende alt-tekst voor elke afbeelding om de toegankelijkheid voor gebruikers met een visuele beperking te verbeteren.
- Belangrijke informatie markeren: Gebruik aanhalingstekens of blokken om belangrijke punten te benadrukken. Bijvoorbeeld: “Zorg ervoor dat de kleur en stijl van de pijl consistent blijven in het hele document voor een gepolijste, professionele uitstraling.”
- Bijvoorbeeld
- Als we de gebruikers willen vertellen dat een bepaalde functie die we in een document maken beschikbaar is in de pro-versie, kun je dit toevoegen als een geperforeerde tekst of tussen aanhalingstekens
Dit vestigt de aandacht van de lezer op belangrijke details en voegt een laag van nadruk toe aan kritieke punten.