Geneste weergave | Lineaire weergave

**GF-Koen**

HTML handleiding

Deze handleiding is voor de mensen die willen beginnen met het maken van een HTML website.

De inhoud van deze handleiding bestaat uit:
- Wat is HTML?
- Opbouw HTML bestand
- CSS/opmaak

Wat is HTML?
HTML is de taal waarmee je documenten schrijft en maakt, en later kunnen worden bekenen op het internet.

Het woord HTML betekent HyperText Markup Language.

Hypertext is de techniek waarmee een verbinding (een link) wordt gelegd naar bijvoorbeeld een ander document, een afbeelding, of een geluidsopname.

Markup is het gebruik van code om de browser, een programma waarmee HTML-documenten bekeken kunnen worden, te vertellen hoe de inhoud van het document weergegeven moet worden en naar welke bestemming de hyperlinks moeten leiden.

Opbouw HTML bestand
Een HTML-document bestaat uit twee delen: de head en de body.

De head wordt gedefinieerd met het HEAD element en bevat informatie, die betrekking heeft op het document, maar niet in het documentvenster wordt weergegeven. De informatie kan bijvoorbeeld instructies aan de browser bevatten over hoe het document verwerkt of weergegeven moet worden.

In de head van elk document moet in ieder geval het TITLE element worden opgenomen. Hiermee wordt een titel vastgelegd, welke in de meeste browsers te zien is in de titelbalk van het venster.

Een uitgebreide beschrijving van de in de head op te nemen informatie is te vinden in het onderdeel Structuur document.

De body wordt gedefinieerd met het BODY element en bevat de feitelijk inhoud van het document.

Het HTML element markeert het begin en einde van een HTML-document en geeft aan dat het document HTML-code bevat.

Met de genoemde elementen heeft het HTML-document de volgende opbouw:

Code:

<html>

<head>

<title>Dit is mijn eerste homepage</title>

</head>

<body>

</body>

</html>

Binnen het BODY element kun je ondermeer koppen, paragrafen, horizontale lijnen, afbeeldingen en hyperlinks opnemen.

Bijvoorbeeld:

Code:

<html>

<head>

<title>Dit is mijn eerste homepage</title>

</head>

<body>

<h1>Welkom op mijn website</h1>

<p>Hier kan je veel informatie vinden.<br/>

<img src="gezicht.gif" width="105" height="125" alt="Gezicht"><br/>

<a href="http://website.nl">Linknaam</a></p>

</body>

</html>

Zoals je ziet, heb ik de elementen <h1> , <p> , <a> , <br /> en <img> gebruikt in de BODY tag gebruikt.

Uitleg elementen:
<h1> = een Kopje (word vaak gebruikt voor een titel of eerste zin van een website)
<p> = een Paragraaf (tekst tussen de <p> tags is een paragraaf)
<br /> = Regel overslaan
<a> = Een hyperlink. (De url moet worden ingevoerd bij href="" en de clickable tekst moet tussen de <a>tekst</a> tags in)
<img> = Plaatje inladen (meer informatie onder het kopje Images)

Natuurlijk zijn er veel meer HTML elementen, maar dan blijft het niet meer bij een beginners handleiding.
Voor het vinden van deze tags kan je natuurlijk altijd google gebruiken. Big Grin

Images
Als je een afbeelding wilt opnemen, maak je gebruik van het IMG element. Aan het IMG element voeg je minimaal de attributen SRC en ALT toe. Het SRC attribuut bepaalt welke afbeelding moet worden geladen. Met het ALT attribuut geef je als alternatief een omschrijving op, voor als de browser geen afbeeldingen weergeeft. Het is verstandig ook altijd de attributen WIDTH en HEIGHT te gebruiken om de afmetingen van de afbeelding vast te leggen. Een uitgebreide beschrijving is te vinden in het onderdeel Afbeeldingen en image maps.

CSS/opmaak

Voor de opmaak van HTML-bestand word CSS gebruikt.
CSS betekent Cascade Style Sheet.

In deze handleiding word er NIET uitgelegd hoe je CSS moet toepassen in je HTML bestand, maar daar komt nog een topic over.

***GF-Jasper*** · 18 September 2009, 11:31 AM

Mooie post! Smile

Geen fouten.

***GF-Patdenb*** · 18 September 2009, 11:32 AM

Goeie post vriend Wink

Over CSS zouden we eigenlijk ook een mooie post moeten plaatsen!

**GF-Koen** · 18 September 2009, 11:46 AM

Ja, doen we nog een x Smile

!

***GF-Patdenb***

Heel belangrijk is dat je strikt aan de "regels" van HTML houdt. Het voordeel hiervan is dat je website in alle webbrowsers goed wordt weergegeven.

Belangrijke Webbrowsers zijn:

FireFox
Internet Explorer8
Internet Explorer7
Internet Explorer6
Google Chrome
Opera

Ik kan me voorstellen dat je denkt met IE6 hoef ik toch geen rekening meer mee te houden? Als het aan mij legt niet nee. Maar wij merken dat toch veel websites nog bekeken worden via IE6.

Tip: "Gebruik IE Tester voor weergave IE5.5, IE6, IE7 en IE 8"
Het is echt niet nodig nog rekening met IE5.5 te houden. Dit is ook vrijwel een onmogelijke opgave.

Uiteraard als je ergens niet uitkomt kan je dit op het Google-Forum vragen.

***GF-Jasper*** · 13 November 2009, 09:56 AM

(13 November 2009 09:49 AM)GF-Patdenb schreef: Dit is ook vrijwel een onmogelijke opgave.

... omdat Internet Explorer 5.5 nu zo'n 15 jaar oud is en hierdoor nagenoeg geen ondersteuning heeft voor CSS, oftewel Cascading Stylesheets, oftewel een opmaakdocument.

***GF-Patdenb*** · 13 November 2009, 09:56 AM

Oftewel een mooie site erin krijgen? Tongue

haha onmogelijk dus! Thanx Jasper voor de aanvulling.