HTML

For alternative betydninger, se HTML (flertydig). (Se også artikler, som begynder med HTML)

HyperText Markup Language (HTML) er et opmærkningssprog, der primært har til formål at få tekst og billeder på en hjemmeside til at virke som links til andre HTML-sider. Markup betyder at opmærke, og HTML bruges til at strukturere hjemmesider og bestemme det indhold der vises. HTML bliver ofte brugt sammen med CSS og Scriptsprog såsom JavaScript der udvider muligheden for at bestemme design og specielt bruger-input på hjemmesider.

HTML (HyperText Markup Language)
HTML 5 logoet
Filendelse:	.html, .htm, .shtml, .shtm
MIME-type:	text/html
Udviklet af:	World Wide Web Consortium
Formattype:	Opmærkningssprog
Udvidet fra:	SGML
Udvidet til:	XHTML
Standard(er):	ISO/IEC 15445 W3C HTML 5.1

HTML kan eksempelvis bruges til at markere en tekst som overskrift eller brødtekst, arrangere i punktopstillinger eller tabeller, og hyperlink kan indsættes som klikbar tekst. Dermed kan webbrowsere skelne teksttyper og vise indholdet formateret efter den type, det er markeret som. Overskrifter vises med forstørret, fed skrift og hyperlink med blå skrift. HTML giver også mulighed for indlejring af billeder. HTML-filer bruges på internettet, især på World Wide Web.

HTML-side

Hver HTML-side kan være en hjemmeside, men oftest vil det være flere html-sider, der ligger under ét domæne, der kaldes en hjemmeside. Et bedre navn er derfor websted, website eller site.

Historie

HTML-sproget blev opfundet af fysikeren Tim Berners-Lee i 1990, under sit arbejde på CERN-atomforskningsinstituttet i Geneve i Schweiz. Formålet var at give forskerne på instituttet et simpelt markup-sprog (opmærkningskode) til at dele deres forskningsresultaters med hinanden på CERNs intranet.

HTML er baseret på SGML, Standard Generalized Markup Language, en international standard til opmærkning af tekster, så de kan præsenteres på fysiske enheder.

SGML opmærker en tekst: overskrift, brødtekst, lister og lignende, men fortæller ikke hvordan overskriften skal se ud. Udseendet bestemmes af den enhed teksten vises på. Samme tekst vil se meget forskellig ud fra enhed til enhed. Idéen med HTML var at det skulle være effektivt og enkelt, der var derfor ikke tænkt meget på at gøre teksten præsentabel og flot på tværs af platforme.

HTML gennemgik en række ændringer fra 1991-1993, i juli 1994 udløb det seneste RFC udkast, senere samme år blev udkastet til HTML 2.0 færdiggjort og november 24, 1995 blev der formelt udgivet en version som efterfølgende udvidelser af HTML skulle baseres på. Udgivelsen af HTML 2.0 fik navnet RFC1866.

HTML udkast før 1995

HTML 1.0

Denne udgave af HTML blev skabt før World Wide Web Consortium, for alvor var etableret. HTML 1.0 blev derfor ikke formelt specificeret. HTML 1.0 indeholdt få formateringskoder, man kunne hverken vælge baggrundsfarve eller baggrundsbillede. Man havde heller ingen indflydelse på, hvilken skrifttype teksten var skrevet med, så alle hjemmesider lignede hinanden med samme grå baggrund, blå tekst-links og Times New Roman som skrifttype.
Billeder skulle være i GIF-formatet. De fleste hjemmesider på den tid indeholdt ingen billeder. HTML 1.0 blev kun brugt i browserne Mosaic og Lynx (Lynx var kun tekstbaseret og virkede under UNIX).

HTML 1.1

Den nye version blev skabt af holdet bag browseren Netscape, for at understøtte Netscapes funktioner. Der var på dette tidspunkt et stærkt begrænset antal browsere til rådighed, og det var almindeligt at tilføje dén kode, der passede til den specifikke browser man arbejdede med.

HTML versioner

HTML 2.0

Den første udgave af HTML blev offentliggjort i 1995 som en internet standard. Med denne version af HTML kom flere formateringskoder til, såsom valg af baggrundsfarve. Det blev muligt at lave formularer i begrænset omfang, så brugeren kunne indtaste data, som administratoren af hjemmesiden så kunne gøre brug af. Tabeller (CSV) blev også en del af HTML 2.0.

The World Wide Web Consortium blev dannet mellem version 1 og 2 med Tim Berners-Lee som leder og HTML 2.0 blev formelt specificeret. Det forhindrede dog ikke udviklerne af browserne i at tilføje deres egne koder, hvilket gjorde det vanskeligt for web designeren med sit editor-program at forudsige præsentationen hos slutbrugeren, afhængig af browser.

