Een simpele webpagina maken met HTML

Pdf downloaden
Pdf downloaden

Je kunt een webpagina maken zonder enige kennis van HTML, maar je zult hoe dan ook tegen problemen oplopen en dan weet je niet hoe je ze moet oplossen. Er bestaan veel websites waar je kunt leren programmeren in HTML, maar door het lezen van dit artikel leer je alvast wat basisbegrippen van HTML. Na deze introductie zal het niet lang meer duren voordat je zelf je eigen website kunt bouwen!

Methode 1
Methode 1 van 1:

Het gebruik van HTML

Pdf downloaden
  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/8\/81\/Create-a-Simple-Web-Page-With-HTML-Step-1-Version-6.jpg\/v4-460px-Create-a-Simple-Web-Page-With-HTML-Step-1-Version-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/8\/81\/Create-a-Simple-Web-Page-With-HTML-Step-1-Version-6.jpg\/v4-728px-Create-a-Simple-Web-Page-With-HTML-Step-1-Version-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    HTML is een programmeertaal waarmee je webpagina's kunt maken. Om te zien hoe HTML er uit ziet kies je in de browser voor "Bekijk Bron" of woorden van die strekking. Nu verschijnt er een pagina met HTML-code. Je browser leest deze code en zet het om in het uiterlijk van een webpagina zoals je dat gewend bent.
    • In Internet Explorer kies je onder "Weergave" voor "Bron". In Mozilla Firefox druk je op [Ctrl]+U om de broncode te kunnen zien. In Safari kies je onder "Weergave" voor "Toon bronversie".
  2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/5\/59\/Create-a-Simple-Web-Page-With-HTML-Step-2-Version-6.jpg\/v4-460px-Create-a-Simple-Web-Page-With-HTML-Step-2-Version-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/5\/59\/Create-a-Simple-Web-Page-With-HTML-Step-2-Version-6.jpg\/v4-728px-Create-a-Simple-Web-Page-With-HTML-Step-2-Version-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Als je dat niet doet word je al snel overweldigd door de HTML-taal en de bijbehorende scripttalen.
    • Ten eerste moet je weten dat je alle informatie schrijft tussen een 'tag' waarmee je de HTML opent en een 'tag' waarmee je de HTML sluit. De eerste tag ziet er als volgt uit: <___>. De sluitende tag ziet er zo uit: </___>. Het '___'-gedeelte wordt vervangen door code, het gaat om de haken en de schuine streep.
  3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/3\/3e\/Create-a-Simple-Web-Page-With-HTML-Step-3-Version-6.jpg\/v4-460px-Create-a-Simple-Web-Page-With-HTML-Step-3-Version-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/3\/3e\/Create-a-Simple-Web-Page-With-HTML-Step-3-Version-6.jpg\/v4-728px-Create-a-Simple-Web-Page-With-HTML-Step-3-Version-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Op Windows: Start --> Programma's --> Bureau-accessoires --> Notepad. Op een Mac: Programma's --> Textedit.
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/a\/a6\/Create-a-Simple-Web-Page-With-HTML-Step-4-Version-6.jpg\/v4-460px-Create-a-Simple-Web-Page-With-HTML-Step-4-Version-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/a\/a6\/Create-a-Simple-Web-Page-With-HTML-Step-4-Version-6.jpg\/v4-728px-Create-a-Simple-Web-Page-With-HTML-Step-4-Version-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    . Typ <html>. Deze tag vertelt de computer dat je een webpagina begint. Je sluit het pas helemaal aan het eind van de code, daarvoor typ je </html>.
  5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/4\/4a\/Create-a-Simple-Web-Page-With-HTML-Step-5-Version-6.jpg\/v4-460px-Create-a-Simple-Web-Page-With-HTML-Step-5-Version-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/4\/4a\/Create-a-Simple-Web-Page-With-HTML-Step-5-Version-6.jpg\/v4-728px-Create-a-Simple-Web-Page-With-HTML-Step-5-Version-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
  6. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/3\/35\/Create-a-Simple-Web-Page-With-HTML-Step-6-Version-6.jpg\/v4-460px-Create-a-Simple-Web-Page-With-HTML-Step-6-Version-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/3\/35\/Create-a-Simple-Web-Page-With-HTML-Step-6-Version-6.jpg\/v4-728px-Create-a-Simple-Web-Page-With-HTML-Step-6-Version-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    . Een titel is belangrijk want het laat de gebruikers zien waar de pagina over gaat. Je ziet de titel van elke pagina bovenin de browser staan. In html geef je als volgt de titel aan: <title>de-titel-van-de-pagina</title>.
  7. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/d\/dc\/Create-a-Simple-Web-Page-With-HTML-Step-7-Version-6.jpg\/v4-460px-Create-a-Simple-Web-Page-With-HTML-Step-7-Version-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/d\/dc\/Create-a-Simple-Web-Page-With-HTML-Step-7-Version-6.jpg\/v4-728px-Create-a-Simple-Web-Page-With-HTML-Step-7-Version-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Het merendeel van de code die de pagina vormt staat tussen de tags <body> en </body>.
    • Door een style toe te voegen aan de body kun je de webpagina bijvoorbeeld een achtergrondkleur geven. Schrijf bijvoorbeeld: <body style="background-color:silver"> of vervang 'silver' door een hex code. De woorden tussen de aanhalingstekens noemen we "attributen".
  8. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/5\/5a\/Create-a-Simple-Web-Page-With-HTML-Step-8-Version-6.jpg\/v4-460px-Create-a-Simple-Web-Page-With-HTML-Step-8-Version-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/5\/5a\/Create-a-Simple-Web-Page-With-HTML-Step-8-Version-6.jpg\/v4-728px-Create-a-Simple-Web-Page-With-HTML-Step-8-Version-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    • Als je de tekst op de volgende regel wilt hebben (alsof je op "enter" drukt) gebruik je de tag
      voor de tekst. De br-tag hoeft niet afgesloten te worden.
    • Als je een "marquee" wilt toevoegen, oftewel een woord dat over het scherm beweegt, typ dan <marquee>tekst</marquee>.
  9. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/e\/ed\/Create-a-Simple-Web-Page-With-HTML-Step-9-Version-6.jpg\/v4-460px-Create-a-Simple-Web-Page-With-HTML-Step-9-Version-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/e\/ed\/Create-a-Simple-Web-Page-With-HTML-Step-9-Version-6.jpg\/v4-728px-Create-a-Simple-Web-Page-With-HTML-Step-9-Version-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Als je een plaatje van internet wilt toevoegen aan je pagina gebruik je de volgende HTML-code: <img src="URL">. De img-tag hoeft niet afgesloten te worden.
  10. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/9\/9c\/Create-a-Simple-Web-Page-With-HTML-Step-10-Version-6.jpg\/v4-460px-Create-a-Simple-Web-Page-With-HTML-Step-10-Version-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/9\/9c\/Create-a-Simple-Web-Page-With-HTML-Step-10-Version-6.jpg\/v4-728px-Create-a-Simple-Web-Page-With-HTML-Step-10-Version-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    De webpagina zou er ongeveer zo uit moeten zien:




    <title>Mijn webpagina</title>
    <body bgcolor="yellow">
    Ik vind WikiHow geweldig want
    <marquee>het is de beste website ter wereld!</marquee>
    <img src=" http://www.wikihow.com/skins/common/images/wikiHow_logo_5.gif "></body>



  11. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/3\/3c\/Create-a-Simple-Web-Page-With-HTML-Step-11-Version-6.jpg\/v4-460px-Create-a-Simple-Web-Page-With-HTML-Step-11-Version-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/3\/3c\/Create-a-Simple-Web-Page-With-HTML-Step-11-Version-6.jpg\/v4-728px-Create-a-Simple-Web-Page-With-HTML-Step-11-Version-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Ga naar "bewaar als" en geef een bestandsnaam op met de extensie .html (bijvoorbeeld mijnwebpagina.html). Dubbelklik op je webpagina en als het goed is zie je het resultaat in een browser.
    Advertentie

