HTML editors gebruiken

Over een ding zijn de meeste website bouwers het wel eens. Als je een goede website wilt bouwen moet je aan de slag met de code en niet met WYSIWYG (Wat je ziet, is wat je krijgt) software. Je kunt natuurlijk een pakket als Dreamweaver van Adobe aanschaffen, maar er zijn veel meer goede opties om je website met de hand te bouwen. In dit artikel een aantal mogelijkheden en voorbeelden van html-editors en de redenen om hiervoor te kiezen.

Browsers gebruiken HTML

Als je het internet over surft dan gebruik je een web browser zoals Firefox, Chrome of Internet Explorer. Hiermee haal je HTML bestanden binnen die door een browser worden omgezet naar visueel aantrekkelijke webpagina’s. Op zijn eenvoudigst gezegd, HTML is een platte markup taal dat tekstuele inhoud, pagina structuur en instructies bevat waarmee je browser uit de voeten kan hoe de webpagina moet worden getoond.

What You See Is What You Get (WYSIWYG)- editors

Je hoeft niets van HTML code te kennen en je kunt toch websites maken. Er zijn veel WYSIWYG programma’s, online en offline, op de markt waarmee je stap voor stap, met knippen en plakken, een website in elkaar kunt zetten. Zo heeft Apple bijvoorbeeld het programma iWeb, wat een groot aantal sjablonen bevat waarmee je een eenvoudige website kunt maken.

iWeb

De problemen beginnen pas als er meer toepassingen moeten worden toegevoegd aan de eenvoudige website, zoals formulieren, reactievelden of banners. Daarvoor kun je gemakkelijk de code even induiken.

HTML is gemakkelijk te leren

HTML is echter niet moeilijk te leren en als je de tijd neemt om er even in te duiken dan ben je veel beter voorbereid om een eenvoudige en goede website te maken.

Je kunt HTML schrijven in een eenvoudig programma dat op iedere Windows computer te vinden is: Kladblok, of voor iedere Apple gebruiker: ‘Teksteditor’. Ik raad je echter aan om een iets uitgebreidere editor te gaan gebruiken, specifiek gericht op de taak van het schrijven van code.

kladblok op Windows

Controle over het bouwen

Met een HTML-editor heb je namelijk meer controle over het zelf schrijven van de code. Dit komt omdat er een aantal zaken geautomatiseerd wordt. Een HTML editor zet de tags in kleur neer, verschillende tags in verschillende kleuren. De regels worden genummerd en je kunt tags op eenvoudige manieren in een keer invoegen. Je hoeft dus niet elke letter te schrijven.

Verschillende editors

Notepad2 is een gratis editor met syntax highlighting voor meerdere programmeertalen en markuptalen, waaronder HTML.
Notepad++ is een vergelijkbare editor die erg populair is vanwege de vele mogelijkheden.

Notepad++

HTML-kit is een al wat oudere editor, maar nog zeer volwaardig voor zijn taak. Deze editor is niet alleen geschikt voor HTML, maar ook voor vele andere talen. Daarnaast heeft deze editor een scala aan plugins.

HTML-kit

Voor Mac OSX gebruikers is er bijvoorbeeld Textwrangler van Barebones. Een zeer complete editor met een ingebouwde FTP functie. Iets wat HTML-kit trouwens ook heeft.

Voordelen van een editor

Het mooie van een editor is dat er een aantal functies is geautomatiseerd. Zo kun je bij het opstarten alvast een basisversie tevoorschijn laten komen met de belangrijkste codes op een rij.

Vaak is het mogelijk om met een druk op de knop verschillende onderdelen, zoals links of afbeeldingen in te voegen.

Preview functie

Bij afbeeldingen gaat het dan om de specifieke tag hiervoor, en niet de afbeelding zelf. Dat is direct het punt van een editor. Je moet eerst de code invoeren en vervolgens moet je gaan controleren of dit het resultaat is wat je wilde bereiken. De meeste browsers hebben een preview functie hiervoor.

Je kunt natuurlijk ook je browser hiervoor gebruiken.

Het allerbelangrijkste bij het maken van een HTML document is dat je het document ook als zodanig opslaat. En ja, dat gaat vaker mis dan je denkt. Sla een bestand dus op als ‘naam.htm’.

Nog een laatste tips als je een bestand opslaat, gebruik dan geen spaties in de naam. dat kan wel eens verkeerd aflopen, en dan is je website ineens onzichtbaar.

Wil je HTML leren, en kunnen werken met een editor, dan is het aan te raden de Cursus HTML te volgen. Je leert dan alles over HTML en CSS. Je leest er meer over op de cursuspagina.

Ik geloof je heus wel!

Je zit echt niet te wachten op weer een saaie nieuwsbrief...
Met allerlei oninteressante informatie.
Maar echt, als je mijn mails probeert, dan beloof ik je te helpen met de zoektocht naar jouw perfecte niche! Zodat jij een website kunt maken rond jouw favoriete onderwerp of idee!
En je krijgt meteen toegang tot mijn gratis downloads. Proberen? Meld je hieronder aan!

9 reacties

  1. Daan schreef:

    "De meeste browsers hebben een preview functie hiervoor."
    "Je kunt natuurlijk ook je browser hiervoor gebruiken."

    Juist 🙂

  2. Timon schreef:

    Ik gebruik zelf Notepad++, prima programma.

  3. DNA schreef:

    Ik zweer bij dreamweaver. Is de meest complete editor die ik ken.

    En wysiwyg is soms wel degelijk handig. Ik heb bijvoorbeeld echt geen zin om zelf een hele tabel uit te typen.
    En dan nadenken over cols en rows. Met 1 klik heb ik dit gelijk gedaan.

  4. Waldio schreef:

    Aptana en InType vind ik de handigste.

    Aptana, omdat het veel attributen in het systeem en goede plug-ins heeft.
    InType, omdat het heel makkelijke aan te passen bundles heeft. Als ik typ table en ik druk op TAB dan komt er een basis tabel te staan, en met tab kan tussen elke cel switchen.
    En daarnaast is het snel.

  5. Anywhy schreef:

    Notepad++ is top, gebruik het vanaf het begin al. Werkt super 😀

  6. Jan schreef:

    Ik gebruik Zend Studio omdat dit een heel fijn programma is voor verschillende talen. Vooral voor PHP (goede autocomplete, foutenopsporing, debugging, alles zit er in) werkt hij erg goed.

    Als webontwerper zou ik eerder voor Dreamweaver gaan omdat Dreamweaver betere tools heeft voor CSS en HTML. Als je echt gaat coderen, zou ik toch echt verder gaan kijken.

  7. Maurits schreef:

    Html-kit, echt de allerbeste!!

  8. Bas2 schreef:

    Notepad/Notepad++ voldoen ruim aan de eisen voor het maken van websites.

    Zelf gebruik ik Eclipse (met PHP extensie) in een Linux omgeving. Autocompletion is handig, meer high-tech functies hoef ik niet en wil ik ook niet hebben.

    Dreamweaver… tja, echt vreselijk. Je wijzigt iets in Dreamweaver en de hele structuur van je website wordt fijn overhoop gegooid. Tevens werkt het niet op Linux, dus dat is ook nog een reden voor mij om het niet te gebruiken (afgezien van de prijs).

    Kortom, wil je echt leren websites bouwen, gebruik gewoon Notepad (o.i.d.) om je creatie te verwezenlijken.

  1. 4 juli 2011

    […] Goede HTML editors die ook gebruikt kunnen worden voor CSS en nog veel meer programmeertalen zijn te vinden op de pagina ‘HTML editors gebruiken’. […]

Geef een reactie

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