Skip to main content

Hypertext Markup Language (HTML)

TL;DR

HTML(HyperText Markup Language) är ett språk som används för att skapa webbsidor. Vissa sidor kan skrivas direkt i HTML, medan andra kan använda sidbyggare eller andra verktyg för att skapa webbsidor som även producerar HTML-utdata, som i sin tur kan läsas av webbläsare.

Vad betyder HTML?

HTML står för HyperText Markup Languageoch det är språket som används för att skapa webbsidor. Den använder uppmärkningar för att definiera och utforma element. Till exempel kan den definiera typsnitt, färger, position, länkar etc. Även om de flesta webbplatsbyggare inte skriver direkt i HTML, är de slutliga utdata som läses och tolkas av webbläsare i HTML-format. Det är därför, när du högerklickar på en webbsida och väljer "Visa sidkälla", bör den första textraden i det resulterande fönstret vara <!doctype html>.

Vad är strukturen på en HTML-sida?

Även om strukturer kan variera, är några av de element du bör hitta i vilken HTML som helst följande (med förklaringar i kursiv stil). Kontrollera detta på valfri webbsida genom att högerklicka var som helst och välja "Visa sidkälla":

<!DOCTYPE html> - detta visar webbläsaren att detta är en HTML-fil som den kan läsa

<html lang="sv"> - detta visar språket som webbsidan är skriven på

<huvud> - detta markerar början av huvudsektionen, där allmänna koder placeras

<title>Sidans titel</title> - detta är en metatagg som visar sidans titel, som visas på webbläsarfliken

<meta name="description" content="..." /> - detta används för att beskriva vad sidan handlar om, för sökmotorer

<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, user-scalable=0" /> - detta är ett kommando som talar om hur webbsidan ska visas på olika skärmstorlekar

<meta name="robots" content="index,follow" /> - detta talar om för botarna som genomsöker sidan att de kan indexera den och lägga till den i sökmotorresultat

<link rel="stylesheet" type="text/css" href="/css/style/style.css”> - detta kopplar HTML till en CSS-fil, där mer detaljerad stil för texten placeras

<script src="/js/random.js" type="text/javascript"></script> - detta ansluter till en JavaScript-fil som används för att köra en åtgärd på webbsidan

<link rel="canonical" href="https://dinsida.com"/> - om det finns sidor med liknande innehåll eller om sidan kan hittas på mer än en webbadress visar detta sökrobotar vilken webbadress som ska tas in i konto för myndighetsändamål

</head> - detta stänger huvudsektionen

<body> - detta öppnar body-sektionen, där det faktiska sidinnehållet placeras

<div class="container"> - detta öppnar en sektion som kallas container, som vanligtvis skapar ramen för innehåll

<a href="https://yoursiteshomepage.com"><img class="navbar-brand-logo-normal" src="/images/logo.svg" alt="Visitor Analytics logo" height="52" width ="180"></a> - detta är ett sätt att placera en logotypbild som länkar till din hemsida

<div class=”first-text”>Det här är de första orden som faktiskt visas på din webbplats</div> - viss text som kan formateras i den anslutna CSS-filen

...

</body>