Dit document is een samenvatting van alle lesstof van het vak Basic Webcoding van de opleiding Communication & Multimedia Design aan Avans 's-Hertogenbosch.
BASIC WEBCODING
HTML BASISSTRUCTUUR
Elk HTML-document heeft de volgende opmaak:
<!DOCTYPE html> Dit geeft aan dat het om een HTML document gaat
<html lang=”en” dir=”ltr”> Dit geeft het begin van de HTML code aan
<head> Dit bevat alle informatie over de HTML-code, dit staat niet op de webpagina
<meta charset=”utf-8”> Dit geeft aan dat er standaardkarakters worden gebruikt
<title> Dit is een titel </title> Hierin zet je de titel van het document
</head> Dit geeft het einde van de head aan
<body> Binnen de body komt alle inhoud van de webpagina
<h1> Dit is een HTML document </h1> Met h1 t/m h6 maak je koppen binnen de body
<p> Dit is een paragraaf </p> Met p maak je een paragraaf
</body> Dit is het einde van de body
</html> Dit is het einde van het HTML bestand
Als je in een leeg document de tekst html typt en op TAB op je toetsenbord klikt, dan voegt Atom automatisch alle verplichte elementen toe.
Parents en childs
- Parents zijn elementen die zich op één niveau hoger bevinden. <head> is een parent van <title>, <title> moet dus altijd tussen <head> komen te
staan.
- Childs zijn elementen die zich op één niveau lager bevinden. <head> is een child van <html>, <head> moet dus altijd tussen <html> komen te
staan.
- Siblings zijn elementen die zich op hetzelfde niveau bevinden. <head> en <body> zijn siblings.
, ELEMENTEN IN HTML
ELEMENTEN BINNEN DE HEAD
Het meta element bevindt zich binnen de head. Met <meta charset=”UTF-8”> geef je aan dat je standaardkarakters gebruikt, daarnaast kan je met de
meta tag nog meer informatie over je document delen. Dit zorgt ervoor dat de webpagina beter te vinden is op het internet. Je kan bijvoorbeeld dingen
toevoegen zoals de auteur, de beschrijving en sleutelwoorden. Deze tags zijn niet verplicht maar wel handig om ervoor te zorgen dat je pagina goed
vindbaar is.
<meta name=”author” content=”Vera ten Haaf”> Bij author zet je de naam van de schrijver
<meta name=”description” content=”huiswerkopdracht”> Bij description zet je een beschrijving van de webpagina
<meta name=”keywords” content=”Avans, CMD, HTML”> Bij keywords zet je woorden die relevant zijn voor de webpagina
In de head vind je ook het title element. Dit element is wel verplicht voor elke pagina. De titel komt bovenaan te staan in de webbrowser.
<title> Website </title>
In de head voeg je ook een link toe om bijvoorbeeld een extern CSS bestand te koppelen. In het CSS bestand definieer je de opmaak van je website
<link rel="stylesheet" href="huiswerk_les_1.css">
Met het rel attribuut geef je aan dat het om een stylesheet gaat. Met het href attribuut geef je aan welk CSS bestand je wilt koppelen aan het HTML
bestand.
ELEMENTEN BINNEN DE BODY
Om vorm te geven aan je webpagina, kan je gebruik maken van koppen. Hiervoor gebruik je de tags h1 tot en met h6. h1 is de grootste kop en h6 de
kleinste.
<h1> Communicatie en Multimedia design </h1> Dit is de titel van de webpagina
<h3> Voltijdopleiding in ‘s-Hertogenbosch </h3> Dit is een subtitel op de webpagina
De tekst uit een paragraaf zet je binnen de p tag.
<p> De wereld van multimedia fascineert jou. Je bent analytisch en creatief. Je ontwerpt bij Communicatie & Multimedia design voor de media
van vandaag. Je experimenteert met de media van de toekomst. </p>
The benefits of buying summaries with Stuvia:
Guaranteed quality through customer reviews
Stuvia customers have reviewed more than 700,000 summaries. This how you know that you are buying the best documents.
Quick and easy check-out
You can quickly pay through credit card or Stuvia-credit for the summaries. There is no membership needed.
Focus on what matters
Your fellow students write the study notes themselves, which is why the documents are always reliable and up-to-date. This ensures you quickly get to the core!
Frequently asked questions
What do I get when I buy this document?
You get a PDF, available immediately after your purchase. The purchased document is accessible anytime, anywhere and indefinitely through your profile.
Satisfaction guarantee: how does it work?
Our satisfaction guarantee ensures that you always find a study document that suits you well. You fill out a form, and our customer service team takes care of the rest.
Who am I buying these notes from?
Stuvia is a marketplace, so you are not buying this document from us, but from seller veratenhaaf. Stuvia facilitates payment to the seller.
Will I be stuck with a subscription?
No, you only buy these notes for $5.93. You're not tied to anything after your purchase.