Afbeeldingen in een artikel plaatsen

Medewerkers Medewerkers Laatst bijgewerkt:
Dit is een automatisch aangemaakte vertaling van de Engelse inhoud. Deze is niet door een mens beoordeeld en kan fouten bevatten. Als u deze inhoud wilt herzien, kunt u hier beginnen.

Geef uw Knowledge Base-artikelen een visuele impuls. Het toevoegen van schermafbeeldingen verduidelijkt complexe concepten en vereenvoudigt instructies, waardoor gebruikers een duidelijk beeld krijgen van interface-elementen. Deze handleiding laat u zien hoe u afbeeldingen netjes en effectief kunt opnemen, wat de helderheid van de inhoud en de betrokkenheid van de lezer vergroot.

Schermafbeeldingen maken op een computer of mobiel apparaat

Zie Schermafbeeldingen maken om te leren hoe u schermafbeeldingen voor de Knowledge Base maakt en welke bewerkingshulpmiddelen u kunt gebruiken.

Schermafbeeldingen en andere afbeeldingen toevoegen aan Knowledge Base-artikelen

Let op: u kunt de Mediagalerij en het pictogrammengalerij-artikel doorzoeken voor afbeeldingen die al beschikbaar zijn, of u kunt een nieuwe afbeelding uploaden.

Een afbeelding uploaden naar de Mediagalerij

  1. Navigeer naar de Mediagalerij.
  2. Klik rechtsonder op de knop Upload.
  3. Het dialoogvenster Uploaden wordt geopend. Klik op de knop Browse… om door de bestanden van uw computer te navigeren en de afbeelding te selecteren die u wilt uploaden.
  4. Nadat u uw afbeelding hebt geselecteerd, wordt u in een dialoogvenster gevraagd een titel en beschrijving voor uw afbeelding op te geven. Vul deze gegevens in en klik vervolgens op de knop Upload om het uploadproces te voltooien.
Onthoud dat de beschrijving die u voor uw afbeelding opgeeft, dient als alternatieve tekst (alt-tekst) voor gebruikers die afhankelijk zijn van schermlezers, wat de toegankelijkheid en het begrip van de inhoud verbetert.

Een afbeelding rechtstreeks vanuit de artikeleditor uploaden

Als u een artikel actief bewerkt en een afbeelding moet toevoegen, kunt u deze ook rechtstreeks vanaf de werkbalk uploaden:

  1. Begin met het aanmaken van een nieuw artikel of het bewerken van een bestaand artikel.
  2. Klik in de artikeleditor op de knop Media invoegen Insert media toolbar button op de werkbalk.
    KBEditorToolbar-InsertMedia
    • Deze actie opent het dialoogvenster Media invoegen.
  3. Selecteer onderin het dialoogvenster dat verschijnt de knop Upload Media om door te gaan.
  4. Klik in het dialoogvenster Uploaden op de knop Browse… om door de bestanden van uw computer te navigeren en de afbeelding te selecteren die u wilt uploaden.
  5. Nadat u uw afbeelding hebt geselecteerd, wordt u in een dialoogvenster gevraagd een titel en beschrijving voor uw afbeelding op te geven. Vul deze gegevens in en klik vervolgens op de knop Upload om het uploadproces te voltooien.

Een afbeelding aan een artikel toevoegen

  1. U kunt beginnen met het aanmaken van een nieuw artikel of het bewerken van een bestaand artikel.
  2. Zoek en klik op de knop Media invoegen Insert media toolbar button op de werkbalk.
  3. Kies in de galerij de afbeelding die u wilt toevoegen en klik vervolgens op Insert Media om deze in het artikel in te sluiten.
Insert media E

Effectief gebruik van inline afbeeldingen

Het rechtstreeks opnemen van inline schermafbeeldingen in KB-artikelen verbetert de duidelijkheid en navigatie door interface-elementen zoals knoppen en menu's visueel te demonstreren. Deze aanpak stroomlijnt artikelen, waardoor ze gemakkelijker te volgen zijn door het volume van afbeeldingen en tekst te verminderen, en leidt gebruikers rechtstreeks door de interface met beknopte, relevante visuals. Richtlijnen voor het optimaliseren van de integratie van inline afbeeldingen:

  • Geef prioriteit aan duidelijkheid: gebruik inline afbeeldingen om tekstuele aanwijzingen te vervangen door precieze, visuele representaties. Richt u op het tonen van interactieve elementen zoals menu's en knoppen, en zorg ervoor dat deze afbeeldingen direct relevant zijn en snelle herkenning en interactie door de gebruiker vergemakkelijken.
  • Strategische plaatsing: integreer schermafbeeldingen naast relevante tekst om instructies naadloos te combineren met visuele hulpmiddelen, waardoor het voor gebruikers gemakkelijker wordt om mee te volgen zonder te verdwalen in lange beschrijvingen.
  • Grootte is belangrijk: streef bij het selecteren van inline afbeeldingen naar een maximale hoogte van 16 pixels. Dit zorgt ervoor dat de visuals informatief maar onopvallend zijn, wat bijdraagt aan een schonere, meer toegankelijke lay-out voor gebruikers die door de inhoud navigeren.

