Tekst opmaken in de editor

Goed opgemaakte tekst is essentieel voor een professionele en leesbare website. Webey's rich text editor biedt een breed scala aan opmaakopties waarmee je je teksten vormgeeft zonder enige kennis van HTML. In dit artikel leer je alle beschikbare opmaakfuncties kennen en krijg je tips voor leesbaarheid en toegankelijkheid.

De rich text editor

Wanneer je een Tekst-blok bewerkt, opent de rich text editor. Bovenaan zie je een werkbalk met opmaakknoppen. De editor werkt op dezelfde manier als een tekstverwerker: selecteer tekst en klik op een knop om de opmaak toe te passen, of gebruik sneltoetsen voor een snellere workflow.

Basistekstopmaak

De volgende basisopmaak is beschikbaar in elk tekst-blok:

• Vetgedrukt (Bold) — selecteer tekst en klik op B of gebruik Ctrl + B. Gebruik vetgedrukte tekst om belangrijke woorden of zinnen te benadrukken.
• Cursief (Italic) — selecteer tekst en klik op I of gebruik Ctrl + I. Cursief is handig voor titels van boeken, begrippen of subtiele nadruk.
• Onderstrepen (Underline) — selecteer tekst en klik op U of gebruik Ctrl + U. Gebruik onderstreping spaarzaam, omdat bezoekers onderstreepte tekst vaak verwarren met links.

Kopjes en koppen

Kopjes geven structuur aan je tekst en helpen bezoekers en zoekmachines de inhoud te begrijpen. Webey ondersteunt vier niveaus:

• Kop 1 (H1) — het hoofdonderwerp van de pagina. Gebruik slechts een H1 per pagina, meestal als paginatitel.
• Kop 2 (H2) — hoofdsecties binnen je pagina. Dit zijn de belangrijkste onderverdeling van je inhoud.
• Kop 3 (H3) — subsecties binnen een H2-sectie. Gebruik deze voor verdere onderverdeling.
• Kop 4 (H4) — gedetailleerde onderverdeling binnen een H3-sectie.

Om een kop toe te passen, plaats je de cursor op de gewenste regel en selecteer je het kopniveau uit het dropdown-menu in de werkbalk.

Kopjeshiërarchie voor toegankelijkheid

Het is belangrijk om kopjes in de juiste volgorde te gebruiken: ga van H1 naar H2 naar H3 en sla geen niveaus over. Schermlezers gebruiken de kopjesstructuur om door de pagina te navigeren. Een logische hiërarchie maakt je website toegankelijk voor bezoekers met een visuele beperking.

Lijsten

Lijsten zijn ideaal voor het opsommen van punten, stappen of kenmerken:

• Ongeordende lijst (opsommingstekens) — klik op het lijstpictogram of gebruik een sneltoets. Elke regel wordt voorafgegaan door een opsommingsteken. Gebruik deze voor losse punten zonder specifieke volgorde.
• Geordende lijst (nummering) — klik op het genummerde-lijstpictogram. Elke regel krijgt een nummer. Gebruik deze voor stappen, instructies of rangschikkingen waar de volgorde belangrijk is.

Je kunt lijsten nesten door een item te selecteren en op Tab te drukken voor een inspringing, of Shift + Tab om terug te gaan naar het vorige niveau.

Links toevoegen

Om een link toe te voegen, selecteer je de tekst die je wilt koppelen en klik je op het link-pictogram in de werkbalk (of gebruik Ctrl + K). Er verschijnt een dialoogvenster waar je de URL invoert. Je kunt kiezen om de link te openen in hetzelfde tabblad of in een nieuw tabblad. Gebruik voor interne pagina's een relatief pad (bijv. /over-ons) en voor externe links de volledige URL met https://.

Citaten (blockquotes)

Wil je een citaat of belangrijk fragment visueel laten opvallen? Selecteer de tekst en klik op het aanhalingsteken-pictogram in de werkbalk. De tekst wordt weergegeven als een ingesprongen citaatblok met een verticale lijn aan de linkerzijde. Dit is ideaal voor klantcitaten, bronvermeldingen of belangrijke uitspraken.

Codeblokken

Voor het weergeven van code of technische inhoud biedt de editor een inline code-optie en een codeblok:

• Inline code — selecteer een woord of kort fragment en klik op het code-pictogram. De tekst wordt weergegeven in een monospace-lettertype met een lichte achtergrond, zoals dit voorbeeld.
• Codeblok — voor langere stukken code kun je het aparte Code-bloktype gebruiken, dat syntax highlighting biedt voor verschillende programmeertalen.

Tekstuitlijning

Standaard is tekst links uitgelijnd, maar je kunt de uitlijning aanpassen:

• Links — de standaarduitlijning voor lopende tekst. Aanbevolen voor de meeste inhoud.
• Gecentreerd — handig voor titels, ondertitels en korte uitspraken.
• Rechts — zelden gebruikt, maar nuttig voor specifieke ontwerpdoeleinden.

Selecteer de tekst en klik op het gewenste uitlijningspictogram in de werkbalk.

Kleuren en spacing

In het instellingenpaneel van het tekst-blok kun je de volgende visuele eigenschappen aanpassen:

• Tekstkleur — kies een kleur uit je merkpalet of voer handmatig een kleurcode in. Zorg ervoor dat de kleur voldoende contrast heeft met de achtergrond.
• Achtergrondkleur — geef het hele tekst-blok een achtergrondkleur om het visueel te laten opvallen.
• Padding — pas de binnenruimte aan om meer of minder witruimte rond je tekst te creëren.

Tips voor leesbaarheid

Een goed leesbare tekst houdt bezoekers langer op je website:

• Houd alinea's kort — streef naar 3 tot 5 zinnen per alinea. Lange lappen tekst schrikken lezers af.
• Gebruik kopjes — verdeel je tekst in duidelijke secties met H2- en H3-kopjes. Dit maakt de tekst scanbaar.
• Gebruik lijsten — opsommingen zijn makkelijker te lezen dan lange zinnen met komma's.
• Wissel af — combineer tekst met afbeeldingen, citaten en andere elementen om de pagina visueel aantrekkelijk te houden.
• Schrijf actief — gebruik actieve zinnen in plaats van passieve constructies. "Klik op de knop" is beter dan "Er kan op de knop geklikt worden".

Toegankelijkheidstips

Maak je tekst toegankelijk voor alle bezoekers:

• Kopjeshiërarchie — gebruik kopjes in de juiste volgorde (H1 → H2 → H3). Sla geen niveaus over.
• Voldoende contrast — zorg dat tekstkleur en achtergrondkleur voldoende contrast hebben. De WCAG-richtlijn vereist een contrastratio van minimaal 4.5:1 voor normale tekst.
• Beschrijvende linkteksten — vermijd "klik hier" als linktekst. Schrijf in plaats daarvan beschrijvende links zoals "bekijk onze prijzen" zodat schermlezers de context begrijpen.
• Taalgebruik — schrijf helder en eenvoudig. Vermijd jargon tenzij je doelgroep dit verwacht.