Met simpele html kleurcodes je tekst markeren

Met simpele html kleurcodes je tekst markeren

zakelijke blogs schrijven

Tekst markeren met html kleurcodes zorgt dat belangrijke tekst in het oog springt. Een plugin heb je niet nodig; het is een kwestie van een piepklein stukje code invoegen.

NB: Je kán hier natuurlijk in WordPress wel een plugin voor gebruiken. Daarover lees je onder de kleurcodes meer.

Gekleurde tekst valt op. Maar kijk uit: mensen kunnen denken dat het een linkje is! Tekst tegen een felgekleurde achtergrond trekt veel meer de aandacht. Tekstkleur aanpassen is meestal een ingebouwde functie; tekst markeren doe je met html kleurcodes.

Ik heb het over html, de universele taal op internet. Deze methode werkt dus niet alleen op WordPress websites maar op alle mogelijke platformen. Je moet wel zelf even kijken waar je de html-kleurcode kan invoegen. De volgende alinea laat zien hoe dit in WordPress gaat.

Schakel over naar de teksteditor (WordPress)

Een kleurcode invoegen doe je niet in de visuele editor maar in de teksteditor, zie afbeelding.

Kleurcodes invoegen in de teksteditor van wordpress

Niet schrikken van wat je nu ziet. We noemen dit de broncode. Let niet op de coderingen en verander er ook niets aan. Zoek gewoon de tekst op die je wilt markeren.

Kleurcode invoegen met span style (ook niet-WordPress)

Als je de tekst geel wilt markeren, is dit de code:

<span style=”background-color: yellow;”>belangrijke tekst</span>

Wil je de tekst zelf geel maken, dan gebruik je:

<font color=”yellow;”>belangrijke tekst</font>

Wil je een andere kleur, dan kan dat. Om helemaal in control te zijn, gebruik je de zogeheten heximale waarde van de kleur. Op de plaats waar ‘yellow’ stond, zet je dan de kleurcode #ffff00. Switch je nu terug naar de visuele editor, dan zie je dat de tekst is gemarkeerd.