HTML 3.2

I version 3.2 blev der tilføjet flere formateringskoder, som kunne bruges til at styre indholdet på hjemmesiden. 3.2 indeholdt også understøttelse af CSS 1 (Cascading Style Sheet level 1). Idéen var at CSS skulle indeholde formateringskoden og strukturen skulle skrives i HTML, på den måde blev struktur og udseende adskilt og fastlagt med hver deres kode. Da browserne ikke understøttede alle funktioner af CSS endnu, var CSS imidlertid ikke så anvendeligt. Det var derfor stadig formateringskoderne i HTML, der skulle bruges til at bestemme sidens udseende.

HTML 4.0

Hidtil havde udviklingen af HTML givet flere og flere formateringskoder og fjernet HTML fra den oprindelige tanke om et standardiseret markup language (opmærkningssprog eller kode under redigering i en web editor), der strukturer tekst, billeder, videoer med Macromedia hjælpeprogrammet Flash Player (senere et Adobe produkt), interaktive elementer (som ved chat funktioner eller uploade kommentarer i et særlig opmærket kommentarfeltfelt; indbygget mail funktion på hjemmesiden. Betalingssystemer til online handel etc. foruden en række andre hjælpeprogrammer, hvoraf mange blev integreret i web browseren på den enhed, HTML-siden blev downloadet på og gør det muligt for andre enheder der downloader eller logger sig på en hjemmeside, så det så ud på nogenlunde samme måde (ikke bare indholdsmæssigt men også i web designet). Formålet med HTML 4.0 var at vende tilbage til den oprindelige idé om at adskille struktur og præsentation. Derfor blev de fleste formateringskoder taget ud af HTML og lagt over i CSS.

HTML 5

Se artiklen HTML5

HTML's grundprincipper

Eksempel

Simpel kode i et HTML-dokument <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="UTF-8" /> <title>sidens titel</title> </head> <body> <h1>Tekst kodet med den største overskrift kode</h1> <p>En tekst mærket med koden for afsnit</p> <h2>En overskrift kodet med næststørste overskrift</h2> <p>Her er endnu et afsnit tekst kodet som brødtekst</p> </body> </html>

Her vises samme HTML kode som en browser læser det

Elementer og attributter

HTML består af et fast antal elementer, der kan tildeles en række egenskaber. Et element består af et åbnings-tag <elementnavn> der angiver starten på elementet og et lukke-tag </elementnavn> der angiver enden af elementet.

Elementerne html og body starter og afslutter indholdet på en side. Elementet body kan kun bruges en gang. Et element kan indeholde andre elementer, for at få vist overskriften på en side i browseren skal koden struktureres som i følgende eksempel:

<!DOCTYPE html>
<html>
<body>
<h1>overskrift</h1>
</body>
</html>

Et eksempel på et element er en overskrift. I HTML-koden sættes et åbnings-tag foran den tekst, der skal være overskrift og et lukke-tag efter teksten:

<h1>Min overskrift</h1> Her er åbnings-tag <h1> og lukke-tag </h1>

Overskriftelementet ligger inden i <body>-elementet, som ligger i HTML-elementet.

Læses ovenstående koden af en browser vil baggrunden af siden være standardfarven fra browseren og der vil på siden stå "overskrift" med stor skrifttype.
Browseren læser koden en linje af gangen og vil læse koden på følgende måde:

Linje 1: Dokumentet skal læses som HTML.
Linje 2: HTML koden starter.
Linje 3: Sidens indhold starter.
Linje 4: Teksten skal vises som den største overskriftstype.
Linje 5: Sidens indhold slutter.
Linje 6: HTML koden slutter.

Følgende kode indholder en attribut i body elementet, der bestemmer baggrundsfarven på siden.

<!DOCTYPE html>
<html>
<body bgcolor="blue">
<h1>Min overskrift</h1>
</body>
</html>

CSS

Uddybende artikel: CSS

CSS står for Cascading Style Sheets, og definerer hvordan HTML-elementer skal fremvises. CSS skrives i style-tags, Styles var tilført til HTML for at løse problemer i HTML 4.0. Styles håndterer formateringen i HTML dokumenter, på den måde kunne HTML gå tilbage til kun at definere indholdet af et dokument som eksempelvis:

<h1>Dette er en overskrift</h1>
<p>Dette er et afsnit</p>

CSS gør det nemmere at bestemme og redigere i, hvordan HTML-elementer skal vises. Formateringskoden gemmes som regel i eksterne CSS-filer. External Style Sheets kan ændre udseendet og layoutet af sider på en hjemmeside, blot ved at redigere en enkelt fil helt uafhængigt af sidens indhold.

Baggrunden for at skille struktur og præsentation

Den seneste udvikling af HTML har gjort mere for at skille strukturen af en hjemmeside fra udseendet. Strukturen har til formål at fortælle den enhed og browser, der skal gengive hjemmesiden, hvad de enkelte dele er. Ideelt set skal HTML-koder blot give browseren beskeden: her begynder HTML-siden, her er sidens titel, her begynder indholdet, her er en overskrift, her er et billede, her er et link, her er en tabel, her slutter indholdet osv.
I det tilfælde hvor hjemmesidedesigneren ikke bruger formateringskoder, vil browseren vise siden med en standardformatering. Det betyder, at den kan komme til at se meget forskellig ud, afhængigt af hvilken browser, brugeren benytter. Nedenfor ses et eksempel på HTML kode skrevet uden formateringskoder, og hvordan koden vil blive vist på en browser

<html> <head> <title>Kun struktur</title> </head> <body> <h1> Denne sides html er ren struktur</h1> <p> Derfor står det de enkelte browsere frit for at formatere indholdet med det Style Sheet den pågældende browser er født med</p> <h3>Et link</h3> <p>Sådan ser et link ud <a href=”https://da.wikipedia.org/wiki/Forside”> Link til wikipedias danske forside</a> </p> </body> </html>

Koden til venstre ser ud som nedenfor når html-siden vises i en browser

Vedligeholdelse

Før implementeringen af CSS var det besværligt at ændre udseende på en hjemmeside. Hvis baggrundsfarven på en hjemmeside skulle ændres, var det nødvendigt at åbne hver enkelt side og skrive HTML koden om.
Ved at skrive hele formateringen i et CSS-dokument og lade HTML-dokumentet til hvert side referere til det ene CSS-dokument, kunne ændringer på store hjemmesider laves hurtigt ved at ændrer i koden på CSS-dokumentet.

Præsentation på forskellige enheder

I takt med at flere og flere forskellige enheder med forskellige skærmstørrelser og Skærmopløsninger benyttes til at vise hjemmesider, bliver CSS også endnu mere vigtigt til at sørge for at hjemmesiderne kan vises på de forskellige enheder, på en overskuelig måde hvor en mindre skærm ikke gør en hjemmeside besværlig at læse indhold og navigere på. Et specifikt Style Sheet til hver enhed benyttes til at løse dette problem, som ikke kan løses i HTML alene. Når hjemmesiden indlæses i browseren, vil koden så benytte den CSS-fil der passer til den største opløsning enhedens skærm understøtter.
Hvis der er skrevet CSS-filer til flere forskellige opløsninger, vil hjemmesiden vises bedre på tværs af flere skærmstørrelser. Det vil dog sjældent være nødvendigt at skrive mere end 2 CSS-filer, en til computerskærm og en til mobilskærm.

Editorer og WYSIWYG

Mange værktøjer kan bruges i web-udvikling med funktioner som Syntax Highlighting, Autofuldførelse og Faneblade. På den måde behøver en webudvikler ikke at skrive meget kode, og derfor heller ikke at have intimt kendskab til kodens opbygning og anvendelse. Der opstår dog nemt problemer når man overlader noget af ansvaret til et værktøj.

Mange amatører benytter disse værktøjer, det kan give problemer når hjemmesider laves uden at tænke på sikkerhed. I sidste ende kan hjemmesiden udsættes for Hacker-angreb hvor indholdet kan ændres mod ejerens vilje og hackerne kan få adgang til personlige oplysninger.

Generelt kan enhver Teksteditor benyttes til at skrive HTML-kode såsom Notepad i Windows.

HTML sammenlignet med XHTML

XHTML er en videreudvikling af HTML. XHTML er baseret på XML, alle XML baserede sprog kan således anvendes med XHTML.

XHTML har flere funktioner end HTML men er mere følsom overfor fejl i koden. Små fejl kan i HTML stadig resultere i en brugbar hjemmeside, hvor de samme fejl i XHTML vil give en fejl i programmet så siden slet ikke vises. Det kræver derfor en større ekspertise at arbejde i XHTML.
I mange tilfælde vil det være uhensigtsmæssigt at arbejde i XHTML. HTML kan ofte spare meget tid og besvær med det samme slutresultat.

Eksterne henvisninger

Wikimedia Commons har medier relateret til: HTML

• W3C's hjemmeside: HTML validering mm.
• W3schools: HTML reference (engelsk)
• HTML analysator (engelsk) Arkiveret 21. april 2013 hos Wayback Machine