HTML

HTML | Webdesign KennisbankHTML staat voor Hyper Text Markup Language en is de standaardtaal die wordt gebruikt om websites te maken op het internet. Het is een essentieel onderdeel van het internet en fungeert als de basisstructuur voor o.a. de inhoud (content).

Deze code stelt ontwikkelaars in staat om tekst, afbeeldingen, links, video’s en meer op een gestructureerde manier in een webbrowser te vertonen. Het beschrijft de hiërarchie van opmaak-tags en elementen op een pagina en hoe deze met elkaar in verband staan.

Webbrowsers, zoals Google Chrome, Mozilla Firefox en Microsoft Edge interpreteren HTML-codes om webpagina’s correct weer te geven. Het is daarom een onmisbare taak, voordat je een website aflevert, deze door de diverse webbrowsers met elkaar te vergelijken.

Tevens wordt HTML gecombineerd met andere website onderdelen, zoals CSS (Cascading Style Sheets). Dit is een extra document in de website, bedoeld om de opmaak te veréénvoudigen.

Bezoek ook: CSS | Webbrowsers

Als voorbeeld deze HTML pagina:

  <!DOCTYPE html>
  <html>                        <head>
              <title>Mijn Eerste Webpagina</title>
  </head>
      <body>
        <h1>Dit is een kop</h1>
<p>
Dit is een paragraaf met <a href=“https://www.voorbeeld.com”>Voorbeeld</a>.</p> 
       

<ul>
                <li>Item 1</li>
                <li>Item 2</li>
                <li>Item 3</li>
       </ul>
     </body>
</html>

De elementen in deze broncode

  • <!DOCTYPE html> geeft aan dat de pagina gebruik maakt van HTML5.
  • <html> is het begin van de HTML-structuur.
  • <head> bevat metagegevens over de pagina, zoals de titel van de pagina die in de browser wordt weergegeven.
  • <title> definieert de titel van de webpagina.
  • <body> bevat de zichtbare inhoud van de pagina.
  • <h1> definieert een hoofdkop.
  • <p> definieert een paragraaf.
  • <a> definieert een hyperlink.
  • <ul> staat voor een ongeordende lijst.
  • <li> definieert lijstitems.

Waar wordt HTML voor gebruikt? | Webdesign KennisbankWaar wordt HTML voor gebruikt?

Paginastructuur: HTML wordt gebruikt om de structuur van een webpagina te definiëren. Dit omvat het maken van koppen, paragrafen, lijsten, tabellen, enzovoort, waardoor de inhoud van de pagina logisch kan worden georganiseerd.

Tekstinhoud: HTML wordt gebruikt om tekst op webpagina’s weer te geven en te formatteren. Je kunt tekst opmaken met behulp van tags zoals <p> voor alinea’s, <h1> tot <h6> voor koppen van verschillende niveaus, <em> en <strong> voor tekstbenadrukking, enzovoort!

Afbeeldingen en mutimedia: HTML stelt je in staat afbeeldingen, audio- en videobestanden in webpagina’s in te sluiten en weer te geven door middel van tags zoals <img>, <audio> en <video>.

Hyperlinks: Met HTML kun je hyperlinks maken naar andere webpagina’s of bronnen, zowel intern als extern, met behulp van de <a> tag.

Formulieren: HTML-formulieren worden gebruikt om interactieve elementen zoals tekstvakken, selectievakjes, radio-knoppen, knoppen en meer op webpagina’s weer te geven. Dit is cruciaal voor het verzamelen van gegevens van gebruikers.

Inhoudsopgave en lijsten: HTML maakt het mogelijk om gestructureerde lijsten te maken, zoals geordende lijsten (<ol>), ongeordende lijsten (<ul>) en definitielijsten (<dl>).

Semantische markup: HTML biedt semantische tags zoals <header>, <nav>, <article>, <footer>, enz., die de betekenis en structuur van de inhoud definiëren. Dit is belangrijk voor zoekmachine-optimalisatie en toegankelijkheid.

Metadata: Met HTML is ook het middel om metadata aan een webpagina toe voegen, zoals de paginatitel, beschrijving en trefwoorden, met behulp van tags zoals <title> en <meta>.


Versie HTML5

HTML5, oftewel HyperText Markup Language 5, is de nieuwste versie van de standaardtaal, voor het structureren en presenteren van websites. Verder heeft HTML5 bijgedragen aan een verbeterde internetervaring, door het leveren van nieuwe mogelijkheden.

Bezoek ook: Webbrowsers