Yellow werkte in dit geval prima, maar niet alle kleurcodes hebben een html-naam. Dit donkergeel bijvoorbeeld (#f3c951) moet je echt definiëren met de heximale kleurcode.

Kleurcodes: html-naam en heximale waarde

Let erop dat gemarkeerde tekst wel leesbaar blijft!

geel html-naam: yellow, heximale waarde: #fff000

rood html-naam: red, heximale waarde: #ff0000

lichtblauw html-naam: aqua, heximale waarde: #00ffff

lichtgroen html-naam: lime, heximale waarde: #00ff00

goud html-naam: gold, heximale waarde: #ffd700

oranje html-naam: orange, heximale waarde: #ffa500

roze html-naam: pink, heximale waarde: #ffc0cb

fuchsia html-naam: fuchsia, heximale waarde: #ff00ff

zilver html-naam: silver, heximale waarde: #c0c0c0

Op een beeldscherm is elke kleur een mengeling van rood, groen en blauw (rgb-kleuren). Elke kleur kent 255 tinten. Dat betekent dat er 256³ rgb-kleuren zijn: dat zijn 16.777.216 verschillende kleuren. Keuze genoeg en genoeg keuze om keuzestress te krijgen 🙂

Maar… lang niet alle kleuren hebben een eigen html-naam en zijn lastiger te onthouden. Bekijk een keer deze lijst met html-kleurcodes bij naam en kleurcode. Kies er een paar uit die je bevallen en gebruik die voor tekstmarkingen. Je website is geen kermis.

Nogmaals, dit werkt zowel met WordPress als op andere platformen.

Kleurcodes in WordPress: plugin WP Edit

Dit kan dan weer wel alleen in WordPress. Ik ben er geen fan van om overal plugins voor te installeren. Plugins vertragen je website, en dat wil je niet. Ik houd van schone code, en dan is bovenstaande manier echt het beste.

Maar wil je, behalve tekst markeren, méér opties voor tekstbewerking, installeer dan de WordPress plugin WP Edit. Met deze plugin kan je onder andere gemakkelijk tabellen maken (in alle kleuren van de regenboog natuurlijk!).

Tekst markeren… gebruik kleurcodes met mate

Vetgedrukt, gekleurde tekst, emoji’s, gemarkeerde tekst, uitroeptekens: het werkt, maar alleen als je het selectief toepast.  Zeven gekleurde alinea’s vallen niet op. Dit irriteert alleen.

Het valt me op dat tekst markeren in zakelijke blogs weinig gebeurt. Alleen op verkooppagina’s zie je af en toe kleurcodes. Misschien omdat het een wat minder bekende optie is? In elk geval: jij weet het nu. Enjoy!

Kende jij deze shortcut om met kleurcodes tekst te markeren al?

 

Ook interessant voor je:

 

Interessant? Deel dit artikel zodat ook andere ondernemers ervan kunnen profiteren.
« Terug naar blogoverzicht

27 reacties op “Met simpele html kleurcodes je tekst markeren”

  1. Jetske schreef:
    29 december 2018 om 12:50

    Ik heb het geprobeerd op mijn weblog, maar het lukt niet. Ik werk met Pivot. Ik wilde graag het hartje rood hebben. Met tekst lukt het ook niet. Kun je mij adviseren?

    Beantwoorden
    1. Jessie schreef:
      5 januari 2019 om 22:39

      Ai, van Pivot heb ik geen kaas gegeven. Sorry! Misschien weet Google er raad mee…

      Beantwoorden
  2. Chantal Govaarts schreef:
    6 september 2018 om 08:51

    Je artikel komt als geroepen. Ik was er net naar op zoek. Ik kon een blogartikel niet publiceren zonder deze optie, maar ik kon hem niet vinden. En dan kom je erachter dat het kinderlijk eenvoudig is. Maar je moet het even weten he?!

    Fijn! Kan ik mijn artikel af gaan maken. WP Edit ga ik ook even bekijken. Bedankt voor de tip weer!

    Beantwoorden
  3. Robin schreef:
    27 mei 2018 om 23:19

    Wel leuk om te weten dankje

    Beantwoorden
  4. Neeltje schreef:
    27 mei 2018 om 15:32

    Ja, ik kende de shortcut, want ik moest op de middelbare school websites maken haha 🙂

    Beantwoorden
    1. Jessie van Loon schreef:
      21 juni 2018 om 14:55

      Tja, dan is dit gesneden koek. Bedankt voor je reactie!

      Beantwoorden
  5. Janet schreef:
    26 mei 2018 om 22:16

    Ik doe belangrijke zaken dik- of schuingedrukt. Dit werkt voor mij prima.

    Beantwoorden
  6. An schreef:
    26 mei 2018 om 20:58

    In sommige teksten passen zo’n markeringen wel. Leuk artikel!!

    Beantwoorden
    1. Jessie van Loon schreef:
      26 mei 2018 om 21:06

      Dankjewel An!

      Beantwoorden
  7. Bianca Schrijft schreef:
    26 mei 2018 om 17:59

    Zelf vind ik het in online artikel niet prettig, markeringen. Doordat er licht vanaf komt, knalt het mijn ogen in. Hierdoor maak ik er zelf ook geen gebruik van.

    Beantwoorden
    1. Jessie van Loon schreef:
      26 mei 2018 om 21:08

      Bianca, ik moet ineens denken aan vroeger op school. Je had een proefwerk en wilde NIETS vergeten; bij sommige van mijn vriendinnen resulteerde dat in kantjes vol aantekeningen vol markeringen. Vrijwel alle tekst was geel, roze of groen. Daarbij had ik hetzelfde als jij bij online artikelen; dat het in je ogen knalde 🙂

      Beantwoorden
  8. Nicole Orriëns schreef:
    26 mei 2018 om 08:05

    Ja, dit heb ik wel eens gezien. Ik moet hiermee altijd oppassen, want ik ben nogal dol op kleurtjes. Mijn valkuil zou zijn dat ik teveel kleurtjes ga gebruiken ; )

    Beantwoorden
    1. Jessie van Loon schreef:
      26 mei 2018 om 21:09

      Ha Nicole, je ként je valkuil dus dan zal het wel meevallen!

      Beantwoorden
  9. Melissa schreef:
    25 mei 2018 om 23:11

    Dit vind ik zelf echt totaal niet fijn lezen. Zou het dan ook niet snel gebruiken. Wel handig voor als je het wel fijn vindt.

    Beantwoorden
    1. Jessie van Loon schreef:
      25 mei 2018 om 23:23

      Wat mij betreft gebruik je tekstmarkering daarom heel sporadisch, en nooit voor complete alinea’s. Dan valt de extra inspanning om te lezen mee en komt de boodschap wel aan. Met gele markering blijft tekst wel te doen, maar dat is persoonlijk!

      Beantwoorden
  10. Chaya schreef:
    25 mei 2018 om 23:00

    Altijd handig om te weten indien nodig. Het valt in ieder geval heel erg op.

    Beantwoorden
    1. Jessie van Loon schreef:
      25 mei 2018 om 23:23

      Ja, best wel!

      Beantwoorden
  11. Felice Veenman schreef:
    25 mei 2018 om 18:27

    Altijd leuk, weer een beetje wijzer in HTML.

    Beantwoorden
    1. Jessie van Loon schreef:
      25 mei 2018 om 20:13

      Mee eens. Een beetje HTML kennen is altijd handig!

      Beantwoorden
  12. Amelie schreef:
    25 mei 2018 om 18:16

    Wat handig om te kunnen gebruiken!

    Beantwoorden
    1. Jessie van Loon schreef:
      25 mei 2018 om 20:14

      Ha Amelie, ben benieuwd of ik tekstmarkeringen in jouw blogs ga zien!

      Beantwoorden
  13. Sofie Katelijne schreef:
    25 mei 2018 om 16:28

    Klinkt voor mij persoonlijk nogal ingewikkeld, hahaha. Ik heb gelukkig iemand die de technische kant van mijn blog op zich neemt 🙂

    Beantwoorden
    1. Jessie van Loon schreef:
      25 mei 2018 om 17:07

      Hm, is het zo erg? 🙂

      Beantwoorden
  14. Blog & Beauty schreef:
    25 mei 2018 om 15:47

    De shortcut kende ik nog niet. Voor mijn blog gebruik ik kleuren voor een linkje, en voor iets dat ik wil dat het opvalt doe ik cursief en of vet gedrukt.

    Beantwoorden
    1. Jessie van Loon schreef:
      25 mei 2018 om 16:03

      Misschien ook dit eens proberen, is weer eens wat anders 🙂

      Beantwoorden
  15. Lodi schreef:
    25 mei 2018 om 15:25

    Heel duidelijk artikel, en zeker met mate, haha te veel is ook niet goed. Die kleurcodes die ken ik.

    Beantwoorden
    1. Jessie van Loon schreef:
      25 mei 2018 om 16:04

      Ha Lodi, daarom was het zo leuk om het in dit artikel zo mateloos te ‘mogen’ doen…

      Beantwoorden

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *

Contactinformatie

Jessie van Loon – Business Blog School
Zakelijk bloggen: meer klanten, meer omzet
stuur een e-mail

Oliemolen 114
4701 KM Roosendaal
0165 539444

BTW-nummer: NL001805511B11
Kvk-nummer: 20106724

Business Blog School op Facebook Business Blog School op twitter Jessie van Loon op LinkedIn

Copyright

© 2020 Business Blog School is een initiatief van Jessie van Loon, Tekstraket. De informatie op deze website heb ik zorgvuldig samengesteld. Fouten komen voor mijn rekening, maar rechten kun je er niet aan ontlenen.

Sommige links op deze website zijn affiliate links. Dat betekent: jij betaalt geen cent extra maar ik krijg een stukje commissie. Dat investeer ik weer in deze website.

Privacy en cookies – Algemene voorwaarden

WordPress website door BoonTheme.nl Website door BoonWebdesign.nl