Tips

  • Je kunt een goede indruk maken op vrienden als je laat zien hoe snel je een simpele webpagina kunt maken.
  • In plaats van een teksteditor kun je ook Adobe Dreamweaver gebruiken. Het is ingewikkelder in het gebruik, maar je hebt wel veel meer mogelijkheden.
  • je kunt een sluitende tag niet op een willekeurige plek plaatsen. De laatste openingstag moet als eerste weer gesloten worden, dus bijvoorbeeld: <tag1><tag2> code </tag2></tag1>
  • Sommige tags, zoals <img> hoeven niet afgesloten te worden. Maar sluit de tag altijd bij twijfel.
  • Test eerst wat je veranderd hebt voordat je het online zet.
  • Veel mensen verdienen hun brood met het ontwerpen van webpagina's. Werk aan je vaardigheden, dan kun jij er misschien ook geld aan verdienen.
  • Er zijn veel online cursussen te vinden om HTML onder de knie te krijgen. Zoek eens op Google.
Advertentie

Waarschuwingen

  • De marquee-tag is geen officiële tag, het wordt niet ondersteund door W3C (World Wide Web Consortium) en werkt misschien niet in alle browsers.
Advertentie

Benodigdheden

  • Een tekstedit-programma zoals Notepad (Windows) of Textedit (Mac).
  • Een browser
  • Computer

Gerelateerde artikelen

Gratis toegang krijgen tot betaalde nieuwsartikelen
Het noorden vinden in Google Maps
Iemand opzoeken met een afbeelding
Waarom is ChatGPT altijd down?
De publicatiedatum van een website vinden
Contact opnemen met Yahoo
Een EML openen
Doen alsof je tekst van een website bewerkt
Google Home-apparaten verbinden met een nieuw wifi-netwerk
ChatGPT gebruiken
Alfabetiseren in Google Documenten
Oude websites vinden die niet meer bestaan
Advertentie

Bronnen

  1. Way2Tutorial HTML Tutorial

Over dit artikel

In andere talen
Deze pagina is 14.604 keer bekeken.

Was dit artikel nuttig?

Advertentie