Speciale code om ruimte te creëren

In HTML staat de code: &nbsp; voor “non-breaking space” (niet-afbreekbare spatie). Het is een speciaal soort spatiekarakter dat ervoor zorgt dat de webbrowser geen witruimte afbreekt op die specifieke locatie.

In tegenstelling tot gewone spaties, zal een niet-afbreekbare spatie voorkomen dat de tekst aan weerszijden ervan wordt gescheiden door een nieuwe regel of wordt afgebroken aan het einde van een regel.

Dit kan handig zijn in situaties waarin je wilt voorkomen dat tekstfragmenten worden gescheiden of afgebroken op een ongewenste manier, zoals bijvoorbeeld in initialen of tussen woorden die bij elkaar moeten blijven.


Veel keuze in diverse tags

Elke markering in de HTML-opmaaktaal wordt in het Engels een tag genoemd. De afgelopen jaren, is dan ook het aantal verschillende HTML-tags die te gebruiken zijn enorm uitgebreid. Om te voorkomen dat hierdoor interpretatie problemen ontstaan, heeft het World Wide Web Consortium (W3C) haar aanbevelingen opgesteld.

Dat betekend dat op deze officiële website exact staat vermeld, welke tags er geldig zijn en hoe ze geïnterpreteerd moeten worden.

World Wide Web Consortium (W3C) | https://w3.org


Elementen en AttributenElementen en Attributen | Webdesign Kennisbank

De broncode van een website in HTML bestaat uit elementen en attributen, die zijn bedoeld om de elementen te omschrijven (specificeren). Daarom moet er in veel gevallen bij een attribuut, ook een waarde worden opgegeven.

Elementen bestaan meestal uit tweetallen: een deel dat het element activeert en een deel dat de activering weer beëindigt. Zowel de activering (ook wel start-tag genoemd), als de beëindiging (eind-tag) beginnen met < en eindigen met >


HTML-TabellenTekst | Webdesign Kennisbank

Een HTML-tabel is een opmaakstructuur die wordt gebruikt om gegevens in een overzichtelijke indeling te presenteren op een webpagina. Een tabel bestaat uit een reeks rijen en kolommen met cellen, waarin de gegevens worden weergegeven.

Een tabel wordt gedefinieerd met behulp van HTML-code en kan worden opgemaakt met behulp van CSS-stijlen om de weergave van de tabel te veranderen. Een HTML-tabel bestaat uit verschillende elementen, waaronder de table, tr, th en td elementen…


HTML-KleurcodesHTML-Kleurcodes | Webdesign Kennisbank

Met HTML-Kleurcodes is het mogelijk, zelf allerlei verschillende kleuren toe te passen. Want het internet zou toch te saai zijn, als er voor tekst en allerlei andere elementen in een ontwerp, geen enkele kleur uitgekozen kon worden!

De gekozen kleuren op een website kunnen bezoekers aantrekken of afstoten. Door gebruik te maken van een goede kleuren combinatie, vergroot je de juiste indruk die een website maakt op haar bezoekers…


HyperlinksHyperlinks | Webdesign Kennisbank

Hyperlinks (of kortweg links) worden in het Nederlands: verbindingen of (snel)koppelingen genoemd. Het is een computer- en internetterm dat duidt op een verwijzing (referentie) in de hypertekst (broncode).

Deze kan de gebruiker dan volgen, om naar een ander webadres te surfen. Een hyperlink is vaak een stukje tekst, maar kan ook een afbeelding of enig ander HTML-element zijn. Veel hypertekst, is te verdelen in onafhankelijk onderhouden “hyper-documenten”…


HTML-EditorsHTML-Editors | Webdesign Kennisbank

Het werken met HTML-Editors maakte mij zo enthousiast, dat ik snel van start ging met een Webdesign Cursus. Daarbij maakte ik o.a. handig gebruik van de HTML-Kit, om de basisbegrippen van HTML-codes te leren.

Omdat HTML voor het bouwen van websites, één van de meest gebruikte opmaaktalen is, kan ik je adviseren hier wat meer kennis over op te doen. Bovendien is het niet moeilijk en kan iedereen het in korte tijd leren…


Websites over HTML
HTML School | https://htmlschool.nl Handleiding HTML | https://handleidinghtml.nl
Wikibooks | https://nl.wikibooks.org/wiki/html
W3schools | https://w3schools.com/html
Programmeerplaats | https://programmeerplaats.nl Code Center | https://codecenter.nl/pr/tutorial/html