Websites maken voor beginners: HTML

Websites maken voor beginners: HTML Vrijwel alle websites zijn grotendeels in HTML geschreven. Maar wat is HTML precies en hoe kun je er een website mee maken? In dit artikel zal de basis van HTML worden uitgelegd en kun je zelf een simpele website maken. Er is totaal geen voorkennis vereist en je hoeft ook geen speciale programma's te gebruiken om een website te kunnen maken met HTML.

Website maken


Wat is HTML?

HTML staat voor Hyper Text Markup Language. Het is geen programmeertaal, maar een zogenaamde opmaaktaal. HTML bestaat uit platte tekst waarin met markeringstekens is aangegeven hoe de tekst moet worden geïnterpreteerd, bijvoorbeeld of een woord/zin dik gedrukt of schuin moet worden weergegeven. Zo'n markering heet een tag en is te herkennen aan het feit dat tags altijd tussen deze twee tekentjes staan: <tag> (het woord "tag" kan van alles zijn, en bepaald wat voor tag het is).

Hoe maak je een HTML bestand?

Zoals eerder al is vermeld, zijn er geen speciale progamma's nodig om een HTML bestand te maken. Een veel gebruikt programma voor het schrijven van HTML is simpelweg Kladblok (of Notepad in het Engels), dit staat in Windows onder accesoires. Open Kladblok om te beginnen met het schrijven van je eerste HTML bestand.

Je eerste webpagina

Als je Kladblok hebt geopend kun je de volgende regels intypen:

<html>
<body>

<i>Mijn eerste webpagina</i>
<br/>
<b>Mijn eerste webpagina</b>

</body>
</html>

Dit geeft het volgende resultaat:

Mijn eerste webpagina

Mijn eerste webpagina


Het opslaan van de webpagina

Door deze tekst (de tekst uit het bovenste blok) in Kladblok te typen, en vervolgens op te slaan als naam.html (je kunt de naam natuurlijk zelf kiezen) heb je je eerste webpagina gemaakt. Je kunt dit doen door te gaan naar: "bestand" - "opslaan als..." en daar bij het bestandstype "alle bestanden" te kiezen. Je kunt het bestand dan opslaan als naam.html. Als je dit niet doet zal Kladblok namelijk automatisch een tekstbestand maken, en heet je bestand naam.html.txt.

Het openen van de webpagina

Als je dit bestandje vervolgens opend met een webbrowser (het programma waarmee je op internet gaat, voor de meeste mensen is dit Internet Explorer) zie je de webpagina zoals is weergegeven in het onderste blok. Je kunt dit doen door met de rechter muisknop op het bestand te klikken, naar "Openen met..." te gaan en "Internet Explorer" (of een andere browser) te kiezen.

De structuur van HTML

Een HTML bestand bestaat uit allemaal tags. Er zijn twee typen tags; een begin- en een eindtag. Een tag staat altijd tussen een "<" en een ">" , en heeft een bepaalde naam: <naam> is dus een tag. Bovendien is <naam> een begintag. Bij elke begintag hoort ook een eindtag, deze ziet er als volgt uit: </naam>. De "/" geeft aan dat het een eindtag is.

Een tag zegt iets over de tekst die tussen de begin- en de eindtag staat. Een voorbeeld is de <b> tag. Deze wordt gebruikt om tekst dikgedrukt te maken:

Deze tekst is <b>dikgedrukt</b>

Ziet eruit als:

Deze tekst is dikgedrukt

Alleen het woord "dikgedrukt" wordt dikgedrukt weergegeven, omdat deze tussen de <b> en de </b> tags staat.

Opbouw van een webpagina

Laten we nog eens naar het eerste voorbeeld kijken.

<html>
<body>

<i>Mijn eerste webpagina</i>
<br/>
<b>Mijn eerste webpagina</b>

</body>
</html>

Er zijn hier verschillende tags te zien (de woorden die tussen een "<" en een ">" staan):

De <html> tag

