---
description: Op zoek naar gratis HTML-editors voor het maken van je website? Bekijk dan deze lijst van 14 beste tekstuele en WYSIWYG HTML-editors om je code te bewerken.
image: https://gdm-localsites-assets-gfprod.imgix.net/images/capterra/og_logo-e5a8c001ed0bd1bb922639230fcea71a.png?auto=format%2Cenhance%2Ccompress
title: Top 14 beste HTML-editors: gratis tools voor het maken van je website
---

# De 14 beste gratis HTML-editors

Canonical: https://www.capterra.nl/blog/733/de-14-beste-gratis-html-editors

Gepubliceerd op 19-6-2019 | Geschreven door Quirine Storm van Leeuwen, Kelsie Anderson.

![De 14 beste gratis HTML-editors](https://images.ctfassets.net/63bmaubptoky/KtvWBIOr6qiDvT9dIHwnRpNKXi6oukhK-PPgFiZjiNw/093c4173ce10500a41489543e77ec349/gratis-HTML-editors-header..png)

> Startups schieten als paddenstoelen uit de grond en technologische innovaties volgen elkaar snel op. Er lijken wel een miljoen redenen te zijn om je eigen website te maken… en ook een miljoen website builders om je daarbij te helpen waaronder ook gratis html-editors.

-----

## Artikelinhoud

Startups schieten als paddenstoelen uit de grond en technologische innovaties volgen elkaar snel op. Er lijken wel een miljoen redenen te zijn om je eigen website te maken… en ook een miljoen website builders om je daarbij te helpen waaronder ook gratis html-editors.Of het nu gaat om het verkopen van een product, het creëren van een ruimte waar mensen met vergelijkbare interesses met elkaar in contact kunnen komen of om je interesse in het maken van een website te bevredigen, een website is een uitstekend middel om verbinding te maken met miljoenen mensen.En of je nu een whizzkid in webdesign bent of een beginner, waarschijnlijk weet je al dat het van belang is om enigszins bekend te zijn met HTML (HyperText Markup Language), een standaard opmaaktaal voor het ontwerpen van websites.Omdat HTML een van de meest gebruikte opmaaktalen voor het bouwen van websites is, kan het geen kwaad om hier wat kennis over te hebben. En hoe zou je het vinden als er een programma bestaat waarmee jij je HTML kunt verbeteren… of waarmee je er op z’n minst voor kunt zorgen dat je code geen fouten bevat?Nou, die tool is er, en wel in de vorm van een HTML-editor, oftewel een bewerkingsprogramma voor de code. Hieronder staan 14 opties voor HTML-editingtools (waaronder gratis html-en CSS-editors).Maar eerst bekijken we wat een HTML-editor is en waarin een aantal HTML-tools verschillen. Ook beschrijven we de mogelijkheden die elke editor te bieden heeft.Wat is een HTML-editor?Een HTML-editor is een tekstbewerker voor code. Het kan een zelfstandig programma zijn, maar maakt ook vaak deel uit van een bredere Integrated Development Environment (IDE). Dat is in wezen de toolbox van ontwikkelaars waarmee code niet alleen kan worden bewerkt, maar ook kan worden gecompileerd, geïnterpreteerd en gecorrigeerd.Meer in het bijzonder is een HTML-editor een tool waarmee je je code kunt bijhouden. Hoewel je technisch gezien je code in elke tekstbewerker kunt typen, biedt een HTML-editor de nodige functies om ervoor te zorgen dat je code goed geschreven is… of op z’n minst foutloos is.De meest elementaire functionaliteit van een HTML-editor is syntaxiscorrectie of spellingcontrole voor code. HTML-editors hebben vaak ook een functie voor het tracken van de syntaxis, waarmee de verschillende delen van de code worden gemarkeerd om het lezen te vergemakkelijken en verschillende onderdelen regel voor regel van elkaar worden gescheiden. Meestal kun je ook algemene HTML-elementen invoegen of deze automatisch laten aanvullen.Voor iedereen die wel eens vergeten heeft om een haakje af te sluiten is alleen die mogelijkheid al een waar geschenk uit de hemel.Waarom zou ik een HTML-editor gebruiken?Voor iemand die dagelijks blogartikelen schrijft, is het een zegen om een revisor te hebben die controleert of alles er goed uitziet voor de lezer.Een HTML-editor kan je beschouwen als je revisor, een controle waarop je kan vertrouwen en die een hoop gemak biedt. Zelfs een meester in coderen maakt wel eens een tikfoutje na een hele dag code schrijven. Een HTML-editor helpt bij het ondervangen van fouten zodat je niet handmatig honderden regels code langs hoeft te gaan om te zien waar het fout ging.Hoewel we ons specifiek bezighouden met de manier waarop een editor omgaat met HTML, zijn er veel editors die ook andere talen aankunnen, zoals CSS of PHP, zodat je over meer mogelijkheden beschikt als je je verder wilt bekwamen in webdesign.Maar voordat je op zoek gaat naar de HTML-editor van je dromen, is het nuttig om te weten dat er twee soorten HTML-editors zijn, die geschikt zijn voor ontwikkelaars met verschillende ervaringsniveaus.Tekstuele HTML-editorsEen tekstuele HTML-editor geeft de code regel voor regel weer, precies zoals jij die geschreven hebt.Zo ziet je code eruit in een tekstuele HTML-editor (bron: Stack Overflow)Geschikt voor: de meer ervaren codeerders, degenen die een goede controle over hun code willen en degenen die overvolle code haten. Dit soort codeerders kunnen het beste een tekstuele HTML-editor gebruiken.WYSIWYG HTML-editorsWYSIWYG is de afkorting van “What You See Is What You Get.” Dat betekent dat wanneer je een webpagina ontwerpt in een WYSIWYG-editor, je precies weet hoe de pagina eruit komt te zien voordat je deze uploadt of test. De meeste van deze editors werken met slepen-en-neerzetten, wat ze bijzonder handig maakt.In een WYSIWYG-editor kun je precies nagaan hoe je webontwerp eruit komt te zien (bron: Elated)Geschikt voor: de minder ervaren codeerders en degenen die meer gericht zijn op ontwerp dan op code. Dit soort codeerders zou beter naar een WYSIWYG-editor kunnen kijken dan een tekstuele editor.Maar zijn er dan wel gratis HTML-editors?We zouden de hele dag door kunnen gaan met praten over handige coderingstools. Maar als je nog maar net begonnen bent met coderen of als je van plan bent een bureau voor webdesign te beginnen, zijn je financiële middelen wellicht beperkt.Gelukkig zijn er aardig wat gratis open source HTML-editors te krijgen. We belichten er hier 14, waarbij onderscheid wordt gemaakt tussen tekstuele editors en WYSIWYG-editors. Ze staan hieronder in alfabetische volgorde, samen met een korte beschrijving van de respectieve mogelijkheden.Gratis tekstuele HTML-editorsDenk eraan dat je voor deze editors wel de nodige ervaring met HTML of een andere codeertaal moet hebben. Deze editors bieden ondersteuning wanneer je fouten maakt, maar ze kunnen geen code voor je schrijven.Aptana Studio 3Weergave van html-editor Aptana (Bron:  Aptana)Aptana Studio is een aanpasbare open source IDE. Naast HTML5 kan deze tool CSS, JavaScript, PHP, Ruby, Rails en Python bewerken. De oplossing kan worden geïntegreerd met  Git voor versiebeheer en kan worden geïmplementeerd met FTP-, SFTP-, FTPS- en Capistrano-protocollen. De laatste update vond plaats in maart 2017.Meer informatieArachnophiliaScreenshot van Arachnophilia 5.5 (Bron: Arachnophilia)Arachnophilia is een open source HTML-editor geschreven in Java (omdat de maker ervan, Paul Lutus,  Microsoft-producten boycot). De editor ondersteunt Unicode en kan ook projecten in PHP, Perl, C++, Java en JavaScript bewerken. Bovendien heeft de editor een ingebouwde FTP-client om te helpen bij de implementatie. De laatste update vond plaats in april 2018 waarbij XHTML werd inbegrepen.Meer informatie&#10;&#10;  Bluefish&#10;Bluefish code tekstbewerker (Bron: Bluefish)Bluefish is een open source code-editor die draait onder Linux, Mac OS X, Windows, FreeBSD, OpenBSD en Solaris. De editor ondersteunt FTP-, SFTP-, HTTP-, HTTPS-, WebDAV- en CIFS-protocollen. Voor degenen die werken aan grote projecten kan Bluefish meer dan 500 documenten tegelijk geopend hebben. Wijzigingen in documenten worden automatisch hersteld als je systeem vastloopt tijdens het coderen. De tool is ook geschikt voor aardig wat andere talen, zoals C++, Google Go, Java, Perl, PHP, Python en R. De laatste update vond plaats in 2017.&#10;&#10;  Meer informatie&#10;&#10;  CoffeeCup&#10;Weergave CoffeCup html-editor (Bron: CoffeCup)CoffeeCup levert een gratis HTML-teksteditor. Maar als je behoefte hebt aan meer WYSIWYG-mogelijkheden, is er tegen betaling ook een “Visual Editor” verkrijgbaar. Je kunt met CoffeeCup zowel HTML- als CSS-bestanden maken en bestaande websitebestanden bewerken. Bovendien kun je content op pagina’s bijwerken met de Components Library.&#10;&#10;  Meer informatie&#10;&#10;  Eclipse&#10;Eclipse code editor (bron: JavaEE Tips)Eclipse biedt een reeks plug-ins, waaronder een HTML-editor, in de open source Web Developer Tools-kit. Bovendien heeft de tool plug-ins voor het bewerken van CSS, JSON en JavaScript. Op de site van de leverancier wordt gewaarschuwd dat “nieuwe gebruikers het verwarrend kunnen vinden” als ze alleen maar HTML-code willen bewerken. Dus zouden beginnelingen deze editor misschien het beste kunnen negeren, terwijl ervaren codeerders de flexibiliteit van Eclipse juist aantrekkelijk zullen vinden. De laatste update vond plaats in maart 2019.&#10;&#10;  Meer informatie&#10;&#10;  Komodo IDE&#10;KomodeID weergave (Bron: ActiveState)Komodo IDE van ActiveState heeft een uitgeklede gratis versie van een uitgebreider systeem, naast licenties waarvoor betaald moet worden. Maar ook de gratis versie biedt enkele krachtige functies, zoals automatisch aanvullen en tools voor debugging. De editor is tevens geschikt voor een aantal andere talen, zoals Python, Perl en Node.js.&#10;&#10;  Meer informatie&#10;&#10;  Microsoft Visual Studio Community&#10;Screenshot van Microsoft Visual Studio editor (Bron: Microsoft)Als je Microsoft niet boycot zoals Paul Lutus, de maker van Arachnophlia, zou je eens kunnen kijken naar de gratis “Community”-editie van de IDE van Microsoft Visual Studio, die ondersteuning biedt voor vijf gebruikers. Hoewel de betaalde versies geavanceerdere functies te bieden hebben, bevat de gratis versie alle essentiële tools voor HTML-editing. Bovendien zijn er enkele handige functies voor het ontwikkelen van mobiele apps, zoals het delen van code tussen Android en iOS.&#10;&#10;  Meer informatie&#10;&#10;  NetBeans&#10;html-editor screenshot van NetBeans (Bron: NetBeans)NetBeans is een gratis en open source IDE waarmee je kunt coderen in HTML5, PHP, JavaScript, C++ en verschillende andere talen. De editor bevat codesjablonen en -generators, naast tools voor projectmanagement ter ondersteuning van grotere projecten en teams. Bovendien is er een grote  marketplace voor plug-ins en worden ontwikkelaars aangemoedigd hun eigen plug-ins te schrijven en te delen. De laatste update vond plaats in april 2019.&#10;&#10;  Meer informatie&#10;&#10;  Notepad++&#10;Notepad++ html-editor (Bron: Wikimedia Commons)Notepad++, dat overigens alleen beschikbaar is voor Windows, is een gratis source code editor geschreven in C++. De UI kan volledig worden aangepast en gebruikers kunnen zelf beslissen hoe de syntaxis wordt gemarkeerd en ingevouwen. En er is een bonus: voor de milieubewuste ontwikkelaar is het goed te weten dat Notepad++ de uitstoot van CO2 wil terugdringen door programma’s te maken die minder CPU-vermogen nodig hebben. De laatste update vond plaats in mei 2019.&#10;&#10;  Meer informatie&#10;&#10;  NoteTab Light&#10;html-editor Notetab Light (Bron: NoteTab)NoteTab laat meteen al in zijn productbeschrijving weten dat degenen die liever met een WYSIWYG-editor werken, beter niet voor dit systeem kunnen kiezen. Maar ben je op zoek naar een gratis, gespecialiseerde HTML-editor, kijk dan zeker eens naar NoteTab. De leverancier claimt dat dankzij de toegepaste minimalistische methode voor syntaxismarkering je HTML- of CSS-code gemakkelijker te lezen is dan in sommige andere editors. En met de aanpasbare sneltoetsen voor codefragmenten kun je razendsnel code van het ene project naar het andere kopiëren en plakken. Er is een “Standard”- en “Pro”-versie van NoteTab als je krachtigere functies nodig hebt.&#10;&#10;  Meer informatie&#10;PSPadWeergave van PSPad (Bron: PSPad)PSPad is een andere oplossing die alleen onder Windows draait. Sommige producten in onze lijst zijn niet echt bedoeld voor commercieel gebruik (en dan met name de producten met betaalde versies), maar PSPad is altijd gratis en kan kosteloos worden gebruikt door commerciële bedrijven en overheidsinstanties. Het programma biedt codesjablonen, spellingcontrole en auto-correctie. De laatste update vond plaats in februari 2019.Gratis WYSIWYG HTML-editorsDe meeste van deze editors zijn geschikt voor beginnende codeerders en ontwerpers. Sommige ervan genereren code terwijl je webpagina-elementen sleept naar de gewenste positie op de pagina. Andere laten de code van de pagina zien, maar die kun je dan zelf naar believen bewerken. Omdat je wijzigingen op het scherm worden weergegeven, kun je je ontwerp in real-time blijven aanpassen.BlueGriffonWeergave van BlueGriffon html-editor (bron: Bluegriffon)BlueGriffon heeft enkele betaalde versies van zijn product, maar de gratis versie bevat alle essentiële tools voor het ontwerpen van webpagina’s. Het is een van de drie WYSIWYG-editors in onze lijst en volgens de website van de leverancier wordt de oplossing “officieel aanbevolen door de Franse regering als de Web Authoring Tool voor de Franse overheid”. Dus als je vertrouwen hebt in de keuze van de Franse overheid wat betreft HTML-editors, is dit de juiste tool voor jou\!BlueGriffon biedt een dubbele weergave van enerzijds je broncode en anderzijds het WYSIWYG-ontwerp, zodat je de code kunt bijhouden en tegelijkertijd kunt controleren hoe je site eruitziet. De editor is ook geschikt voor CSS en SVG. De betaalde versie van het product heeft ontwerpgeoriënteerde functies zoals een fullscreen editor, een pipet om kleuren te kiezen en waarschuwingen bij overschrijding van de limiet van het aantal toegestane woorden.Meer informatieNetObjects fusion EssentialsNetObjects WYSWYG HTML-editor (bron: NetObjects)NetObjects Fusion omschrijft zichzelf als een “HTML-generator in plaats van een HTML-editor.” Met de drag-and-drop-functionaliteit van het product kun je goed ontworpen webpagina’s maken precies zoals je gebruikers die te zien krijgen. Met de gratis versie kun je HTML5-websites met fotogalerijen, formulieren en eCommerce-functionaliteit bouwen.Meer informatie&#10;&#10;  SeaMonkey&#10;SeaMonkey WYSWYG editor (bron: Seamonkey)SeaMonkey is een open source “alles-in-één internetapplicatie” met een browser, e-mail, chat en tools voor webontwikkeling, waaronder een HTML-editor. Dus als je alleen maar een HTML-editor wilt, kun je beter op zoek gaan naar een ander systeem in onze lijst. Maar voor ontwikkelaars die een compleet pakket willen, kan SeaMonkey wel eens de moeite van het proberen waard zijn. Het project wordt mogelijk gemaakt door Mozilla en gebruikt daarom veel van dezelfde broncode als Firefox en Thunderbird. De laatste update vond plaats in juli 2018.&#10;&#10;  Meer informatie&#10;Dus coderen maar\!Als je op zoek bent naar een HTML-editor, heb je hier hopelijk aardig wat ideeën opgedaan. Duik er eens in en test een paar tools om te zien welk programma het beste voor jou is. En laat ons hieronder weten hoe het je is bevallen\!Wil je meer weten over HTML-editors? Bekijk dan onze lijst met webdesign-software.

## Over de auteurs

### Quirine Storm van Leeuwen

Quirine is Program Manager voor het Franse en Duitse contentteam en beheert en definieert de contentproductie en de strategie met betrekking tot het onderzoek.

### Kelsie Anderson

Kelsie was Content Analyst voor Capterra.

## Verwante software

- [Bluefish](https://www.capterra.nl/software/175980/bluefish) — 4.3/5 (4 reviews)
- [CoffeeCup](https://www.capterra.nl/software/217519/coffeecup) — 4.5/5 (2 reviews)
- [ECLIPSE](https://www.capterra.nl/software/27349/eclipse) — 4.5/5 (269 reviews)
- [Komodo IDE](https://www.capterra.nl/software/1000033/komodo-ide) — 4.4/5 (14 reviews)
- [Microsoft Visual Studio](https://www.capterra.nl/software/101288/microsoft-visual-studio) — 4.6/5 (3005 reviews)
- [Apache NetBeans](https://www.capterra.nl/software/178681/apache-netbeans) — 4.3/5 (231 reviews)
- [Notepad++](https://www.capterra.nl/software/185965/notepad) — 4.7/5 (2004 reviews)
-  — 4.6/5 (5 reviews)
- [SeaMonkey Suite](https://www.capterra.nl/software/176013/seamonkey-suite) — 3.7/5 (3 reviews)

## Gerelateerde categorieën

- [ICT-beheersoftware](https://www.capterra.nl/directory/10001/it-management/software)
- [IT-asset management software](https://www.capterra.nl/directory/30077/it-asset-management/software)
- [IT-service software](https://www.capterra.nl/directory/30672/it-service/software)
- [Netwerkbeveiliging software](https://www.capterra.nl/directory/30003/network-security/software)
- [Network monitoring tools](https://www.capterra.nl/directory/30019/network-monitoring/software)

## Gerelateerde artikelen

- [Een wireframe maken in 6 eenvoudige stappen](https://www.capterra.nl/blog/1868/wireframe-maken-in-6-stappen)
- [6 inspirerende verhalen van vrouwen in tech](https://www.capterra.nl/blog/1346/6-inspirerende-verhalen-vrouwen-in-tech)
- [5 tips om je organisatie te beschermen tegen hackers](https://www.capterra.nl/blog/855/organisatie-beschermen-tegen-hackers)
- [Werken in de cloud: een succesvolle cloudmigratie in 5 stappen](https://www.capterra.nl/blog/1311/werken-in-cloud-cloudmigratie-stap-voor-stap)
- [De 4 beste Spiceworks-alternatieven voor IT-helpdesk](https://www.capterra.nl/blog/1477/it-helpdesk-4-beste-spiceworks-alternatieven)

## Links

- [Bekijk op Capterra](https://www.capterra.nl/blog/733/de-14-beste-gratis-html-editors)
- [Blog](https://www.capterra.nl/blog)
- [Startpagina](https://www.capterra.nl/)

-----

## Gestructureerde gegevens

<script type="application/ld+json">
  {"@context":"https://schema.org","@graph":[{"name":"Capterra Nederland","address":{"@type":"PostalAddress","addressLocality":"Amsterdam","addressRegion":"NH","postalCode":"1101","streetAddress":"De Entree 79 1101 BH Amsterdam Nederland"},"description":"Capterra Nederland helpt miljoenen mensen om de beste bedrijfssoftware te vinden. Met reviews, scores, infographics en het meest uitgebreide overzicht van bedrijfssoftware.","email":"info@capterra.nl","url":"https://www.capterra.nl/","logo":"https://dm-localsites-assets-prod.imgix.net/images/capterra/logo-a9b3b18653bd44e574e5108c22ab4d3c.svg","@id":"https://www.capterra.nl/#organization","@type":"Organization","parentOrganization":"G2.com, Inc.","sameAs":["https://twitter.com/Capterra_NL/","https://www.facebook.com/Capterra/","https://www.linkedin.com/company/capterra","https://www.youtube.com/channel/UCjbsogwKUrJcUHRpSQvRo6g"]},{"name":"Capterra Nederland","url":"https://www.capterra.nl/","@id":"https://www.capterra.nl/#website","@type":"WebSite","publisher":{"@id":"https://www.capterra.nl/#organization"},"potentialAction":{"query":"required","target":"https://www.capterra.nl/search/?q={search_term_string}","@type":"SearchAction","query-input":"required name=search_term_string"}},{"name":"Top 14 beste HTML-editors: gratis tools voor het maken van je website","description":"Op zoek naar gratis HTML-editors voor het maken van je website? Bekijk dan deze lijst van 14 beste tekstuele en WYSIWYG HTML-editors om je code te bewerken.","url":"https://www.capterra.nl/blog/733/de-14-beste-gratis-html-editors","about":{"@id":"https://www.capterra.nl/#organization"},"@id":"https://www.capterra.nl/blog/733/de-14-beste-gratis-html-editors#webpage","@type":"WebPage","isPartOf":{"@id":"https://www.capterra.nl/#website"}},{"description":"Startups schieten als paddenstoelen uit de grond en technologische innovaties volgen elkaar snel op. Er lijken wel een miljoen redenen te zijn om je eigen website te maken… en ook een miljoen website builders om je daarbij te helpen waaronder ook gratis html-editors.","author":[{"name":"Quirine Storm van Leeuwen","@type":"Person"},{"name":"Kelsie Anderson","@type":"Person"}],"image":{"url":"https://images.ctfassets.net/63bmaubptoky/KtvWBIOr6qiDvT9dIHwnRpNKXi6oukhK-PPgFiZjiNw/093c4173ce10500a41489543e77ec349/gratis-HTML-editors-header..png","@id":"https://www.capterra.nl/blog/733/de-14-beste-gratis-html-editors#primaryimage","@type":"ImageObject"},"headline":"De 14 beste gratis HTML-editors","@type":"BlogPosting","publisher":{"@id":"https://www.capterra.nl/#organization"},"articleBody":"&lt;p&gt;Startups schieten als paddenstoelen uit de grond en technologische innovaties volgen elkaar snel op. Er lijken wel een miljoen redenen te zijn om je eigen website te maken… en ook een miljoen website builders om je daarbij te helpen waaronder ook &lt;a href=&quot;/directory/30935/website-builder/pricing/free/software&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot;&gt;gratis html-editors&lt;/a&gt;.&lt;/p&gt;&lt;p&gt;Of het nu gaat om het verkopen van een product, het creëren van een ruimte waar mensen met vergelijkbare interesses met elkaar in contact kunnen komen of om je interesse in het maken van een website te bevredigen, een website is een uitstekend middel om verbinding te maken met miljoenen mensen.&lt;/p&gt;&lt;p&gt;En of je nu een whizzkid in webdesign bent of een beginner, waarschijnlijk weet je al dat het van belang is om enigszins bekend te zijn met HTML (HyperText Markup Language), een standaard opmaaktaal voor het ontwerpen van websites.&lt;/p&gt;&lt;p&gt;Omdat HTML een van de meest gebruikte opmaaktalen voor het bouwen van websites is, kan het geen kwaad om hier wat kennis over te hebben. En hoe zou je het vinden als er een programma bestaat waarmee jij je HTML kunt verbeteren… of waarmee je er op z’n minst voor kunt zorgen dat je code geen fouten bevat?&lt;/p&gt;&lt;p&gt;Nou, die tool is er, en wel in de vorm van een HTML-editor, oftewel een bewerkingsprogramma voor de code. Hieronder staan 14 opties voor HTML-editingtools (waaronder gratis html-en CSS-editors).&lt;/p&gt;&lt;p&gt;Maar eerst bekijken we wat een HTML-editor is en waarin een aantal HTML-tools verschillen. Ook beschrijven we de mogelijkheden die elke editor te bieden heeft.&lt;/p&gt;&lt;img title=&quot;gratis-HTML-editors-header&quot; alt=&quot;gratis HTML-editors coding&quot; class=&quot;aligncenter&quot; fetchpriority=&quot;high&quot; src=&quot;https://images.ctfassets.net/63bmaubptoky/KtvWBIOr6qiDvT9dIHwnRpNKXi6oukhK-PPgFiZjiNw/093c4173ce10500a41489543e77ec349/gratis-HTML-editors-header..png&quot; srcset=&quot;https://images.ctfassets.net/63bmaubptoky/KtvWBIOr6qiDvT9dIHwnRpNKXi6oukhK-PPgFiZjiNw/093c4173ce10500a41489543e77ec349/gratis-HTML-editors-header..png?w=400 400w, https://images.ctfassets.net/63bmaubptoky/KtvWBIOr6qiDvT9dIHwnRpNKXi6oukhK-PPgFiZjiNw/093c4173ce10500a41489543e77ec349/gratis-HTML-editors-header..png?w=700 700w, https://images.ctfassets.net/63bmaubptoky/KtvWBIOr6qiDvT9dIHwnRpNKXi6oukhK-PPgFiZjiNw/093c4173ce10500a41489543e77ec349/gratis-HTML-editors-header..png?w=1000 1000w, https://images.ctfassets.net/63bmaubptoky/KtvWBIOr6qiDvT9dIHwnRpNKXi6oukhK-PPgFiZjiNw/093c4173ce10500a41489543e77ec349/gratis-HTML-editors-header..png?w=1500 1500w, https://images.ctfassets.net/63bmaubptoky/KtvWBIOr6qiDvT9dIHwnRpNKXi6oukhK-PPgFiZjiNw/093c4173ce10500a41489543e77ec349/gratis-HTML-editors-header..png?w=2200 2200w&quot; sizes=&quot;(min-resolution: 2x) 2200px, (min-width: 992px) 1000px, 95vw&quot;/&gt;&lt;h2&gt;&lt;b&gt;Wat is een HTML-editor?&lt;/b&gt;&lt;/h2&gt;&lt;p&gt;Een HTML-editor is een tekstbewerker voor code. Het kan een zelfstandig programma zijn, maar maakt ook vaak deel uit van een bredere Integrated Development Environment (IDE). Dat is in wezen de toolbox van ontwikkelaars waarmee code niet alleen kan worden bewerkt, maar ook kan worden gecompileerd, geïnterpreteerd en gecorrigeerd.&lt;/p&gt;&lt;p&gt;Meer in het bijzonder is een HTML-editor een tool waarmee je je code kunt bijhouden. Hoewel je technisch gezien je code in elke tekstbewerker kunt typen, biedt een HTML-editor de nodige functies om ervoor te zorgen dat je code goed geschreven is… of op z’n minst foutloos is.&lt;/p&gt;&lt;p&gt;De meest elementaire functionaliteit van een HTML-editor is syntaxiscorrectie of spellingcontrole voor code. HTML-editors hebben vaak ook een functie voor het tracken van de syntaxis, waarmee de verschillende delen van de code worden gemarkeerd om het lezen te vergemakkelijken en verschillende onderdelen regel voor regel van elkaar worden gescheiden. Meestal kun je ook algemene HTML-elementen invoegen of deze automatisch laten aanvullen.&lt;/p&gt;&lt;p&gt;Voor iedereen die wel eens vergeten heeft om een haakje af te sluiten is alleen die mogelijkheid al een waar geschenk uit de hemel.&lt;/p&gt;&lt;h2&gt;&lt;b&gt;Waarom zou ik een HTML-editor gebruiken?&lt;/b&gt;&lt;/h2&gt;&lt;p&gt;Voor iemand die dagelijks blogartikelen schrijft, is het een zegen om een revisor te hebben die controleert of alles er goed uitziet voor de lezer.&lt;/p&gt;&lt;p&gt;Een HTML-editor kan je beschouwen als je revisor, een controle waarop je kan vertrouwen en die een hoop gemak biedt. Zelfs een meester in coderen maakt wel eens een tikfoutje na een hele dag code schrijven. Een HTML-editor helpt bij het ondervangen van fouten zodat je niet handmatig honderden regels code langs hoeft te gaan om te zien waar het fout ging.&lt;/p&gt;&lt;p&gt;Hoewel we ons specifiek bezighouden met de manier waarop een editor omgaat met HTML, zijn er &lt;b&gt;veel editors die ook andere talen aankunnen, zoals CSS of PHP&lt;/b&gt;, zodat je over meer mogelijkheden beschikt als je je verder wilt bekwamen in webdesign.&lt;/p&gt;&lt;p&gt;Maar voordat je op zoek gaat naar de HTML-editor van je dromen, is het nuttig om te weten dat er&lt;b&gt; twee soorten HTML-editors&lt;/b&gt; zijn, die geschikt zijn voor ontwikkelaars met verschillende ervaringsniveaus.&lt;/p&gt;&lt;h2&gt;&lt;b&gt;Tekstuele HTML-editors&lt;/b&gt;&lt;/h2&gt;&lt;p&gt;Een tekstuele HTML-editor geeft de code regel voor regel weer, precies zoals jij die geschreven hebt.&lt;/p&gt;&lt;figure class=&quot;aligncenter&quot;&gt;&lt;img title=&quot;code-1&quot; alt=&quot;gratis tekstuele html-editors weergave&quot; class=&quot;aligncenter&quot; fetchpriority=&quot;high&quot; src=&quot;https://images.ctfassets.net/63bmaubptoky/OASOi6E_KG8y2jyn0menT30dy4UGDNLR6CX3RhWOyno/6ff34ffdda3dafc4b644e60dec83a702/code-1.png&quot; srcset=&quot;https://images.ctfassets.net/63bmaubptoky/OASOi6E_KG8y2jyn0menT30dy4UGDNLR6CX3RhWOyno/6ff34ffdda3dafc4b644e60dec83a702/code-1.png?w=400 400w, https://images.ctfassets.net/63bmaubptoky/OASOi6E_KG8y2jyn0menT30dy4UGDNLR6CX3RhWOyno/6ff34ffdda3dafc4b644e60dec83a702/code-1.png?w=700 700w, https://images.ctfassets.net/63bmaubptoky/OASOi6E_KG8y2jyn0menT30dy4UGDNLR6CX3RhWOyno/6ff34ffdda3dafc4b644e60dec83a702/code-1.png?w=1000 1000w, https://images.ctfassets.net/63bmaubptoky/OASOi6E_KG8y2jyn0menT30dy4UGDNLR6CX3RhWOyno/6ff34ffdda3dafc4b644e60dec83a702/code-1.png?w=1500 1500w, https://images.ctfassets.net/63bmaubptoky/OASOi6E_KG8y2jyn0menT30dy4UGDNLR6CX3RhWOyno/6ff34ffdda3dafc4b644e60dec83a702/code-1.png?w=2200 2200w&quot; sizes=&quot;(min-resolution: 2x) 2200px, (min-width: 992px) 1000px, 95vw&quot;/&gt;&lt;figcaption&gt;Zo ziet je code eruit in een tekstuele HTML-editor (bron: &lt;a href=&quot;//stackoverflow.com/questions/17847381/custom-structuredtexteditor-not-showing-colour-codes-when-opening-html-codehttps&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;Stack Overflow&lt;/a&gt;)&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;b&gt;Geschikt voor: &lt;/b&gt;de meer ervaren codeerders, degenen die een goede controle over hun code willen en degenen die overvolle code haten. Dit soort codeerders kunnen het beste een tekstuele HTML-editor gebruiken.&lt;/p&gt;&lt;h2&gt;&lt;b&gt;WYSIWYG HTML-editors&lt;/b&gt;&lt;/h2&gt;&lt;p&gt;WYSIWYG is de afkorting van “What You See Is What You Get.” Dat betekent dat wanneer je een webpagina ontwerpt in een WYSIWYG-editor, je precies weet hoe de pagina eruit komt te zien voordat je deze uploadt of test. De meeste van deze editors werken met slepen-en-neerzetten, wat ze bijzonder handig maakt.&lt;/p&gt;&lt;figure class=&quot;aligncenter&quot;&gt;&lt;img title=&quot;WYSWYG-editor&quot; alt=&quot;gratis html-editor WYSWYG&quot; class=&quot;aligncenter&quot; fetchpriority=&quot;high&quot; src=&quot;https://images.ctfassets.net/63bmaubptoky/QcV9RT0pSpFStq-Rwal0F0RibUJOSSKQiizxwspnAZA/1feb8d66a20a40b4c1c02135f1548e51/WYSWYG-editor.jpg&quot; srcset=&quot;https://images.ctfassets.net/63bmaubptoky/QcV9RT0pSpFStq-Rwal0F0RibUJOSSKQiizxwspnAZA/1feb8d66a20a40b4c1c02135f1548e51/WYSWYG-editor.jpg?w=400 400w, https://images.ctfassets.net/63bmaubptoky/QcV9RT0pSpFStq-Rwal0F0RibUJOSSKQiizxwspnAZA/1feb8d66a20a40b4c1c02135f1548e51/WYSWYG-editor.jpg?w=700 700w, https://images.ctfassets.net/63bmaubptoky/QcV9RT0pSpFStq-Rwal0F0RibUJOSSKQiizxwspnAZA/1feb8d66a20a40b4c1c02135f1548e51/WYSWYG-editor.jpg?w=1000 1000w, https://images.ctfassets.net/63bmaubptoky/QcV9RT0pSpFStq-Rwal0F0RibUJOSSKQiizxwspnAZA/1feb8d66a20a40b4c1c02135f1548e51/WYSWYG-editor.jpg?w=1500 1500w, https://images.ctfassets.net/63bmaubptoky/QcV9RT0pSpFStq-Rwal0F0RibUJOSSKQiizxwspnAZA/1feb8d66a20a40b4c1c02135f1548e51/WYSWYG-editor.jpg?w=2200 2200w&quot; sizes=&quot;(min-resolution: 2x) 2200px, (min-width: 992px) 1000px, 95vw&quot;/&gt;&lt;figcaption&gt;In een WYSIWYG-editor kun je precies nagaan hoe je webontwerp eruit komt te zien (bron: &lt;a href=&quot;//www.elated.com/articles/adding-wysiwyg-editor-to-your-site/https&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;Elated&lt;/a&gt;)&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;b&gt;Geschikt voor: &lt;/b&gt;de minder ervaren codeerders en degenen die meer gericht zijn op ontwerp dan op code. Dit soort codeerders zou beter naar een WYSIWYG-editor kunnen kijken dan een tekstuele editor.&lt;/p&gt;&lt;h2&gt;&lt;b&gt;Maar zijn er dan wel gratis HTML-editors?&lt;/b&gt;&lt;/h2&gt;&lt;p&gt;We zouden de hele dag door kunnen gaan met praten over handige coderingstools. Maar als je nog maar net begonnen bent met coderen of als je van plan bent een bureau voor webdesign te beginnen, zijn je financiële middelen wellicht beperkt.&lt;/p&gt;&lt;p&gt;Gelukkig zijn er aardig wat &lt;b&gt;gratis open source HTML-editors&lt;/b&gt; te krijgen. We belichten er hier 14, waarbij onderscheid wordt gemaakt tussen tekstuele editors en WYSIWYG-editors. Ze staan hieronder in alfabetische volgorde, samen met een korte beschrijving van de respectieve mogelijkheden.&lt;/p&gt;&lt;h3&gt;&lt;b&gt;Gratis tekstuele HTML-editors&lt;/b&gt;&lt;/h3&gt;&lt;p&gt;Denk eraan dat je voor deze editors wel de nodige ervaring met HTML of een andere codeertaal moet hebben. Deze editors bieden ondersteuning wanneer je fouten maakt, maar ze kunnen geen code voor je schrijven.&lt;/p&gt;&lt;h3&gt;&lt;a rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot;&gt;&lt;b&gt;Aptana Studio 3&lt;/b&gt;&lt;/a&gt;&lt;/h3&gt;&lt;figure class=&quot;aligncenter&quot;&gt;&lt;img title=&quot;aptana-gratis-html-editor&quot; alt=&quot;weergave van Aptana&quot; class=&quot;aligncenter&quot; fetchpriority=&quot;high&quot; src=&quot;https://images.ctfassets.net/63bmaubptoky/buW-ihjyjD7UpvWs1mRVM7JEFUcotbKA9jHFtYjWxrg/aabb2efd7d4e8e039ef7d956c30cb9f2/aptana-gratis-html-editor.png&quot; srcset=&quot;https://images.ctfassets.net/63bmaubptoky/buW-ihjyjD7UpvWs1mRVM7JEFUcotbKA9jHFtYjWxrg/aabb2efd7d4e8e039ef7d956c30cb9f2/aptana-gratis-html-editor.png?w=400 400w, https://images.ctfassets.net/63bmaubptoky/buW-ihjyjD7UpvWs1mRVM7JEFUcotbKA9jHFtYjWxrg/aabb2efd7d4e8e039ef7d956c30cb9f2/aptana-gratis-html-editor.png?w=700 700w, https://images.ctfassets.net/63bmaubptoky/buW-ihjyjD7UpvWs1mRVM7JEFUcotbKA9jHFtYjWxrg/aabb2efd7d4e8e039ef7d956c30cb9f2/aptana-gratis-html-editor.png?w=1000 1000w, https://images.ctfassets.net/63bmaubptoky/buW-ihjyjD7UpvWs1mRVM7JEFUcotbKA9jHFtYjWxrg/aabb2efd7d4e8e039ef7d956c30cb9f2/aptana-gratis-html-editor.png?w=1500 1500w, https://images.ctfassets.net/63bmaubptoky/buW-ihjyjD7UpvWs1mRVM7JEFUcotbKA9jHFtYjWxrg/aabb2efd7d4e8e039ef7d956c30cb9f2/aptana-gratis-html-editor.png?w=2200 2200w&quot; sizes=&quot;(min-resolution: 2x) 2200px, (min-width: 992px) 1000px, 95vw&quot;/&gt;&lt;figcaption&gt;Weergave van html-editor Aptana (Bron: &lt;a href=&quot;//www.aptana.com/products/studio3.htmlhttp&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt; Aptana&lt;/a&gt;)&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;Aptana Studio is een aanpasbare open source IDE. Naast HTML5 kan deze tool CSS, JavaScript, PHP, Ruby, Rails en Python bewerken. De oplossing kan worden geïntegreerd met  &lt;a href=&quot;https://git-scm.com/book/nl/v1/Aan-de-slag-Het-wat-en-waarom-van-versiebeheer&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;Git&lt;/a&gt; voor versiebeheer en kan worden geïmplementeerd met FTP-, SFTP-, FTPS- en Capistrano-protocollen. De laatste update vond plaats in maart 2017.&lt;/p&gt;&lt;p&gt;&lt;a rel=&quot;noopener noreferrer&quot; class=&quot;wp-btn-cta-large evnt&quot; data-evac=&quot;ua_click&quot; data-evca=&quot;Blog_button&quot; data-evna=&quot;engagement_article_cta&quot; target=&quot;_blank&quot;&gt;Meer informatie&lt;/a&gt;&lt;/p&gt;&lt;h3&gt;Arachnophilia&lt;/h3&gt;&lt;figure class=&quot;aligncenter&quot;&gt;&lt;img title=&quot;arachnophilia-gratis-html-editor&quot; alt=&quot;arachnophilia screenshot html editor&quot; class=&quot;aligncenter&quot; fetchpriority=&quot;high&quot; src=&quot;https://images.ctfassets.net/63bmaubptoky/x-E5zGTH2tQdFKAWspBLX8JH5F2juI55eDNhuOES_1A/edcb42035f2109d99ee2725d6d579049/arachnophilia-gratis-html-editor.png&quot; srcset=&quot;https://images.ctfassets.net/63bmaubptoky/x-E5zGTH2tQdFKAWspBLX8JH5F2juI55eDNhuOES_1A/edcb42035f2109d99ee2725d6d579049/arachnophilia-gratis-html-editor.png?w=400 400w, https://images.ctfassets.net/63bmaubptoky/x-E5zGTH2tQdFKAWspBLX8JH5F2juI55eDNhuOES_1A/edcb42035f2109d99ee2725d6d579049/arachnophilia-gratis-html-editor.png?w=700 700w, https://images.ctfassets.net/63bmaubptoky/x-E5zGTH2tQdFKAWspBLX8JH5F2juI55eDNhuOES_1A/edcb42035f2109d99ee2725d6d579049/arachnophilia-gratis-html-editor.png?w=1000 1000w, https://images.ctfassets.net/63bmaubptoky/x-E5zGTH2tQdFKAWspBLX8JH5F2juI55eDNhuOES_1A/edcb42035f2109d99ee2725d6d579049/arachnophilia-gratis-html-editor.png?w=1500 1500w, https://images.ctfassets.net/63bmaubptoky/x-E5zGTH2tQdFKAWspBLX8JH5F2juI55eDNhuOES_1A/edcb42035f2109d99ee2725d6d579049/arachnophilia-gratis-html-editor.png?w=2200 2200w&quot; sizes=&quot;(min-resolution: 2x) 2200px, (min-width: 992px) 1000px, 95vw&quot;/&gt;&lt;figcaption&gt;Screenshot van Arachnophilia 5.5 (Bron: &lt;a href=&quot;//arachnoid.com/arachnophilia/index.phphttps&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;Arachnophilia&lt;/a&gt;)&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;Arachnophilia is een open source HTML-editor geschreven in Java (omdat de maker ervan, Paul Lutus,  &lt;a href=&quot;https://arachnoid.com/boycott/&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;Microsoft-producten boycot&lt;/a&gt;). De editor ondersteunt Unicode en kan ook projecten in PHP, Perl, C++, Java en JavaScript bewerken. Bovendien heeft de editor een ingebouwde FTP-client om te helpen bij de implementatie. De laatste update vond plaats in april 2018 waarbij XHTML werd inbegrepen.&lt;/p&gt;&lt;p&gt;Meer informatie&lt;/p&gt;&lt;h3&gt;\n&lt;div data-ecommerce-product-id=&quot;3f0f9048-9ccc-4adf-a04b-a8e900d073af&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;/software/175980/bluefish&quot; class=&quot;event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;bluefish&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;Bluefish&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/h3&gt;&lt;figure class=&quot;aligncenter&quot;&gt;&lt;img title=&quot;bluefish-html-editor&quot; alt=&quot;Bluefish code tekstbewerker&quot; class=&quot;aligncenter&quot; fetchpriority=&quot;high&quot; src=&quot;https://images.ctfassets.net/63bmaubptoky/xTROegBlKHhBOuIdXpcrZConOREjwTfCNHI18N8icfk/f4fe611c45229535164fe39c61030d88/bluefish-html-editor.png&quot; srcset=&quot;https://images.ctfassets.net/63bmaubptoky/xTROegBlKHhBOuIdXpcrZConOREjwTfCNHI18N8icfk/f4fe611c45229535164fe39c61030d88/bluefish-html-editor.png?w=400 400w, https://images.ctfassets.net/63bmaubptoky/xTROegBlKHhBOuIdXpcrZConOREjwTfCNHI18N8icfk/f4fe611c45229535164fe39c61030d88/bluefish-html-editor.png?w=700 700w, https://images.ctfassets.net/63bmaubptoky/xTROegBlKHhBOuIdXpcrZConOREjwTfCNHI18N8icfk/f4fe611c45229535164fe39c61030d88/bluefish-html-editor.png?w=1000 1000w, https://images.ctfassets.net/63bmaubptoky/xTROegBlKHhBOuIdXpcrZConOREjwTfCNHI18N8icfk/f4fe611c45229535164fe39c61030d88/bluefish-html-editor.png?w=1500 1500w, https://images.ctfassets.net/63bmaubptoky/xTROegBlKHhBOuIdXpcrZConOREjwTfCNHI18N8icfk/f4fe611c45229535164fe39c61030d88/bluefish-html-editor.png?w=2200 2200w&quot; sizes=&quot;(min-resolution: 2x) 2200px, (min-width: 992px) 1000px, 95vw&quot;/&gt;&lt;figcaption&gt;Bluefish code tekstbewerker (Bron: &lt;a href=&quot;//bluefish.openoffice.nl/screenshots.htmlhttp&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;Bluefish&lt;/a&gt;)&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;Bluefish is een open source code-editor die draait onder Linux, Mac OS X, Windows, FreeBSD, OpenBSD en Solaris. De editor ondersteunt FTP-, SFTP-, HTTP-, HTTPS-, WebDAV- en CIFS-protocollen. Voor degenen die werken aan grote projecten kan Bluefish meer dan 500 documenten tegelijk geopend hebben. Wijzigingen in documenten worden automatisch hersteld als je systeem vastloopt tijdens het coderen. De tool is ook geschikt voor aardig wat andere talen, zoals C++, Google Go, Java, Perl, PHP, Python en R. De laatste update vond plaats in 2017.&lt;/p&gt;&lt;p&gt;\n&lt;div data-ecommerce-product-id=&quot;3f0f9048-9ccc-4adf-a04b-a8e900d073af&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;/software/175980/bluefish&quot; class=&quot;wp-btn-cta-large evnt event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;meer-informatie&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;Meer informatie&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/p&gt;&lt;h3&gt;\n&lt;div data-ecommerce-product-id=&quot;bcf69289-0ad1-4c42-931d-daf752bf0869&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;/software/217519/coffeecup&quot; class=&quot;event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;coffeecup&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;CoffeeCup&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/h3&gt;&lt;figure class=&quot;aligncenter&quot;&gt;&lt;img title=&quot;coffeecup-html-editors&quot; alt=&quot;CoffeeCup code tekstbewerker&quot; class=&quot;aligncenter&quot; fetchpriority=&quot;high&quot; src=&quot;https://images.ctfassets.net/63bmaubptoky/clwF1U4gpOFcWJzyM1pJCqAWB-bAhAQMHeaUwt6p4Z4/fb3346bf443d573f896e606af0b6054c/coffeecup-html-editors.png&quot; srcset=&quot;https://images.ctfassets.net/63bmaubptoky/clwF1U4gpOFcWJzyM1pJCqAWB-bAhAQMHeaUwt6p4Z4/fb3346bf443d573f896e606af0b6054c/coffeecup-html-editors.png?w=400 400w, https://images.ctfassets.net/63bmaubptoky/clwF1U4gpOFcWJzyM1pJCqAWB-bAhAQMHeaUwt6p4Z4/fb3346bf443d573f896e606af0b6054c/coffeecup-html-editors.png?w=700 700w, https://images.ctfassets.net/63bmaubptoky/clwF1U4gpOFcWJzyM1pJCqAWB-bAhAQMHeaUwt6p4Z4/fb3346bf443d573f896e606af0b6054c/coffeecup-html-editors.png?w=1000 1000w, https://images.ctfassets.net/63bmaubptoky/clwF1U4gpOFcWJzyM1pJCqAWB-bAhAQMHeaUwt6p4Z4/fb3346bf443d573f896e606af0b6054c/coffeecup-html-editors.png?w=1500 1500w, https://images.ctfassets.net/63bmaubptoky/clwF1U4gpOFcWJzyM1pJCqAWB-bAhAQMHeaUwt6p4Z4/fb3346bf443d573f896e606af0b6054c/coffeecup-html-editors.png?w=2200 2200w&quot; sizes=&quot;(min-resolution: 2x) 2200px, (min-width: 992px) 1000px, 95vw&quot;/&gt;&lt;figcaption&gt;Weergave CoffeCup html-editor (Bron: &lt;a href=&quot;//www.coffeecup.com/free-editor/https&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;CoffeCup&lt;/a&gt;)&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;CoffeeCup levert een gratis HTML-teksteditor. Maar als je behoefte hebt aan meer WYSIWYG-mogelijkheden, is er tegen betaling ook een “Visual Editor” verkrijgbaar. Je kunt met CoffeeCup zowel HTML- als CSS-bestanden maken en bestaande websitebestanden bewerken. Bovendien kun je content op pagina’s bijwerken met de Components Library.&lt;/p&gt;&lt;p&gt;\n&lt;div data-ecommerce-product-id=&quot;bcf69289-0ad1-4c42-931d-daf752bf0869&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;/software/217519/coffeecup&quot; class=&quot;wp-btn-cta-large evnt event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;meer-informatie&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;Meer informatie&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/p&gt;&lt;h3&gt;\n&lt;div data-ecommerce-product-id=&quot;6e6f7740-d8b1-4520-8bee-a6d200b42fbe&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;/software/27349/eclipse&quot; class=&quot;event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;eclipse&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;Eclipse&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/h3&gt;&lt;figure class=&quot;aligncenter&quot;&gt;&lt;img title=&quot;Eclipse-code-editor&quot; alt=&quot;Eclipse code bewerker JavaEE Tips&quot; class=&quot;aligncenter&quot; fetchpriority=&quot;high&quot; src=&quot;https://images.ctfassets.net/63bmaubptoky/COOrUJ1wbTlEm6kOclLwtBVA-z0FNcieb-KVtY_137c/0094bfc98c509a0f07f931a4d06eeef1/Eclipse-code-editor.png&quot; srcset=&quot;https://images.ctfassets.net/63bmaubptoky/COOrUJ1wbTlEm6kOclLwtBVA-z0FNcieb-KVtY_137c/0094bfc98c509a0f07f931a4d06eeef1/Eclipse-code-editor.png?w=400 400w, https://images.ctfassets.net/63bmaubptoky/COOrUJ1wbTlEm6kOclLwtBVA-z0FNcieb-KVtY_137c/0094bfc98c509a0f07f931a4d06eeef1/Eclipse-code-editor.png?w=700 700w, https://images.ctfassets.net/63bmaubptoky/COOrUJ1wbTlEm6kOclLwtBVA-z0FNcieb-KVtY_137c/0094bfc98c509a0f07f931a4d06eeef1/Eclipse-code-editor.png?w=1000 1000w, https://images.ctfassets.net/63bmaubptoky/COOrUJ1wbTlEm6kOclLwtBVA-z0FNcieb-KVtY_137c/0094bfc98c509a0f07f931a4d06eeef1/Eclipse-code-editor.png?w=1500 1500w, https://images.ctfassets.net/63bmaubptoky/COOrUJ1wbTlEm6kOclLwtBVA-z0FNcieb-KVtY_137c/0094bfc98c509a0f07f931a4d06eeef1/Eclipse-code-editor.png?w=2200 2200w&quot; sizes=&quot;(min-resolution: 2x) 2200px, (min-width: 992px) 1000px, 95vw&quot;/&gt;&lt;figcaption&gt;Eclipse code editor (bron: &lt;a href=&quot;//www.youtube.com/watch?v=HPj3j1qkRcYhttps&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;JavaEE Tips&lt;/a&gt;)&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;Eclipse biedt een reeks plug-ins, waaronder een HTML-editor, in de open source Web Developer Tools-kit. Bovendien heeft de tool plug-ins voor het bewerken van CSS, JSON en JavaScript. Op de site van de leverancier wordt gewaarschuwd dat “nieuwe gebruikers het verwarrend kunnen vinden” als ze alleen maar HTML-code willen bewerken. Dus zouden beginnelingen deze editor misschien het beste kunnen negeren, terwijl ervaren codeerders de flexibiliteit van Eclipse juist aantrekkelijk zullen vinden. De laatste update vond plaats in maart 2019.&lt;/p&gt;&lt;p&gt;\n&lt;div data-ecommerce-product-id=&quot;6e6f7740-d8b1-4520-8bee-a6d200b42fbe&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;/software/27349/eclipse&quot; class=&quot;wp-btn-cta-large evnt event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;meer-informatie&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;Meer informatie&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/p&gt;&lt;h3&gt;\n&lt;div data-ecommerce-product-id=&quot;8ec35eee-fde8-494e-9daa-a8e900d6db0b&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;/software/1000033/komodo-ide&quot; class=&quot;event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;komodo-ide&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;Komodo IDE&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/h3&gt;&lt;figure class=&quot;aligncenter&quot;&gt;&lt;img title=&quot;ActiveState-code-bewerker-1&quot; alt=&quot;KomodeID HTML Editor weergave&quot; class=&quot;aligncenter&quot; fetchpriority=&quot;high&quot; src=&quot;https://images.ctfassets.net/63bmaubptoky/WnOjMBOHLJZtgwyD231Bz4nYHalNg9QyQztmL9gIKa4/11d76f703c641777f09cdbfd3392290d/ActiveState-code-bewerker-1.png&quot; srcset=&quot;https://images.ctfassets.net/63bmaubptoky/WnOjMBOHLJZtgwyD231Bz4nYHalNg9QyQztmL9gIKa4/11d76f703c641777f09cdbfd3392290d/ActiveState-code-bewerker-1.png?w=400 400w, https://images.ctfassets.net/63bmaubptoky/WnOjMBOHLJZtgwyD231Bz4nYHalNg9QyQztmL9gIKa4/11d76f703c641777f09cdbfd3392290d/ActiveState-code-bewerker-1.png?w=700 700w, https://images.ctfassets.net/63bmaubptoky/WnOjMBOHLJZtgwyD231Bz4nYHalNg9QyQztmL9gIKa4/11d76f703c641777f09cdbfd3392290d/ActiveState-code-bewerker-1.png?w=1000 1000w, https://images.ctfassets.net/63bmaubptoky/WnOjMBOHLJZtgwyD231Bz4nYHalNg9QyQztmL9gIKa4/11d76f703c641777f09cdbfd3392290d/ActiveState-code-bewerker-1.png?w=1500 1500w, https://images.ctfassets.net/63bmaubptoky/WnOjMBOHLJZtgwyD231Bz4nYHalNg9QyQztmL9gIKa4/11d76f703c641777f09cdbfd3392290d/ActiveState-code-bewerker-1.png?w=2200 2200w&quot; sizes=&quot;(min-resolution: 2x) 2200px, (min-width: 992px) 1000px, 95vw&quot;/&gt;&lt;figcaption&gt;KomodeID weergave (Bron: &lt;a href=&quot;//docs.activestate.com/komodo/11/manual/workspace.htmlhttp&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;ActiveState&lt;/a&gt;)&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;Komodo IDE van ActiveState heeft een uitgeklede gratis versie van een uitgebreider systeem, naast licenties waarvoor betaald moet worden. Maar ook de gratis versie biedt enkele krachtige functies, zoals automatisch aanvullen en tools voor debugging. De editor is tevens geschikt voor een aantal andere talen, zoals Python, Perl en Node.js.&lt;/p&gt;&lt;p&gt;\n&lt;div data-ecommerce-product-id=&quot;8ec35eee-fde8-494e-9daa-a8e900d6db0b&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;/software/1000033/komodo-ide&quot; class=&quot;wp-btn-cta-large evnt event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;meer-informatie&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;Meer informatie&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/p&gt;&lt;h3&gt;\n&lt;div data-ecommerce-product-id=&quot;00abe478-6ba9-4bb8-a608-a6d200b52931&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;/software/101288/microsoft-visual-studio&quot; class=&quot;event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;microsoft-visual-studio-community&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;Microsoft Visual Studio Community&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/h3&gt;&lt;figure class=&quot;aligncenter&quot;&gt;&lt;img title=&quot;microsoft-html-editor&quot; alt=&quot;Microsoft code editor&quot; class=&quot;aligncenter&quot; fetchpriority=&quot;high&quot; src=&quot;https://images.ctfassets.net/63bmaubptoky/vyMvrZ2nkofwdysD6HtylQWmqgCVvuYpZLgWNh9lBAo/563810588d42a993d9ea8d1e018af208/microsoft-html-editor.png&quot; srcset=&quot;https://images.ctfassets.net/63bmaubptoky/vyMvrZ2nkofwdysD6HtylQWmqgCVvuYpZLgWNh9lBAo/563810588d42a993d9ea8d1e018af208/microsoft-html-editor.png?w=400 400w, https://images.ctfassets.net/63bmaubptoky/vyMvrZ2nkofwdysD6HtylQWmqgCVvuYpZLgWNh9lBAo/563810588d42a993d9ea8d1e018af208/microsoft-html-editor.png?w=700 700w, https://images.ctfassets.net/63bmaubptoky/vyMvrZ2nkofwdysD6HtylQWmqgCVvuYpZLgWNh9lBAo/563810588d42a993d9ea8d1e018af208/microsoft-html-editor.png?w=1000 1000w, https://images.ctfassets.net/63bmaubptoky/vyMvrZ2nkofwdysD6HtylQWmqgCVvuYpZLgWNh9lBAo/563810588d42a993d9ea8d1e018af208/microsoft-html-editor.png?w=1500 1500w, https://images.ctfassets.net/63bmaubptoky/vyMvrZ2nkofwdysD6HtylQWmqgCVvuYpZLgWNh9lBAo/563810588d42a993d9ea8d1e018af208/microsoft-html-editor.png?w=2200 2200w&quot; sizes=&quot;(min-resolution: 2x) 2200px, (min-width: 992px) 1000px, 95vw&quot;/&gt;&lt;figcaption&gt;Screenshot van Microsoft Visual Studio editor (Bron: &lt;a href=&quot;//visualstudio.microsoft.com/vs/https&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;Microsoft&lt;/a&gt;)&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;Als je Microsoft &lt;i&gt;niet&lt;/i&gt; boycot zoals Paul Lutus, de maker van Arachnophlia, zou je eens kunnen kijken naar de gratis “Community”-editie van de IDE van Microsoft Visual Studio, die ondersteuning biedt voor vijf gebruikers. Hoewel de betaalde versies geavanceerdere functies te bieden hebben, bevat de gratis versie alle essentiële tools voor HTML-editing. Bovendien zijn er enkele handige functies voor het ontwikkelen van mobiele apps, zoals het delen van code tussen Android en iOS.&lt;/p&gt;&lt;p&gt;\n&lt;div data-ecommerce-product-id=&quot;00abe478-6ba9-4bb8-a608-a6d200b52931&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;/software/101288/microsoft-visual-studio&quot; class=&quot;wp-btn-cta-large evnt event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;meer-informatie&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;Meer informatie&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/p&gt;&lt;h3&gt;\n&lt;div data-ecommerce-product-id=&quot;0c86de63-24eb-4690-b823-a94a00387657&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;/software/178681/apache-netbeans&quot; class=&quot;event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;netbeans&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;NetBeans&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/h3&gt;&lt;figure class=&quot;aligncenter&quot;&gt;&lt;img title=&quot;NteBeand-code-editor&quot; alt=&quot;Netbeans code editor&quot; class=&quot;aligncenter&quot; fetchpriority=&quot;high&quot; src=&quot;https://images.ctfassets.net/63bmaubptoky/zZ506e8M4APSw2klBWXBU4NcKeyB0HPi7f55xg43UIk/5f54849f57406edd7c7e5b1d809b8f16/NteBeand-code-editor.png&quot; srcset=&quot;https://images.ctfassets.net/63bmaubptoky/zZ506e8M4APSw2klBWXBU4NcKeyB0HPi7f55xg43UIk/5f54849f57406edd7c7e5b1d809b8f16/NteBeand-code-editor.png?w=400 400w, https://images.ctfassets.net/63bmaubptoky/zZ506e8M4APSw2klBWXBU4NcKeyB0HPi7f55xg43UIk/5f54849f57406edd7c7e5b1d809b8f16/NteBeand-code-editor.png?w=700 700w, https://images.ctfassets.net/63bmaubptoky/zZ506e8M4APSw2klBWXBU4NcKeyB0HPi7f55xg43UIk/5f54849f57406edd7c7e5b1d809b8f16/NteBeand-code-editor.png?w=1000 1000w, https://images.ctfassets.net/63bmaubptoky/zZ506e8M4APSw2klBWXBU4NcKeyB0HPi7f55xg43UIk/5f54849f57406edd7c7e5b1d809b8f16/NteBeand-code-editor.png?w=1500 1500w, https://images.ctfassets.net/63bmaubptoky/zZ506e8M4APSw2klBWXBU4NcKeyB0HPi7f55xg43UIk/5f54849f57406edd7c7e5b1d809b8f16/NteBeand-code-editor.png?w=2200 2200w&quot; sizes=&quot;(min-resolution: 2x) 2200px, (min-width: 992px) 1000px, 95vw&quot;/&gt;&lt;figcaption&gt;html-editor screenshot van NetBeans (Bron: &lt;a href=&quot;//netbeans.org/https&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;NetBeans&lt;/a&gt;)&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;NetBeans is een gratis en open source IDE waarmee je kunt coderen in HTML5, PHP, JavaScript, C++ en verschillende andere talen. De editor bevat codesjablonen en -generators, naast tools voor projectmanagement ter ondersteuning van grotere projecten en teams. Bovendien is er een grote  &lt;a href=&quot;http://plugins.netbeans.org/&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;marketplace voor plug-ins&lt;/a&gt; en worden ontwikkelaars aangemoedigd hun eigen plug-ins te schrijven en te delen. De laatste update vond plaats in april 2019.&lt;/p&gt;&lt;p&gt;\n&lt;div data-ecommerce-product-id=&quot;0c86de63-24eb-4690-b823-a94a00387657&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;/software/178681/apache-netbeans&quot; class=&quot;wp-btn-cta-large evnt event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;meer-informatie&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;Meer informatie&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/p&gt;&lt;h3&gt;\n&lt;div data-ecommerce-product-id=&quot;8a01b58a-caf5-4546-a51e-aa38004bd2c7&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;/software/185965/notepad&quot; class=&quot;event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;notepad++&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;Notepad++&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/h3&gt;&lt;figure class=&quot;aligncenter&quot;&gt;&lt;img title=&quot;notepad-gratis-HTML-editor&quot; alt=&quot;Notepad gratis HTML-editor&quot; class=&quot;aligncenter&quot; fetchpriority=&quot;high&quot; src=&quot;https://images.ctfassets.net/63bmaubptoky/m7LLIvdyTAvQTRFncw0lvZo5674dOKzVaJ01_OHCrcc/befb36ad12b76cf47a6736d540967b18/notepad-gratis-HTML-editor.png&quot; srcset=&quot;https://images.ctfassets.net/63bmaubptoky/m7LLIvdyTAvQTRFncw0lvZo5674dOKzVaJ01_OHCrcc/befb36ad12b76cf47a6736d540967b18/notepad-gratis-HTML-editor.png?w=400 400w, https://images.ctfassets.net/63bmaubptoky/m7LLIvdyTAvQTRFncw0lvZo5674dOKzVaJ01_OHCrcc/befb36ad12b76cf47a6736d540967b18/notepad-gratis-HTML-editor.png?w=700 700w, https://images.ctfassets.net/63bmaubptoky/m7LLIvdyTAvQTRFncw0lvZo5674dOKzVaJ01_OHCrcc/befb36ad12b76cf47a6736d540967b18/notepad-gratis-HTML-editor.png?w=1000 1000w, https://images.ctfassets.net/63bmaubptoky/m7LLIvdyTAvQTRFncw0lvZo5674dOKzVaJ01_OHCrcc/befb36ad12b76cf47a6736d540967b18/notepad-gratis-HTML-editor.png?w=1500 1500w, https://images.ctfassets.net/63bmaubptoky/m7LLIvdyTAvQTRFncw0lvZo5674dOKzVaJ01_OHCrcc/befb36ad12b76cf47a6736d540967b18/notepad-gratis-HTML-editor.png?w=2200 2200w&quot; sizes=&quot;(min-resolution: 2x) 2200px, (min-width: 992px) 1000px, 95vw&quot;/&gt;&lt;figcaption&gt;Notepad++ html-editor (Bron: &lt;a href=&quot;Notepad++_screenshot.png//commons.wikimedia.org/wiki/Filehttps&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;Wikimedia Commons&lt;/a&gt;)&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;Notepad++, dat overigens alleen beschikbaar is voor Windows, is een gratis source code editor geschreven in C++. De UI kan volledig worden aangepast en gebruikers kunnen zelf beslissen hoe de syntaxis wordt gemarkeerd en ingevouwen. En er is een bonus: voor de milieubewuste ontwikkelaar is het goed te weten dat Notepad++ de uitstoot van CO2 wil terugdringen door programma’s te maken die minder CPU-vermogen nodig hebben. De laatste update vond plaats in mei 2019.&lt;/p&gt;&lt;p&gt;\n&lt;div data-ecommerce-product-id=&quot;8a01b58a-caf5-4546-a51e-aa38004bd2c7&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;/software/185965/notepad&quot; class=&quot;wp-btn-cta-large evnt event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;meer-informatie&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;Meer informatie&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/p&gt;&lt;h3&gt;\n&lt;div data-ecommerce-product-id=&quot;7f61f182-4717-4c46-b9f8-a8ea00ddb20c&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;#&quot; class=&quot;event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;notetab-light&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;NoteTab Light&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/h3&gt;&lt;figure class=&quot;aligncenter&quot;&gt;&lt;img title=&quot;Notetab-light&quot; alt=&quot;Notetab code tekstbewerker&quot; class=&quot;aligncenter&quot; fetchpriority=&quot;high&quot; src=&quot;https://images.ctfassets.net/63bmaubptoky/pp4bE5CNo9Zq0IwTUDsoQFPeHRsdqDWEBSlQFeU9KvY/4bdf9e92add0421021ad0fd3f4b46068/Notetab-light.png&quot; srcset=&quot;https://images.ctfassets.net/63bmaubptoky/pp4bE5CNo9Zq0IwTUDsoQFPeHRsdqDWEBSlQFeU9KvY/4bdf9e92add0421021ad0fd3f4b46068/Notetab-light.png?w=400 400w, https://images.ctfassets.net/63bmaubptoky/pp4bE5CNo9Zq0IwTUDsoQFPeHRsdqDWEBSlQFeU9KvY/4bdf9e92add0421021ad0fd3f4b46068/Notetab-light.png?w=700 700w, https://images.ctfassets.net/63bmaubptoky/pp4bE5CNo9Zq0IwTUDsoQFPeHRsdqDWEBSlQFeU9KvY/4bdf9e92add0421021ad0fd3f4b46068/Notetab-light.png?w=1000 1000w, https://images.ctfassets.net/63bmaubptoky/pp4bE5CNo9Zq0IwTUDsoQFPeHRsdqDWEBSlQFeU9KvY/4bdf9e92add0421021ad0fd3f4b46068/Notetab-light.png?w=1500 1500w, https://images.ctfassets.net/63bmaubptoky/pp4bE5CNo9Zq0IwTUDsoQFPeHRsdqDWEBSlQFeU9KvY/4bdf9e92add0421021ad0fd3f4b46068/Notetab-light.png?w=2200 2200w&quot; sizes=&quot;(min-resolution: 2x) 2200px, (min-width: 992px) 1000px, 95vw&quot;/&gt;&lt;figcaption&gt;html-editor Notetab Light (Bron: &lt;a href=&quot;//www.notetab.com/html-editorhttp&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;NoteTab&lt;/a&gt;)&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;NoteTab laat meteen al in zijn productbeschrijving weten dat degenen die liever met een WYSIWYG-editor werken, beter niet voor dit systeem kunnen kiezen. Maar ben je op zoek naar een gratis, gespecialiseerde HTML-editor, kijk dan zeker eens naar NoteTab. De leverancier claimt dat dankzij de toegepaste minimalistische methode voor syntaxismarkering je HTML- of CSS-code gemakkelijker te lezen is dan in sommige andere editors. En met de aanpasbare sneltoetsen voor codefragmenten kun je razendsnel code van het ene project naar het andere kopiëren en plakken. Er is een “Standard”- en “Pro”-versie van NoteTab als je krachtigere functies nodig hebt.&lt;/p&gt;&lt;p&gt;\n&lt;div data-ecommerce-product-id=&quot;7f61f182-4717-4c46-b9f8-a8ea00ddb20c&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;#&quot; class=&quot;wp-btn-cta-large evnt event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;meer-informatie&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;Meer informatie&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/p&gt;&lt;h3&gt;&lt;a href=&quot;http://www.pspad.com/en/&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;&lt;b&gt;PSPad&lt;/b&gt;&lt;/a&gt;&lt;/h3&gt;&lt;figure class=&quot;aligncenter&quot;&gt;&lt;img title=&quot;PSPad&quot; alt=&quot;PsPad html-editor&quot; class=&quot;aligncenter&quot; fetchpriority=&quot;high&quot; src=&quot;https://images.ctfassets.net/63bmaubptoky/VVAGZoMEwJ_lyoDXHO4kutqOutCHt2P-OU91E4v_fJg/15f51d31c85db6d9ceea818d02076072/PSPad.png&quot; srcset=&quot;https://images.ctfassets.net/63bmaubptoky/VVAGZoMEwJ_lyoDXHO4kutqOutCHt2P-OU91E4v_fJg/15f51d31c85db6d9ceea818d02076072/PSPad.png?w=400 400w, https://images.ctfassets.net/63bmaubptoky/VVAGZoMEwJ_lyoDXHO4kutqOutCHt2P-OU91E4v_fJg/15f51d31c85db6d9ceea818d02076072/PSPad.png?w=700 700w, https://images.ctfassets.net/63bmaubptoky/VVAGZoMEwJ_lyoDXHO4kutqOutCHt2P-OU91E4v_fJg/15f51d31c85db6d9ceea818d02076072/PSPad.png?w=1000 1000w, https://images.ctfassets.net/63bmaubptoky/VVAGZoMEwJ_lyoDXHO4kutqOutCHt2P-OU91E4v_fJg/15f51d31c85db6d9ceea818d02076072/PSPad.png?w=1500 1500w, https://images.ctfassets.net/63bmaubptoky/VVAGZoMEwJ_lyoDXHO4kutqOutCHt2P-OU91E4v_fJg/15f51d31c85db6d9ceea818d02076072/PSPad.png?w=2200 2200w&quot; sizes=&quot;(min-resolution: 2x) 2200px, (min-width: 992px) 1000px, 95vw&quot;/&gt;&lt;figcaption&gt;Weergave van PSPad (Bron: &lt;a href=&quot;//www.pspad.com/en/screenshot.htmhttp&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;PSPad&lt;/a&gt;)&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;PSPad is een andere oplossing die alleen onder Windows draait. Sommige producten in onze lijst zijn niet echt bedoeld voor commercieel gebruik (en dan met name de producten met betaalde versies), maar PSPad is altijd gratis en kan kosteloos worden gebruikt door commerciële bedrijven en overheidsinstanties. Het programma biedt codesjablonen, spellingcontrole en auto-correctie. De laatste update vond plaats in februari 2019.&lt;/p&gt;&lt;h2&gt;&lt;b&gt;Gratis WYSIWYG HTML-editors&lt;/b&gt;&lt;/h2&gt;&lt;p&gt;De meeste van deze editors zijn geschikt voor beginnende codeerders en ontwerpers. Sommige ervan genereren code terwijl je webpagina-elementen sleept naar de gewenste positie op de pagina. Andere laten de code van de pagina zien, maar die kun je dan zelf naar believen bewerken. Omdat je wijzigingen op het scherm worden weergegeven, kun je je ontwerp in real-time blijven aanpassen.&lt;/p&gt;&lt;h3&gt;BlueGriffon&lt;/h3&gt;&lt;figure class=&quot;aligncenter&quot;&gt;&lt;img title=&quot;BlueGriffon-1&quot; alt=&quot;Bluegriffon weergave editor&quot; class=&quot;aligncenter&quot; fetchpriority=&quot;high&quot; src=&quot;https://images.ctfassets.net/63bmaubptoky/qi6J6E2Ai13o9yjDRbnS3iDuyfTNVCDYpho7_lle2Iw/5166827b8a2d0c4dd4473a4815df5a64/BlueGriffon-1.png&quot; srcset=&quot;https://images.ctfassets.net/63bmaubptoky/qi6J6E2Ai13o9yjDRbnS3iDuyfTNVCDYpho7_lle2Iw/5166827b8a2d0c4dd4473a4815df5a64/BlueGriffon-1.png?w=400 400w, https://images.ctfassets.net/63bmaubptoky/qi6J6E2Ai13o9yjDRbnS3iDuyfTNVCDYpho7_lle2Iw/5166827b8a2d0c4dd4473a4815df5a64/BlueGriffon-1.png?w=700 700w, https://images.ctfassets.net/63bmaubptoky/qi6J6E2Ai13o9yjDRbnS3iDuyfTNVCDYpho7_lle2Iw/5166827b8a2d0c4dd4473a4815df5a64/BlueGriffon-1.png?w=1000 1000w, https://images.ctfassets.net/63bmaubptoky/qi6J6E2Ai13o9yjDRbnS3iDuyfTNVCDYpho7_lle2Iw/5166827b8a2d0c4dd4473a4815df5a64/BlueGriffon-1.png?w=1500 1500w, https://images.ctfassets.net/63bmaubptoky/qi6J6E2Ai13o9yjDRbnS3iDuyfTNVCDYpho7_lle2Iw/5166827b8a2d0c4dd4473a4815df5a64/BlueGriffon-1.png?w=2200 2200w&quot; sizes=&quot;(min-resolution: 2x) 2200px, (min-width: 992px) 1000px, 95vw&quot;/&gt;&lt;figcaption&gt;Weergave van BlueGriffon html-editor (bron: &lt;a href=&quot;//www.bluegriffon.org///www.bluegriffon.org/#httphttp&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;Bluegriffon&lt;/a&gt;)&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;BlueGriffon heeft enkele betaalde versies van zijn product, maar de gratis versie bevat alle essentiële tools voor het ontwerpen van webpagina’s. Het is een van de drie WYSIWYG-editors in onze lijst en volgens de website van de leverancier wordt de oplossing “officieel aanbevolen door de Franse regering als de Web Authoring Tool voor de Franse overheid”. Dus als je vertrouwen hebt in de keuze van de Franse overheid wat betreft HTML-editors, is dit de juiste tool voor jou!&lt;/p&gt;&lt;p&gt;BlueGriffon biedt een dubbele weergave van enerzijds je broncode en anderzijds het WYSIWYG-ontwerp, zodat je de code kunt bijhouden en tegelijkertijd kunt controleren hoe je site eruitziet. De editor is ook geschikt voor CSS en SVG. De betaalde versie van het product heeft ontwerpgeoriënteerde functies zoals een fullscreen editor, een pipet om kleuren te kiezen en waarschuwingen bij overschrijding van de limiet van het aantal toegestane woorden.&lt;/p&gt;&lt;p&gt;Meer informatie&lt;/p&gt;&lt;h3&gt;NetObjects fusion Essentials&lt;/h3&gt;&lt;figure class=&quot;aligncenter&quot;&gt;&lt;img title=&quot;NetObjects&quot; alt=&quot;NetObjects weergave code editor&quot; class=&quot;aligncenter&quot; fetchpriority=&quot;high&quot; src=&quot;https://images.ctfassets.net/63bmaubptoky/h0gDi_3f4RJFu85QvNmJ4UT6bVIkj4pxqc8V_Amkruo/74f8f9c81a6a4d8285520d690c3a2557/NetObjects.jpg&quot; srcset=&quot;https://images.ctfassets.net/63bmaubptoky/h0gDi_3f4RJFu85QvNmJ4UT6bVIkj4pxqc8V_Amkruo/74f8f9c81a6a4d8285520d690c3a2557/NetObjects.jpg?w=400 400w, https://images.ctfassets.net/63bmaubptoky/h0gDi_3f4RJFu85QvNmJ4UT6bVIkj4pxqc8V_Amkruo/74f8f9c81a6a4d8285520d690c3a2557/NetObjects.jpg?w=700 700w, https://images.ctfassets.net/63bmaubptoky/h0gDi_3f4RJFu85QvNmJ4UT6bVIkj4pxqc8V_Amkruo/74f8f9c81a6a4d8285520d690c3a2557/NetObjects.jpg?w=1000 1000w, https://images.ctfassets.net/63bmaubptoky/h0gDi_3f4RJFu85QvNmJ4UT6bVIkj4pxqc8V_Amkruo/74f8f9c81a6a4d8285520d690c3a2557/NetObjects.jpg?w=1500 1500w, https://images.ctfassets.net/63bmaubptoky/h0gDi_3f4RJFu85QvNmJ4UT6bVIkj4pxqc8V_Amkruo/74f8f9c81a6a4d8285520d690c3a2557/NetObjects.jpg?w=2200 2200w&quot; sizes=&quot;(min-resolution: 2x) 2200px, (min-width: 992px) 1000px, 95vw&quot;/&gt;&lt;figcaption&gt;NetObjects WYSWYG HTML-editor (bron: &lt;a href=&quot;//essentials.netobjects.com/http&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;NetObjects&lt;/a&gt;)&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;NetObjects Fusion omschrijft zichzelf als een “HTML-generator in plaats van een HTML-editor.” Met de drag-and-drop-functionaliteit van het product kun je goed ontworpen webpagina’s maken precies zoals je gebruikers die te zien krijgen. Met de gratis versie kun je HTML5-websites met fotogalerijen, formulieren en eCommerce-functionaliteit bouwen.&lt;/p&gt;&lt;p&gt;Meer informatie&lt;/p&gt;&lt;h3&gt;\n&lt;div data-ecommerce-product-id=&quot;a817e8cd-21de-4348-b487-a8ea00df166a&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;/software/176013/seamonkey-suite&quot; class=&quot;event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;seamonkey&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;SeaMonkey&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/h3&gt;&lt;figure class=&quot;aligncenter&quot;&gt;&lt;img title=&quot;SeaMonkey&quot; alt=&quot;Seamonkey code tekstbewerker&quot; class=&quot;aligncenter&quot; fetchpriority=&quot;high&quot; src=&quot;https://images.ctfassets.net/63bmaubptoky/nxGjN76GualRdBRpiN1tcKy5K23yNp6LQmvxacn-HKw/0bc9f86c30cc4ef0630537a6c2049d68/SeaMonkey.png&quot; srcset=&quot;https://images.ctfassets.net/63bmaubptoky/nxGjN76GualRdBRpiN1tcKy5K23yNp6LQmvxacn-HKw/0bc9f86c30cc4ef0630537a6c2049d68/SeaMonkey.png?w=400 400w, https://images.ctfassets.net/63bmaubptoky/nxGjN76GualRdBRpiN1tcKy5K23yNp6LQmvxacn-HKw/0bc9f86c30cc4ef0630537a6c2049d68/SeaMonkey.png?w=700 700w, https://images.ctfassets.net/63bmaubptoky/nxGjN76GualRdBRpiN1tcKy5K23yNp6LQmvxacn-HKw/0bc9f86c30cc4ef0630537a6c2049d68/SeaMonkey.png?w=1000 1000w, https://images.ctfassets.net/63bmaubptoky/nxGjN76GualRdBRpiN1tcKy5K23yNp6LQmvxacn-HKw/0bc9f86c30cc4ef0630537a6c2049d68/SeaMonkey.png?w=1500 1500w, https://images.ctfassets.net/63bmaubptoky/nxGjN76GualRdBRpiN1tcKy5K23yNp6LQmvxacn-HKw/0bc9f86c30cc4ef0630537a6c2049d68/SeaMonkey.png?w=2200 2200w&quot; sizes=&quot;(min-resolution: 2x) 2200px, (min-width: 992px) 1000px, 95vw&quot;/&gt;&lt;figcaption&gt;SeaMonkey WYSWYG editor (bron: &lt;a href=&quot;//www.seamonkey-project.org/doc/img-screen/win7/browser.pnghttps&quot; rel=&quot;noopener noreferrer nofollow&quot; target=&quot;_blank&quot;&gt;Seamonkey&lt;/a&gt;)&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;SeaMonkey is een open source “alles-in-één internetapplicatie” met een browser, e-mail, chat en tools voor webontwikkeling, waaronder een HTML-editor. Dus als je alleen maar een HTML-editor wilt, kun je beter op zoek gaan naar een ander systeem in onze lijst. Maar voor ontwikkelaars die een compleet pakket willen, kan SeaMonkey wel eens de moeite van het proberen waard zijn. Het project wordt mogelijk gemaakt door Mozilla en gebruikt daarom veel van dezelfde broncode als Firefox en Thunderbird. De laatste update vond plaats in juli 2018.&lt;/p&gt;&lt;p&gt;\n&lt;div data-ecommerce-product-id=&quot;a817e8cd-21de-4348-b487-a8ea00df166a&quot; data-ecommerce-list=&quot;Blog related products&quot; class=&quot;d-inline&quot;&gt;\n  &lt;a href=&quot;/software/176013/seamonkey-suite&quot; class=&quot;wp-btn-cta-large evnt event&quot; rel=&quot;noopener noreferrer&quot; target=&quot;_blank&quot; data-new-tab=&quot;Wordt op een nieuw tabblad geopend&quot; data-evcmp=&quot;product-card&quot; data-evct=&quot;meer-informatie&quot; data-evdst=&quot;go-to_product-details&quot; data-evna=&quot;engagement_product_click&quot;&gt;&lt;span&gt;Meer informatie&lt;/span&gt;&lt;/a&gt;\n&lt;/div&gt;&lt;/p&gt;&lt;h2&gt;&lt;b&gt;Dus coderen maar!&lt;/b&gt;&lt;/h2&gt;&lt;p&gt;Als je op zoek bent naar een HTML-editor, heb je hier hopelijk aardig wat ideeën opgedaan. Duik er eens in en test een paar tools om te zien welk programma het beste voor jou is. En laat ons hieronder weten hoe het je is bevallen!&lt;/p&gt;&lt;div class=&quot;box-idea&quot;&gt;Wil je meer weten over HTML-editors? Bekijk dan &lt;a href=&quot;/directory/30935/website-builder/software&quot; rel=&quot;noopener noreferrer&quot; class=&quot;evnt&quot; data-evac=&quot;ua_click&quot; data-evca=&quot;Blog_idea&quot; data-evna=&quot;engagement_blog_product_category_click&quot; target=&quot;_blank&quot;&gt;onze lijst met webdesign-software&lt;/a&gt;.&lt;/div&gt;","dateModified":"2022-11-15T20:42:34.000000Z","datePublished":"2019-06-19T07:08:52.000000Z","inLanguage":"nl-NL","mainEntityOfPage":"https://www.capterra.nl/blog/733/de-14-beste-gratis-html-editors#webpage"}]}
</script>
