Enkelte ord eller hele passager kan meget nemt fremhæves med kursiv og fed skrift. Først til den fed skrift-udmærkende variant. Der er principielt to HTML-elementer til rådighed til dette formål, b og strong.
Velkommen til <b>PSD-Tutorials.de</b>! <br /> Velkommen til <strong>PSD-Tutorials.de</strong>!
Et kig på resultatet i browservinduet giver følgende billede:
Tilsyneladende giver begge elementer således en identisk visning. Hvorfor findes der dog to forskellige elementer? Faktisk er der andre visningsformer for websteder end dem, der er kendt fra de gængse standardbrowsere. Tænk f.eks. på læsere for blinde mennesker eller også på mobile enheder. HTML-elementerne, som tilbydes af W3C, er designet til at understøtte semantikken. Så betyder b-elementet nu faktisk ikke længere, at noget skal vises med fed skrift. Derimod betyder b en synligt fremhævet tekst uden øget vigtighed. Det kunne f.eks. være produktnavne eller nøgleord i dokumenter.
Det strong-element har hidtil stået for en større fremhævning. em er derimod blevet brugt til at fremhæve vigtig tekst (emfatisk). strong har tidligere i HTML-versioner været en forstærkning af em. Begge elementer tildeles en anden betydning i HTML5.
Først en tekst med normal fremhævning.
<p> Katte er søde dyr. </p>
Nu samme tekst igen, dog med fremhævelse på det første ord.
<p> <em>Katte</em> er søde dyr. </p>
Ved brug af em lægges der vægt på ordet Katte. Det kunne f.eks. være relevant i en diskussion om, hvorvidt hunde eller katte er sødeste.
Nu kunne man i det aktuelle eksempel også anvende em-elementet på ordet er.
<p> Katte <em> er </em> søde dyr. </p>
Derved vises passager, der er markeret med em, i browservinduet kursiv. Samme visuelle effekt opnås med i-elementet.
Ifølge HTML5-arbejdsudkast betyder det i-element nu ikke længere kursiv.
<p> Hjertelig velkommen til <i>PSD-Tutorials.de</i> </p>
Dette element betyder nu snarere, at man ønsker at formidle en anden stemning. Især er det i-element interessant til markering af tekniske udtryk eller taksonomiske betegnelser.
Det er alt sammen frygtelig teoretisk, jeg ved det. Generelt bør I forsøge at følge HTML5-retningslinjerne. På den anden side vil der naturligvis ikke ske noget, hvis I bruger strong i stedet for b.
<p> <em>Linje med em</em><br /> <i>Linje med i</i><br /> <strong>Linje med strong</strong><br /> <b>Linje med b</b> </p>
I sidste ende er det browserproducenterne, der skal handle her.
For den faktiske styling af tekstene udstyret med de nævnte elementer, er CSS i sidste ende ansvarlig.
Forkortelser med abbr
For at angive en forkortelse bruges det samme element, som tidligere har været brugt til akronymer, nemlig abbr.
Det tysk-østrigske kontor for <abbr title="World Wide Web Consortium">W3C</abbr> har haft sin base ved Fachhochschule Potsdam siden april 2009.
Browsere, der fortolker abbr-elementet korrekt, vil vise den indlejrede tekst i abbr-elementet understreget.
Dertil bør man tildel abbr et title-attribut. Her skrives typisk den fulde udtryk for forkortelsen. Når besøgende fører musen over forkortelsen, vil udtrykket blive vist i en værktøjstip.
Adresser med address
Med address-elementet kan man markere adressedata.
<address> 4eck Media GmbH & Co. KG<br /> Hauptstraße 20<br /> 17309 Viereck<br /> </address>
Webbrowsere viser normalt indholdet af address-elementet kursivt.
Marker programmekode med code
Elementet code bruges til at markere programmekode. I denne sammenhæng har der ikke været ændringer i forhold til tidligere HTML-versioner. code bruges stadig til det formål.
<pre>
Dette er en HTML-hovedsektion:
<code>
<html>
<head>
<title></title>
</head>
</code>
</pre>
Normalt kombineres code med pre-elementet for at bevare indrykningerne, der bruges i programmekoden.
HTML5-specifikationen anbefaler brugen af class-attributtet i forbindelse med code-elementet. Dette attribut kan tildeles det sprog, der bruges inden for code-elementet. Her er nogle typiske eksempler på, hvordan sådanne markeringer kan se ud:
• language-html
• language-css
• language-javascript
• language-php
• language-pascal
Om og hvordan browsere implementerer disse anvisninger, er ikke fastlagt af W3C.
<pre>
Dette er en HTML-hovedsektion:
<code class="language-html">
<html>
<head>
<title></title>
</head>
</code>
</pre>
For øjeblikket har class-attributtet i hvert fald ingen synlige virkninger i browsere. Dog kan menneskelige beskuere på denne måde se, hvilket sprog programmekoden er baseret på, når de kigger på kildeteksten på siden.
Brug af small til små bogstaver
Elementet small var oprindeligt til at vise tekst i mindre skriftstørrelse end normalt. I HTML5 er small specifikt til småt tryk. Dette småt tryk kunne f.eks. være følgende:
• Copyrightoplysninger
• Ansvarsfraskrivelser
• Licensbestemmelser
• Betingelser og vilkår
W3C understreger, at small ikke bør bruges til lange tekstpassager.
<small> Copyright by PSD-Tutorials.de<br /> 4eck Media GmbH & Co. KG<br /> Hauptstraße 20<br /> 17309 Viereck </small>
Understrege tekst
I kan understrege ord ved hjælp af u-elementet. Her er et eksempel:
<p>Velkommen til <u>PSD-Tutorials.de</u></p>
Resultatet vises i browseren på følgende måde:
Når man ser resultatet, er det faktisk den ønskede effekt. Der er dog en hage. På internettet bruges understregede tekster normalt til hyperlinks. Hvis I nu præsenterer en tekst eller et ord understreget, kan besøgende muligvis tro, at det er et hyperlink. Forsøget på at klikke på det vil selvfølgelig mislykkes. I bør derfor undlade at bruge understregningen.
