Citaten duiden met Blockquotes en Quotes q tag

uit de cursus Basiskennis HTML

Citaten duiden met Blockquotes en Quotes q tag
Geef een waardering

Hallo vreemdeling,

wat leuk dat je onze site bezoekt. Bekijk gerust een paar video's en als het je bevalt kun je altijd abonnee worden.

Automatisch afspelen

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 HTML

perm_identity Belinda | video_library 40 video's | query_builder 2:50:32

In de cursus basiskennis HTML 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

In deze video leg ik de toepassing en het gebruik uit van de blockquote en de quote.

Maak je gebruik van teksten die van andere webpagina's afkomstig zijn, dan is het wel zo netjes om dit aan te geven.

Zo heb ik in dit voorbeeld een tekstgedeelte dat afkomstig is van een wikipedia pagina.

Dit is de originele tekst op de wikipedia website.

Als een citaat bestaat uit veel woorden. Eén of meerdere zinnen dan is het gebruikelijk het block-level element blockquote te gebruiken.

Dit doe je als volgt. Aan het begin plaats je het html element

.

En aan het einde van het citaat sluit je deze vervolgens af met einde blockquote

.

Vervolgens kun je met het attribuut cite, cite =" " , aangeven waar het citaat van afkomstig is.

De url kun je eenvoudig weg in de adresbalk van een browser selecteren. Vervolgens kopiëren.

En terugkeren naar je broncode en tussen de quotes van cite, plakken. Via Bewerken > Plakken.

Om een voorbeeld te zien hoe de browser een blockquote weergeeft gaan we naar voorvertonen in Firefox. Ik sla de wijzigingen op.

En dit is de wijze waarop standaard blockquotes worden weergegeven.

Je herkent dat het een block-level element is want er wordt witruimte vrijgehouden aan boven- en onderzijde.

Maar een blockquote krijgt ook een inspringing mee. Zowel links als rechts.

Het is altijd aan te raden om dit te doen met teksten die afkomstig zijn van andere websites.

Sterker nog, doe je dit niet? Dan kan dit afgestraft worden door zoekmachines. Want die controleren teksten op hun herkomst.

Voor korte citaten kun je het inline html element quote () gebruiken.

Dan blijft deze gewoon onderdeel van de regel.

In dit voorbeeld staat een uitspraak van Tim Berners Lee.

Ik ga dit aangeven met het html element .

En aan het einde van deze uitspraak zeg ik einde q .

We bekijken een voorbeeld in de browser. ik open deze in Firefox.

En wat mij direct al opvalt is dat eraanhalingstekens zijn verschenen om de tekst heen.

Dit wordt standaard door de browser gedaan zodra je tekst in een quote-tag plaatst.

En ook als je probeert de quotes te selecteren, dan lukt dat niet.

Omdat ze gegenereerd worden door de browser en niet daadwerkelijk in mijn broncode staan.

Mocht je het soort aanhalingstekens niet mooi vinden of je wilt ze op een andere manier vormgeven?

Dan kan dat maar dat doe je dan met css in een stijlblad.

Ik keer terug naar dreamweaver.

En ik controleer dat inderdaad de aanhalingstekens door de browser zijn gegenereerd.

Want hier in de broncode zie ik ze niet terug.

Ook het quote-element kun je voorzien van het attribuut cite.

En hierin kun je dan vervolgens de url plaatsen waar de originele tekst vandaan komt.