Effectief gebruik van afbeeldingen voor stapsgewijze instructies

Het insluiten van schermafbeeldingen tussen zinnen in KB-artikelen demonstreert visueel acties of taken, en overbrugt de kloof tussen tekstinstructies en hun praktische toepassing. Deze aanpak verbetert het begrip en de betrokkenheid van de gebruiker door kritieke stappen van een proces te illustreren, waardoor artikelen interactiever en eenvoudiger te volgen zijn voor lezers. Richtlijnen voor het optimaliseren van het gebruik van afbeeldingen bij stapsgewijze instructies zijn onder meer:

  • Selectief gebruik: neem alleen schermafbeeldingen op voor concepten die echt baat hebben bij visuele hulp. Vermijd overmatig gebruik om rommel te voorkomen.
  • Directe correlatie: selecteer schermafbeeldingen die direct verband houden met de bijbehorende tekst, en zorg ervoor dat elke afbeelding de beschreven actie of taak duidelijk illustreert.
  • Logische volgorde: rangschik schermafbeeldingen om de natuurlijke voortgang van de stappen te volgen, en weerspiegel de daadwerkelijke ervaring van de gebruiker. Deze chronologische volgorde ondersteunt een logische stroom, wat een stapsgewijze handleiding vergemakkelijkt die lezers gemakkelijk kunnen volgen.
  • Nauwkeurigheid is essentieel: zorg ervoor dat de schermafbeeldingen nauwkeurig weergeven wat gebruikers op hun schermen zullen tegenkomen. Aangezien het uiterlijk kan variëren tussen verschillende besturingssystemen, dient u uw schermafbeeldingen dienovereenkomstig aan te passen. Zie de handleiding ‘For’-labels gebruiken voor richtlijnen over het aanpassen van schermafbeeldingen voor Windows-, macOS- en Linux-gebruikers.

Voorbeelden

Laten we het eenvoudig houden!

  • Als u een afbeelding in een tekstregel plaatst (inline afbeelding), mag deze niet hoger zijn dan 16 pixels.
  • Als u een afbeelding tussen twee zinnen in een reeks stappen of een lijst (geordend of ongeordend) plaatst, moet deze worden voorafgegaan door een puntkomma. Het is niet nodig om regeleindes rond afbeeldingen toe te voegen.

Markup voor een inline afbeelding

Zo ziet de wiki-markup voor een inline afbeelding eruit:

This is the text, followed by [[Image:The Image]], and this is the continuation of the text.

Voorbeeld van een inline afbeelding

Hier is een stukje tekst. Precies in het midden hebben we een inline afbeelding Menu hamburguer button van de Firefox-menuknop ingevoegd. Daarna hebben we extra tekst toegevoegd.

Markup voor een afbeelding in een reeks stappen

Zo ziet de wiki-markup voor het laten voorafgaan van een afbeelding door een puntkomma eruit:

# Dit is een stap.
#;[[Image:The Image]]
# Dit is de volgende stap.

Voorbeeld van een afbeelding in een reeks stappen

Dit is een voorbeeld met langere tekst en een langere afbeelding:

  1. Dit is een stap. En hier zijn wat extra woorden, zodat u kunt zien hoe ze eruitzien als ze boven de afbeelding lopen.
    Protection panel
  2. Dit is de volgende stap, opnieuw met extra woorden, zodat u kunt zien hoe ze eruitzien als ze onder de afbeelding lopen.

Richtlijnen voor de Knowledge Base

Als u geïnteresseerd bent in meer informatie over het schrijven en bewerken van Knowledge Base-artikelen, vindt u hier richtlijnen.

Deze aardige mensen hebben geholpen bij het schrijven van dit artikel:

Illustration of hands

Vrijwilliger worden

Laat uw expertise groeien en deel deze met anderen. Beantwoord vragen en verbeter onze kennisbank.

Meer info