Definitielijsten -dl-, -dt- en -dd-

uit de cursus Basiskennis HTML5 (2019)

Leuk dat je onze site bezoekt,

Ben jij leergierig?. Jij abonnee en dan ik geef jou 5% korting op de eerste maand! Wat vind je daar van? gebruik als kortingscode: DIEHARD

Geef een reactie of stel een vraag

Geef een reactie

Registreer als je wilt reageren.

Deze website gebruikt Akismet om spam te verminderen. Bekijk hoe je reactie-gegevens worden verwerkt.

Basiskennis HTML5 (2019)

perm_identity Belinda | video_library 55 video's | query_builder 3:02:53

In de cursus basiskennis HTML5 leer je hoe je webpagina’s structureert met de juiste HTML-tags. Om webpagina’s correct te kunnen voorvertonen door browsers is het essentieel dat je de juiste HTML-tags verbindt aan de content. In webdesign is namelijk de content gescheiden met de opmaak. Zoekmachines gebruiken de HTML-structurering om betekenis en waarde aan de content te verbinden. Maak je niet gebruik van de juiste structurering dan zul je dit terugzien in de zoekresultaten. Slecht gestructureerde webpagina’s worden minder goed geïndexeerd

Wat kun je hierna?

Een logische vervolgcursus is de cursus Basiskennis CSS. Hierin leer je de vormgeving van webpagina’s onder de knie te krijgen met CSS. Dit is de werkwijze voor het creëren van prachtige webpagina’s. Eerst zorgen dat de HTML op orde is en vervolgens de vormgeving bepalen met CSS.

Belangrijke onderwerpen in deze online basiscursus zijn:

  • Leren maken van de juiste mappenstructuur voor webproducties voor elke dag
  • Semantische beteknis van HTML-tags
  • Pagina’s structureren met HTML-tags conform het W3C
  • Inzicht in de reglementen van het W3C
  • Tabellen toepassen

De laatste lijst is de definitielijst.

De definitielijst heeft net even wat meer mogelijkheden.

Zowel in de html als voor de vormgeving met css dan de ordered en de unordered list.

Ook zijn er meerdere toepassingen voor de definitielijsten toegestaan.

Ik ga eerst de meest eenvoudige en duidelijke vorm behandelen

En in de volgende video leg ik uit welke mogelijkheden je nog meer hebt met de definitielijst.

Origineel was de definitielijst bedoeld om een lijst met definities te plaatsen.

Achter elke definitie plaatste je dan de bijbehorende verklaring.

Beetje zoals een woordenboek.

Het eerste wat je doet is het aangeven waar de lijst begint en eindigt.

En dat doe je met het html-element -dl-. Wat staat voor definition list.

Hier begint mijn definitielijst en hier eindigt hij dus daar plaats ik de eindtag.

Daarna ga je structureren wat zijn de termen en wat zijn de bijbehorende verklaringen.

In dit voorbeeld is 'literatuur' de term en dat geef je aan met het html-element -dt- .

Wat staat voor definition term.

De verklaring, die na de term volgt, geef je aan met het html-element -dd-.

Wat staat voor definition declaration.

Ik spring even vooruit en ik laat het hele eindresultaat zien.

Zo, bewaar het document en bekijk de voorvertoning.

Kijk ook weer welke css-stijlen de browser Chrome gebruikt voor het weergeven van een definitielijst.

Dit is de meest eenvoudige en duidelijke toepassing van een definitielijst.

Maar het volgende is ook toegestaan.

In dit voorbeeld noem ik drie schrijvers.

En van deze schrijvers staan de titels van een aantal boeken die ze hebben geschreven.

De auteurs worden dan de termen van de definitielijst, de -dt's- end e boeken plaats je dan als -dd-.

Ik start weer met het maken van een definitielijst.

Deze sluit ik aan het einde af.

Alle auteurs worden dan een definition term.

En elk boek dat ze hebben geschreven wordt dan een definition decalaration.

En dat doe ik dan vervolgens voor deze hele definitielijst.

Voor een definitielijst moet er wel een duidelijk verband zijn tussen de term en de verklaringen.

En die is er in dit geval want de termen betreft de schrijvers...

en de verklaringen de boeken die deze schrijvers hebben geschreven.

En in dit geval mogen het dan ook meerdere verklaringen zijn.

Want ze hebben ook daadwerkelijk deze boeken geschreven.

Zodra je klaar bent bewaar je het document en bekijk je het resultaat.