Nu je weet wat tags en containers zijn kunnen we van start gaan met het bouwen van je site. Elk HTML-document heeft altijd de volgende code nodig:
<HTML>
<HEAD>
<TITLE>Hier komt de titel van je pagina</TITLE>
</HEAD>
<BODY>
Hier komt de tekst van je pagina
</BODY>
</HTML>
Deze code zullen we stap voor stap bespreken, van buiten naar binnen:
<HTML> en </HTML>:
Deze tag vertelt je browser (= het programma waarmee je op internet surft) dat het om een pagina gaat die in HTML geschreven wordt. Er bestaan nog enkele oudere (bvb. SGML) en nieuwere (bvb. XML) talen waarmee op het web gewerkt wordt, dus je browser moet weten met welke jij werkt.
<HEAD> en </HEAD>:
Tussen deze twee tags komt alle informatie die de bezoeker van je site niet in zijn browservenster te zien krijgt. Dit zijn bvb. de beschrijving van je site (zodat zoekmachines die gemakkelijker kunnen indexeren), de maker van de site, de titel van de site en andere. Op al deze tags gaan we later in.
<TITLE> en </TITLE>:
Deze tags moeten tussen de <HEAD> en </HEAD> tags staan. Tussen de TITLE-tags staat de titel van je site. Deze wordt gebruikt door de zoekmachines, en is dus heel belangrijk, maar deze titel komt ook helemaal bovenaan in de titelbalk van je browser-programma te staan. Tussen mijn TITLE-tags staat er bvb. HTML Emergency. Als ik met Internet Explorer mijn site bekijk staat er dan bovenaan in de titelbalk: HTML Emergency – Microsoft Internet Explorer.
<BODY> en </BODY>:
Deze tag is zo ongeveer de belangrijkste tag van alle tags. Tussen deze twee tags komt het ‘lichaam’ van je document, dus alles wat de bezoeker op zijn scherm te zien krijgt. Het gaat hier eigenlijk om een container, maar zoals ik al zei kan je de parameters ook weglaten, zoals bij alle containers het geval is. Dan gebruikt de browser gewoon zijn stanaardinstellingen. De BODY-tag kan eventueel de volgende parameters bevatten:
TEXT=”#000000������������� Definieert de kleur van de tekst. De code #000000 is een hexadecimale code om de kleur aan te duiden. De code die past bij een kleur kan je vinden via een kleurenkaart en bestaat altijd uit een hekje (#) en zes cijfers en letters.
LINK=”#4466DD” Definieert de kleur van de links
ALINK=”#AABBFF” Definieert de kleur van de actieve links, m.a.w. de link waarop je klikt
VLINK=”#00BBAA” Definieert de kleur van de bezochte links, m.a.w. de links die je al bezocht hebt
BGCOLOR=”#FFFFFF” Definieert de achtergrondkleur
BACKGROUND=”achtergrond.gif” Definieert de achtergrondafbeelding. Wanneer je een achtergrondafbeelding hebt wordt die als het ware op de achtergrondkleur gelegd; dus wanneer de achtergrondafbeelding nog niet is ingeladen wordt de achtergrondkleur getoond. Je kiest dus best een achtergrondkleur waarbij de tekst al leesbaar is (dus geen zwarte tekst met een zwarte achtergrondkleur)
Het is niet omdat je in je BODY-tag zegt dat je tekst bvb. blauw moet zijn, dat daarom alle tekst in de document alleen maar blauw kan zijn. Deze parameters zeggen gewoon dat als je tekst niet opmaakt, ze standaard bvb. blauw gekleurd zal zijn. Je kan stukken tekst met speciale tags een andere kleur geven, daar gaan we later op in. Onthoud ook dat je in de eindtag geen parameters mag zetten, de eindtag blijft dus altijd </BODY>.
Nu we de basis van je pagina’s hebben kunnen we je site beginnen bouwen.
TIP 1: De hoofdpagina van je site geef je altijd de naam index.html. Wanneer je bezoeker dan je site bezoekt, moet hij het als adres bvb. alleen maar http://www.mijnsite.be intypen. De browser opent dan automatisch de pagina index.html. Wanneer je je hoofdpagina een andere naam geeft wordt het adres moeilijker om te onthouden, bvb. http://www.mijnsite.be/start.html.
TIP 2: Maak voor je volledige site één ‘sjabloon’ voor alle pagina’s met de tags die we hierboven geleerd hebben. Dan hoef je niet opnieuw alles in te typen. Je kan in dat sjabloon eventueel al de parameters van de BODY-tag instellen.
