HTML (Hypertext Markup Language) är ett märkspråk som används för hypertext. Hypertext i sin tur är text som presenteras t.ex. på webben och innehåller hyperlänkar vilket gr att läsaren kan klicka sig vidare till nytt innehåll direkt från texten. HTML finns i olika versioner och de flesta webbläsare klarar att avkoda alla varianter. HTML är en grundsten i att skapa webbsidor. Antingen kan man skapa en statisk sida enbart med hjälp av HTML, eller så kan webbsidan genereras från en databas. I båda fallen är slutresultatet för webbläsaren att hantera en helt vanlig HTML-sida. Detta beror på att all generering av innehåll från databas sker på servernivå. Servern levererar i sin tur helt vanlig HTML-kod från den information som hämtas från databasen och kombinerar den med en HTML-mall som är skapad i ren HTML.
Inom modernare webbutveckling är det vanligt att skilja struktur (HTML) från design. Detta görs med hjälp av stilmallar (CSS). När du märkt upp strukturen i din HTML-kod kan du namnge de olika elementen. Genom att i din stilmall hänvisa till de olika namngivna elementen kan du styra hur dessa ska se ut i besökarens webbläsare. CSS kan anges i en separat fil (vilket är att föredra) eller direkt i HTML-koden. Nedan följer några exempel på HTML och CSS:
HTML-kod med namgivna element där utformningen sker i separat fil:
HTML-fil:
<html>
<head>
<link href=”style.css” type=”text/css” rel=”stylesheet” />
</head>
<body>
<div class=”innehall”></div>
</body>
CSS-fil:
div.innehall {
margin: 10px;
padding: 15px;
}
HTML-kod där utformningen sker i samma kod:
<html>
<head>
</head>
<body>
<div style=”margin: 10px; padding: 15px;”></div>
</body>
Den stora fördelen med att använda en separat CSS-fil är att alla inställningar samlas på ett ställer och länkas in i HTML-filen. Detta gör att man slipper ändra inställningar i alla HTML-filer om man ska göra förändringar. Har man en separat fil räckr et att göra ändringen där så får det genomslag på alla sidor som har länkat in den aktuella stilmallen.