Om HTML-code te leren lezen maken we een eenvoudige site door HTML-code te tikken met Teksteditor. Verander in Teksteditor in de voorkeuren > platte tekst, regelterugloop aan, extensie txt uit. Openen en bewaren > negeer rtf commando's in HTML AAN. Je kunt het letterttype platte tekst in de voorkeuren wat groter zetten. En in het menu bij Opmaak "Pas aan vensterbreedte aan"

Tik een koptekst: Hallo, wij zijn Team nummer X.

Tik een hele alinea, of plak een alinea in met faketekst. Tik een hele alinea, of plak een alinea in met faketekst. Tik een hele alinea, of plak een alinea in met faketekst. Tik een hele alinea, of plak een alinea in met faketekst.

Kopieer de alinea een paar keer

Probeer de
uit, dat is een zachte return. Wat is het verschil tussen een harde en een zachte return? Ofwel element P en element BR?

Maak ook een woordje cursief met de code EM (emphasis), en vet met de code STRONG.
Tekst MOET je structuren in HTML.
Tekst mag je NIET visueel opmaken: dat doe je met CSS (stylesheets).
Dit zijn de twee allerbelangrijkste regels bij modern webdesign.

Bewaar als teamx.html op de server (x is je teamnummer).
Dubbelklik om te openen in Safari. Werk verder in Teksteditor en reload telkens in Safari met Apple-R.
Nu gaan we links maken met het anchor A-element en zijn href-attribuut (hyperlink reference). Tusen haken tik je a href="team1". Daarna tik je de tekst die moet linken en je sluit af.

Maak er een lijstje van

Zet er UL (unordered list) voor en LI voor elk List Item. Sluit af.

Maak er een OL=ordered list van.

Zet er een div omheen met als attribuut een stukje in line css (css-code binnen html-code): div style="width:70%; margin: auto; color:red; background-color:yellow; padding:10px; font: 1em/1.6 Georgia".

Normaliter zet je deze css niet in de HTML, maar in een extern bestand en roep je het aan in de onzichtbare HEAD. Waarom?

Maak er nu in Dreamweaver mooie typografie en mooie kleuren van, plak er een plaatje in, laat een plaatje linken, gebruik borders, maak het stylesheet extern, style de links, etc.

Op deze manier worden alle HTML-sites tegenwoordig gemaakt: gestructureerde HTML (dus de tekst is ingedeeld met de juiste heading-levels, lijstjes etc) met een extern stylesheet voor de visuele vormgeving.