Terug

Overzicht van HTML-codes en HOE je die gebruikt.

De globale opzet + VOLGORDE van de HTML-codes - voor ELKE website is als volgt:

<HTML> betekent "begin van de website"
<HEAD> betekent "begin van de head" (head = het bovenste deel)
<TITLE> mijn eerste of de allermooiste website [ de titel van het hele verhaal ]
</TITLE> betekent "afsluiting van de titel"
</HEAD> betekent "afsluiting van de head"
<BODY> betekent "begin van je verhaal dat de browser je laat zien"
<P> betekent "begin van een alinea"
hier staan een heleboel: plaatjes, tekst, tables, marquee's etc.
</P> betekent "einde van de alinea"
<P> en zo gaat het verder tot het eind, etc. etc. .... </P>
</BODY> betekent "einde van het verhaal dat de browser je laat zien"
</HTML> betekent "einde van de website"

Hulpmiddelen: de belangrijkste HTML-codes zijn:

  1. Lettergrootte - <FONT SIZE="3"> Hier staan letters met hoogte 3</FONT>
  2. Kleur van letters - <FONT COLOR="#FF0000"> Hier staan rode letters </FONT>
  3. Lettertypes - <FONT FACE="Arial"> Hier staat lettertype Arial</FONT>
    [ N.B. Wil je dit allemaal tegelijkertijd, gebruik dan toch een keer het woord "font";
    Voorbeeld: <FONT COLOR="#FF0000", SIZE="3", FACE="Arial"> ]
  4. <B> - zorgt voor vetgedrukte tekst
  5. <I> - zorgt voor cursieve tekst
  6. <U> - zorgt voor onderstreepte tekst
  7. <BR> - zorgt voor een "break"; alles na de break komt op volgende regel
  8. <HR> - zorgt voor een horizontale lijn (afscheiding)
  9. <UL> - zorgt voor het begin van een opsomming zoals tabs in Word
  10. <OL> - zorgt voor het zelfde, maar nu genummerd vanaf 1, 2, 3, etc.
  11. <TABLE> - zorgt voor een verdeling van de website in "cellen" (altijd gebruiken !)
  12. Achtergrond = Picture - <BODY BACKGROUND="rouge.jpg"> Zorgt voor rode achtergrond o.b.v. een plaatje
  13. Achtergrond kleur - <BODY BGCOLOR="#FFFF00"> Zorgt voor gele achtergrond
  14. <IMG SRC="foto23.jpg"> Zorgt voor een foto of plaatje in JPG-formaat
  15. <IMG SRC="foto44.bmp"> Zorgt voor een foto of plaatje in BMP-formaat
  16. <IMG SRC="foto11.gif"> Zorgt voor een foto of plaatje in GIF-formaat
  17. <A HREF="Website2.htm"> Hiermee spring je naar Website nr. 2 </A>
  18. <A HREF="http://www.tmf.nl"> Hiermee ga je naar TMF op internet</A>
  19. <MARQUEE> Deze tekst beweegt </MARQUEE>
  20. Overal dezelfde letters - <BODY FACE="Arial" SIZE=3 TEXT="#0000FF">
  21. <PRE> - zorgt ervoor dat alles dat hierna volgt wordt weergegeven zoals het er echt uit ziet. Je Internet Browser laat dus deze tekst (of tabel) helemaal met rust.
  22. <IMG SRC="foto74.bmp" width="100" height="100"> Geeft plaatje "foto74" weer in formaat 100 x 100
  23. <BGSOUND SRC="fluitje.wav"> Geeft het geluid op je site weer van bestand "fluitje" [ N.B. Dit MOET je in de HEAD van je site zetten ! ] Zie verder de diverse HTML handleidingen b.v. deze

Begin- en Eindcodes + attributen

Veel HTML-codes geven een BEGIN- en een EIND situatie aan. Indien bijvoorbeeld ergens in de tekst het lettertype moet veranderen, dan is dat ook het einde van het lettertype, dat daarvoor stond. Vandaar dat altijd na b.v. <FONT> ook weer </FONT> volgt !!!
Er zijn ook HTML-codes die GEEN eindcode nodig hebben: bijvoorbeeld de HR, de BR en de codes voor plaatjes (IMG SRC= ...).
Er zijn tenslotte ook HTML-codes waarbij extra informatie vermeld mag of moet worden (attributen). Zo kun je bij MARQUEE opgeven direction=left, right, up of down; achter BODY mag je opgeven de achtergrondkleur van de hele website; achter FONT kun je opgeven het letter-type, -kleur en -grootte; achter de codes voor plaatjes mag je opgeven de grootte, de rand, de plek waar het plaatje moet komen, etc..; bij UL en OL moet je zelfs extra codes opgeven, namelijk de code LI voor alles wat je opsomt; bij TABLE geldt dat ook: je moet minimaal opgeven TR (record of regel) en TD (de cellen per regel).

Powerpoint-achtige sprongen bereik je door het volgende in de HEAD te zetten
 van b.v. je tweede website: <META HTTP-EQUIV="Refresh" CONTENT="5;URL=Website6.htm"> Dit alles zorgt er voor dat je tweede website (die b.v. website2.htm heet) slechts 5 seconden te zien is. Daarna gaat hij automatisch over naar website6.htm (in mijn voorbeeld). Doe je hetzelfde in website6.htm door daarin op te nemen iets als: <META HTTP-EQUIV="Refresh" CONTENT="9;URL=Website2.htm"> dan gaat het springen door. Na website6.htm volgt website2.htm (na 9 seconden in dit voorbeeld).

Terug