Site index
Portals
Artikelen
Software
Links
ContactDe basis
1 bericht
• Pagina 1 van 1
De basis
door RedRose » 20 Sep 2008 19:54
Inleiding
Internet bestaat uit vele pagina's. De meeste van deze pagina's zijn geschreven in de taal HTML (HyperText Markup Language). Als je internetpagina's wilt leren maken, zul je je moeten verdiepen in HTML.
Tags
Een HTML-document is opgebouwd door middel van tags. Een tag is als volgt opgebouwd:
HTML
Je hebt ook tags zonder inhoud, die kun je als volgt noteren:
HTML
Het begin
Laten we nu eens een blik werpen op een simpele HTML-pagina, met een klein beetje inhoud.
HTML
Sla bovenstaande code op in een document dat je de naam pagina.html geeft. Het mag ook een andere naam zijn, maar geef het de extensie .html.
Wat betekent nu deze vage teksten? Laten we het bestand eens tag voor tag bekijken. We beginnen (en sluiten) het document met<html> en </html> . Door deze tags weet de browser dat het een HTML-document is. Dan zien we dat het stuk tussen de <html> -tags grofweg uit twee delen bestaat:
In het<head> -gedeelte zien we de tag <title> : hierin kun je de titel van de pagina weergeven, zoals die wordt weergegeven in de titelbalk van het browservenster.
In het<body> -gedeelte zien we de tag <p> . De letter p staat voor paragraaf, en in deze tag kun je tekst plaatsen die moet worden weergegeven.
Nu kunnen we heel makkelijk een titel bovenaan de pagina zetten, door de<h1> -tag te gebruiken. De h in deze tag staat voor heading, en je hebt er zes verschillende van, <h1> tot en met <h6> .
HTML
Attributen
Natuurlijk willen we de mensen die op onze site komen, laten weten dat ze ook naar een andere pagina in de site kunnen browsen: dit kun je doen door middel van hyperlinks.
In het volgende voorbeeld gaan we er van uit dat je twee pagina's hebt, die in dezelfde directory staan. Eentje heet pagina1.html, en de andere heet pagina2.html. Er hoeft niet veel in te staan, maar zorg wel dat het duidelijk is welke pagina je nu eigenlijk bekijkt. Stel nu dat we vanuit pagina1.html willen linken naar pagina2.html. Dat doen we op de volgende manier:
HTML
We zien de<a> -tag hier staan. Deze tag zorgt ervoor, dat de browser weet dat als er wordt geklikt op de inhoud van deze tag, pagina2.html wordt geladen. Binnen de <a> -tag zien we ook een zogenaamd attribuut, in dit geval href. Een attribuut wordt op de volgende manier in een tag opgenomen:
HTML
Nesting
In HTML is het belangrijk om de child-tag (dat is de binnenste tag) te sluiten voordat je zijn parent (dat is letterlijk de ouder-tag, dus de tag waar de child-tag in is opgenomen) sluit.
Het volgende is dus goed:
HTML
Terwijl dit fout is:
HTML
Hoe nu verder?
Natuurlijk is dit nog niet alles wat er over HTML te vertellen valt. Er zijn nog veel meer tags, bijvoobeeld om lijsten of plaatjes weer te geven. Kijk bijvooorbeeld eens op handleidinghtml.nl. Op deze site kun je informatie over alle tags vinden.
Ook zijn er nog veel andere technieken en talen, die wat betreft structuur op HTML lijken; bijvoorbeeld XML en VML. Ook heb je misschien wel eens iets gehoord over XHTML. Dit is een verbeterde en opgeschoonde versie van HTML en de regels voor het gebruik zijn iets strenger. Toch zou ik je willen aanraden om na het leren van de HTML-tags je te verdiepen in XHTML.
Een belangrijke site om door te nemen is de site van het W3C (http://www.w3c.org). Het W3C is een soort van toezichthouder op het gebruik van HTML, en zij bedenken ook de nieuwe standaarden zoals XHTML.
Als laatste wil ik je veel plezier wensen met het maken van webpagina's.
Internet bestaat uit vele pagina's. De meeste van deze pagina's zijn geschreven in de taal HTML (HyperText Markup Language). Als je internetpagina's wilt leren maken, zul je je moeten verdiepen in HTML.
Tags
Een HTML-document is opgebouwd door middel van tags. Een tag is als volgt opgebouwd:
HTML
- Code: Alles selecteren
<tagnaam>taginhoud</tagnaam>
Je hebt ook tags zonder inhoud, die kun je als volgt noteren:
HTML
- Code: Alles selecteren
<tagnaam>
Het begin
Laten we nu eens een blik werpen op een simpele HTML-pagina, met een klein beetje inhoud.
HTML
- Code: Alles selecteren
<html>
<head>
<title>Titel van de pagina</title>
</head>
<body>
<p>Inhoud van de pagina</p>
</body>
</html>
Sla bovenstaande code op in een document dat je de naam pagina.html geeft. Het mag ook een andere naam zijn, maar geef het de extensie .html.
Wat betekent nu deze vage teksten? Laten we het bestand eens tag voor tag bekijken. We beginnen (en sluiten) het document met
head : hierin komt informatie die bestemd is voor de browser, en dus niet moet worden weergegeven.body : in dit stukje moet je de inhoud van het document opgeven.
In het
In het
Nu kunnen we heel makkelijk een titel bovenaan de pagina zetten, door de
HTML
- Code: Alles selecteren
<body>
<h1>Titel</h1>
<p>Inhoud van de pagina</p>
</body>
Attributen
Natuurlijk willen we de mensen die op onze site komen, laten weten dat ze ook naar een andere pagina in de site kunnen browsen: dit kun je doen door middel van hyperlinks.
In het volgende voorbeeld gaan we er van uit dat je twee pagina's hebt, die in dezelfde directory staan. Eentje heet pagina1.html, en de andere heet pagina2.html. Er hoeft niet veel in te staan, maar zorg wel dat het duidelijk is welke pagina je nu eigenlijk bekijkt. Stel nu dat we vanuit pagina1.html willen linken naar pagina2.html. Dat doen we op de volgende manier:
HTML
- Code: Alles selecteren
<body>
<h1>Hyperlink</h1>
<p>Ga naar <a href="pagina2.html">pagina 2</a></p>
</body>
We zien de
HTML
- Code: Alles selecteren
<tagnaam attribuutnaam="attribuutwaarde">taginhoud</tagnaam>
Nesting
In HTML is het belangrijk om de child-tag (dat is de binnenste tag) te sluiten voordat je zijn parent (dat is letterlijk de ouder-tag, dus de tag waar de child-tag in is opgenomen) sluit.
Het volgende is dus goed:
HTML
- Code: Alles selecteren
<p><a href="pagina.html">pagina</a></p>
Terwijl dit fout is:
HTML
- Code: Alles selecteren
<p><a href="gina.html">pagina</p></a>
Hoe nu verder?
Natuurlijk is dit nog niet alles wat er over HTML te vertellen valt. Er zijn nog veel meer tags, bijvoobeeld om lijsten of plaatjes weer te geven. Kijk bijvooorbeeld eens op handleidinghtml.nl. Op deze site kun je informatie over alle tags vinden.
Ook zijn er nog veel andere technieken en talen, die wat betreft structuur op HTML lijken; bijvoorbeeld XML en VML. Ook heb je misschien wel eens iets gehoord over XHTML. Dit is een verbeterde en opgeschoonde versie van HTML en de regels voor het gebruik zijn iets strenger. Toch zou ik je willen aanraden om na het leren van de HTML-tags je te verdiepen in XHTML.
Een belangrijke site om door te nemen is de site van het W3C (http://www.w3c.org). Het W3C is een soort van toezichthouder op het gebruik van HTML, en zij bedenken ook de nieuwe standaarden zoals XHTML.
Als laatste wil ik je veel plezier wensen met het maken van webpagina's.
- RedRose
- Globale moderator
- Berichten: 1994
- Geregistreerd: 14 Jun 2005 18:12
1 bericht
• Pagina 1 van 1
Wie is er online?
Gebruikers in dit forum: Geen geregistreerde gebruikers en 1 gast