Als eerste is er een <html> tag, deze geeft het begin aan van de webpagina. De </html> tag geeft het eind aan van de webpagina en hoort altijd onderaan het HTML bestand.

De <body> tag

De <body> tag geeft het begin aan van het zichtbare gedeelte van de website, deze wordt afgesloten met een </body> tag. Eigenlijk hoort bijna alles tussen de <body> tags. Er bestaat namelijk ook een <head> tag, waar je bijvoorbeeld de titel van je webpagina kunt neerzetten, maar hier gaan we verder niet op in.

De <i> tag

Alles wat tussen een <i> en een </i> tag staat wordt schuingedrukt weergegeven. Je kunt verschillende tags ook combineren:
Deze tekst is <i>schuin</i>
<br/>
<b>Deze tekst is dikgedrukt</b>
<br/>
<b>Deze dikgedrukte tekst is <i>schuin</i></b>

Deze tekst is schuin

Deze tekst is dikgedrukt

Deze dikgedrukte tekst is schuin

De <br/> tag

Tot slot is er nog de <br/> tag. Dit is een losse tag, zonder begin of eind. Een <br/> tag zorgt dat de eropvolgdende tekst op de volgende regel terecht komt. De volgende HTML code:

1
2
3

komt eruit te zien als:

123

maar deze code:

1
<br/>
2
<br/>
3

komt eruit te zien als:

1
2
3

Goed worden in HTML

Als het goed is begrijp je nu ongeveer de basis van HTML. Als je je in de toekomst meer wilt verdiepen in HTML dan is het aan te raden om simpelweg veel te experimenteren. HTML is een taal die in principe vrij makkelijk te leren is, maar het duurt even voordat men gevoel krijgt voor de logica ervan.

Zodra je eenmaal bekend bent met de structuur en logica van HTML, ben je al enorm op weg. Het is dan alleen nog een kwestie van nieuwe tags leren kennen, en voor je het weet heb je een proffessionele website gemaakt.
© 2010 - 2024 Machans, het auteursrecht van dit artikel ligt bij de infoteur. Zonder toestemming is vermenigvuldiging verboden. Per 2021 gaat InfoNu verder als archief, artikelen worden nog maar beperkt geactualiseerd.
Gerelateerde artikelen
HTML de basisbeginselenVoor het maken van een website heb je enige kennis van HTML nodig. HTML is de basis van een website. In dit artikel lees…
Gratis HTML script of toch betalenGratis HTML script of toch betalenAls je een website wil maken kun je HTML script kopen, zelf maken of gratis downloaden. Lees hier alles over de voor en…
Wat is HTML of Hypertext Markup Language? (De basis)Wat is HTML of Hypertext Markup Language? (De basis)Een browser, zoals Google Chrome, Mozilla Firefox of Internet Explorer, heeft gegevens nodig om een website weer te geve…
Een website maken met HTML en FTPEen website maken met HTML en FTPEen website bouwen is moelijk, je hebt FTP software nodig en je moet html kennis hebben. Vaak blijven domeinen gewoon le…
Draaitabel maken en autofilter instellen in ExcelHet instellen van een autofilter of het maken van een draaitabel is een lastige aangelegenheid. In dit artikel wordt in…
Zo kun je Hotmail in Outlook instellenZo kun je Hotmail in Outlook instellenSteeds meer mensen kiezen ervoor om de mails van hun Hotmail account niet meer via de website van Hotmail te bekijken, m…
Bronnen en referenties
  • http://www.w3schools.com/html/html_intro.asp
Machans (31 artikelen)
Gepubliceerd: 22-03-2010
Rubriek: Pc en Internet
Subrubriek: Tutorials
Bronnen en referenties: 1
Per 2021 gaat InfoNu verder als archief. Het grote aanbod van artikelen blijft beschikbaar maar er worden geen nieuwe artikelen meer gepubliceerd en nog maar beperkt geactualiseerd, daardoor kunnen artikelen op bepaalde punten verouderd zijn. Reacties plaatsen bij artikelen is niet meer mogelijk.