Tekst en Interactiviteit Verbeteren in HTML
Tekstopmaak-tags
HTML biedt verschillende tekstopmaak-tags waarmee nadruk, onderstreping of doorhaling aan tekst kan worden toegevoegd.
De <strong>- en <em>-tags worden gebruikt om tekst te benadrukken. De <strong>-tag geeft tekst vet weer, wat sterke belangrijkheid aanduidt, terwijl de <em>-tag tekst cursief weergeeft, wat nadruk aangeeft.
De <u>-tag onderstreept tekst om visuele duidelijkheid te bieden en belangrijke informatie te markeren. Gebruik onderstreping echter spaarzaam om overbodige opmaak te voorkomen.
De <s>-tag haalt tekst door, wat verwijdering of irrelevantie aanduidt. Deze tag wordt vaak gebruikt om aan te geven dat bepaalde tekst is verwijderd of niet langer geldig is.
Voorbeeld:
index.html
In het bovenstaande voorbeeld:
<strong>en<em>tags geven nadruk aan tekst, waarbij<strong>tekst vet weergeeft en<em>tekst cursief weergeeft;- De
<u>tag onderstreept tekst, waardoor deze visueel wordt benadrukt; - De
<s>tag streept tekst door, wat verwijdering of irrelevantie aangeeft.
Links
Links, ook wel hyperlinks genoemd, stellen gebruikers in staat te navigeren tussen webpagina's, bronnen en verschillende vormen van communicatie. In HTML worden links gemaakt met de <a> (anchor) tag.
<a href="href-value">some text</a>
Het href attribuut binnen de <a> tag specificeert de bestemming van de link. Het kan verschillende typen URL's accepteren, waaronder:
- Absolute URLs: Specificeer het volledige adres van de gekoppelde bron, inclusief het protocol (bijv.
"https://www.example.com"); - Telephone URLs: Hiermee kunnen gebruikers direct telefoongesprekken starten vanuit de browser wanneer erop wordt geklikt. Geformatteerd als
"tel:phone-number". Het is essentieel om de landcode op te nemen en eventuele speciale tekens of spaties uit het telefoonnummer te verwijderen (bijv."tel:+123456789"); - Email URLs: Hiermee kunnen gebruikers e-mails opstellen wanneer erop wordt geklikt. Geformatteerd als
"mailto:email-address". Het is belangrijk om het volledige e-mailadres namailto:op te nemen (bijv."mailto:example@example.com").
Voorbeeld:
index.html
In het bovenstaande voorbeeld:
- De
<a>-tag maakt hyperlinks met verschillende bestemmingen; - Het
href-attribuut specificeert diverse URL's, waaronder absolute URL's, telefoonnummers en e-mailadressen.
Andere nuttige attributen
De <a>-tag heeft verschillende attributen die gebruikt kunnen worden om eigenschappen van hyperlinks te specificeren. Enkele veelvoorkomende attributen zijn:
target="_blank": Specificeert waar het gekoppelde document wordt geopend."_blank"opent de link in een nieuw venster of tabblad;download: Geeft aan dat het doelbestand wordt gedownload wanneer de gebruiker op de hyperlink klikt. Dit attribuut kan een waarde hebben om de bestandsnaam voor het opslaan van de bron te bepalen.
Voorbeeld:
index.html
In dit voorbeeld:
- De
href-attribuut specificeert de URL van de gekoppelde bron; - De
target-attribuut opent de link in een nieuw venster of tabblad.
Knoppen
De <button>-tag maakt klikbare knoppen op webpagina's. Hiermee kunnen gebruikers interageren met de webpagina door acties uit te voeren, zoals het verzenden van een formulier of het uitvoeren van JavaScript-code. Hoewel we in deze cursus niet op JavaScript zullen ingaan, is het belangrijk te weten dat deze mogelijkheid bestaat.
Typen knoppen
- Standaardknop (
<button type="button">): Een algemene knop die wordt gebruikt voor verschillende acties op de webpagina, zoals het aanroepen van JavaScript-functies of het navigeren naar een andere pagina; - Verzendknop (
<button type="submit">): Wordt binnen een formulier gebruikt om de formuliergegevens naar een server te verzenden; - Resetknop (
<button type="reset">): Wordt binnen een formulier gebruikt om de velden van het formulier terug te zetten naar hun standaardwaarden.
Voorbeeld:
index.html
In het bovenstaande voorbeeld:
- De eerste knop is een standaardknop met een
onclick-attribuut dat een waarschuwing activeert wanneer erop wordt geklikt; - De tweede knop is een verzendknop die de formuliergegevens naar de server verzendt;
- De derde knop is een resetknop die de formuliervelden terugzet naar hun standaardwaarden.
Videotutorial
1. Selecteer de juiste bewering uit de gegeven opties.
2. Hoe worden links aangemaakt?
3. Wat specificeert het href-attribuut in een <a>-tag?
4. Wat doet de <button type="submit"> tag?
Bedankt voor je feedback!
Vraag AI
Vraag AI
Vraag wat u wilt of probeer een van de voorgestelde vragen om onze chat te starten.
Awesome!
Completion rate improved to 3.13
Tekst en Interactiviteit Verbeteren in HTML
Veeg om het menu te tonen
Tekstopmaak-tags
HTML biedt verschillende tekstopmaak-tags waarmee nadruk, onderstreping of doorhaling aan tekst kan worden toegevoegd.
De <strong>- en <em>-tags worden gebruikt om tekst te benadrukken. De <strong>-tag geeft tekst vet weer, wat sterke belangrijkheid aanduidt, terwijl de <em>-tag tekst cursief weergeeft, wat nadruk aangeeft.
De <u>-tag onderstreept tekst om visuele duidelijkheid te bieden en belangrijke informatie te markeren. Gebruik onderstreping echter spaarzaam om overbodige opmaak te voorkomen.
De <s>-tag haalt tekst door, wat verwijdering of irrelevantie aanduidt. Deze tag wordt vaak gebruikt om aan te geven dat bepaalde tekst is verwijderd of niet langer geldig is.
Voorbeeld:
index.html
In het bovenstaande voorbeeld:
<strong>en<em>tags geven nadruk aan tekst, waarbij<strong>tekst vet weergeeft en<em>tekst cursief weergeeft;- De
<u>tag onderstreept tekst, waardoor deze visueel wordt benadrukt; - De
<s>tag streept tekst door, wat verwijdering of irrelevantie aangeeft.
Links
Links, ook wel hyperlinks genoemd, stellen gebruikers in staat te navigeren tussen webpagina's, bronnen en verschillende vormen van communicatie. In HTML worden links gemaakt met de <a> (anchor) tag.
<a href="href-value">some text</a>
Het href attribuut binnen de <a> tag specificeert de bestemming van de link. Het kan verschillende typen URL's accepteren, waaronder:
- Absolute URLs: Specificeer het volledige adres van de gekoppelde bron, inclusief het protocol (bijv.
"https://www.example.com"); - Telephone URLs: Hiermee kunnen gebruikers direct telefoongesprekken starten vanuit de browser wanneer erop wordt geklikt. Geformatteerd als
"tel:phone-number". Het is essentieel om de landcode op te nemen en eventuele speciale tekens of spaties uit het telefoonnummer te verwijderen (bijv."tel:+123456789"); - Email URLs: Hiermee kunnen gebruikers e-mails opstellen wanneer erop wordt geklikt. Geformatteerd als
"mailto:email-address". Het is belangrijk om het volledige e-mailadres namailto:op te nemen (bijv."mailto:example@example.com").
Voorbeeld:
index.html
In het bovenstaande voorbeeld:
- De
<a>-tag maakt hyperlinks met verschillende bestemmingen; - Het
href-attribuut specificeert diverse URL's, waaronder absolute URL's, telefoonnummers en e-mailadressen.
Andere nuttige attributen
De <a>-tag heeft verschillende attributen die gebruikt kunnen worden om eigenschappen van hyperlinks te specificeren. Enkele veelvoorkomende attributen zijn:
target="_blank": Specificeert waar het gekoppelde document wordt geopend."_blank"opent de link in een nieuw venster of tabblad;download: Geeft aan dat het doelbestand wordt gedownload wanneer de gebruiker op de hyperlink klikt. Dit attribuut kan een waarde hebben om de bestandsnaam voor het opslaan van de bron te bepalen.
Voorbeeld:
index.html
In dit voorbeeld:
- De
href-attribuut specificeert de URL van de gekoppelde bron; - De
target-attribuut opent de link in een nieuw venster of tabblad.
Knoppen
De <button>-tag maakt klikbare knoppen op webpagina's. Hiermee kunnen gebruikers interageren met de webpagina door acties uit te voeren, zoals het verzenden van een formulier of het uitvoeren van JavaScript-code. Hoewel we in deze cursus niet op JavaScript zullen ingaan, is het belangrijk te weten dat deze mogelijkheid bestaat.
Typen knoppen
- Standaardknop (
<button type="button">): Een algemene knop die wordt gebruikt voor verschillende acties op de webpagina, zoals het aanroepen van JavaScript-functies of het navigeren naar een andere pagina; - Verzendknop (
<button type="submit">): Wordt binnen een formulier gebruikt om de formuliergegevens naar een server te verzenden; - Resetknop (
<button type="reset">): Wordt binnen een formulier gebruikt om de velden van het formulier terug te zetten naar hun standaardwaarden.
Voorbeeld:
index.html
In het bovenstaande voorbeeld:
- De eerste knop is een standaardknop met een
onclick-attribuut dat een waarschuwing activeert wanneer erop wordt geklikt; - De tweede knop is een verzendknop die de formuliergegevens naar de server verzendt;
- De derde knop is een resetknop die de formuliervelden terugzet naar hun standaardwaarden.
Videotutorial
1. Selecteer de juiste bewering uit de gegeven opties.
2. Hoe worden links aangemaakt?
3. Wat specificeert het href-attribuut in een <a>-tag?
4. Wat doet de <button type="submit"> tag?
Bedankt voor je feedback!