HTML Academy logo
HTMLNybörjareWebbNivåer A1 → C122 språk

HTML Academy

Bygg en stark grund i webbutveckling genom att lära dig HTML på HTML Academy. En lärstig från CoddyKit med 40 korta kurser och 159 interaktiva lektioner, med en AI-handledare till hands dygnet runt.

Kurser
40
Lektioner
159
Interaktiva steg
2,096
Gratis att börja
Kurs 1
Kursplan

40 kurser i den här lärvägen

Alla kurser i lärvägen HTML Academy, i rätt ordning. Den första är gratis.

1

A13 lektionerGratis

Lär er hur webbläsare tolkar HTML, vad DOCTYPE gör och hur elementen html, head och body organiserar varje webbsida.

2

A14 lektionerPRO

Bemästra rubriker, stycken, betoning, inline-element och hantering av blanksteg med HTML-taggar för text.

3

A14 lektionerPRO

Bygg navigering med ankarelement, absoluta och relativa URL:er, länkar som öppnas i nya flikar och fragmentidentifierare.

4

A14 lektionerPRO

Visa bilder responsivt med img, srcset, picture-elementet och semantiska bildtexter med figure.

5

A14 lektionerPRO

Skapa oordnade listor, ordnade listor och beskrivningslistor med korrekt nästling och semantisk betydelse.

6

A24 lektionerPRO

Bygg tillgängliga datatabeller med korrekt struktur, celler som sträcker sig över flera rader eller kolumner och tabellsektioner.

7

A24 lektionerPRO

Förstå id, class, style, hidden, tabindex och anpassade data-*-attribut som används i alla HTML-element.

8

A24 lektionerPRO

Bygg tillgängliga webbformulär med inmatningstyper, etiketter, knappar samt action- och method-attributen i form-elementet.

9

A24 lektionerPRO

Förbättra formulär med rullgardinslistor, textområden, checkbox-grupper, radioknappar och autocomplete med datalist.

10

A24 lektionerPRO

Använd HTML5-valideringsattribut som required, pattern, min och max för att validera användarindata före inskickning.

11

A24 lektionerPRO

Ersätt generiska div-element med meningsfulla HTML5-element som header, nav, main, footer, article och section.

12

A24 lektionerPRO

Utforska aside, details, summary, progress och meter för att ge sidor rikare betydelse och interaktivitet.

13

A24 lektionerPRO

Bemästra head-sektionen: title, meta-taggar, viewport, kanoniska URL:er, robots-direktiv och favicons.

14

A24 lektionerPRO

Bädda in ljud och video inbyggt med HTML5, tillhandahåll flera format och lägg till undertexter med track och WebVTT.

15

B14 lektionerPRO

Förstå WCAG-nivåer, rubrikhierarki, strategi för alt-text och tangentbordsnavigering för inkluderande webbsidor.

16

B14 lektionerPRO

Förbättra tillgängligheten med ARIA-roller, etiketter och beskrivningar och följ regeln att använda inbyggd HTML först.

17

B14 lektionerPRO

Lagra och få åtkomst till anpassade metadata på HTML-element med data-*-attribut, dataset-API:t och CSS-selektorer.

18

B14 lektionerPRO

Använd template-elementet för att definiera inaktiv uppmärkning, klona den effektivt och jämför med rendering baserad på innerHTML.

19

B14 lektionerPRO

Rita former, text och bilder på en tvådimensionell canvas och animera dem med requestAnimationFrame.

20

B14 lektionerPRO

Bädda in skalbar vektorgrafik direkt i dokumentet, använd grundläggande former, styr viewBox och animera SVG med CSS.

21

B14 lektionerPRO

Bädda in externt innehåll med iframe, förstå sandboxning för säkerhet och använd lazy loading för bättre prestanda.

22

B14 lektionerPRO

Lagra data på klientsidan med localStorage och sessionStorage, lyssna på storage-händelser och följ säkerhetsriktlinjer.

23

B14 lektionerPRO

Implementera dra-och-släpp-interaktioner med HTML5:s Drag and Drop API och dataTransfer-objektet.

24

B14 lektionerPRO

Optimera sidor för sökmotorer och delning i sociala medier med OpenGraph, Twitter Cards, JSON-LD och hreflang.

25

B14 lektionerPRO

Bygg e-postsäker HTML med tabellbaserade layouter, inline-stilar och bildtekniker som fungerar i olika e-postklienter.

26

B24 lektionerPRO

Implementera mönster för växlingsknappar, tabbgränssnitt och live-regioner och testa med riktiga skärmläsare.

27

B24 lektionerPRO

Snabba upp sidladdningar med async- och defer-skript, preload-hintar, lazy-loadade bilder och resurstips.

28

B24 lektionerPRO

Definiera återanvändbara anpassade HTML-element med Custom Elements API, livscykelcallbackar och observerade attribut.

29

B24 lektionerPRO

Kapsla in uppmärkning och stilar i Shadow DOM, distribuera innehåll med slots och exponera styling-API:er med part.

30

B24 lektionerPRO

Använd ES-modulskript, import maps för nakna specifikationer, dynamiska importer och koncept inom module federation.

31

B24 lektionerPRO

Bygg med progressiv förbättring: börja med stabil HTML, lägg till CSS och JavaScript stegvis och identifiera funktioner korrekt.

32

B24 lektionerPRO

Förbered HTML för en global målgrupp med stöd för lang, dir, bdi, bdo, charset och text från höger till vänster.

33

B24 lektionerPRO

Skydda sidor mot XSS, clickjacking och injektioner med CSP, sandboxning, SRI och säkra metoder för HTML-hantering.

34

B24 lektionerPRO

Använd FormData, Constraint Validation API, anpassade giltighetsmeddelanden och hantering av formulärtillstånd.

35

B24 lektionerPRO

Hantera webbläsarhistoriken med pushState, popstate-händelser och det moderna Navigation API:t för SPA-routing.

36

B24 lektionerPRO

Använd IntersectionObserver för att implementera lazy loading, oändlig rullning och triggar för rullningskopplade animationer.

37

B24 lektionerPRO

Konfigurera progressiva webbappar med webbappmanifestet, registrering av service worker och offline-reservsidor.

38

B24 lektionerPRO

Validera markup med W3C Validator, granska HTML med Lighthouse och testa tillgänglighet med pa11y och axe.

39

B24 lektionerPRO

Utforska kommande HTML-funktioner: Declarative Shadow DOM, Popover API, selectlist och command-attribut.

40

C14 lektionerPRO

Hantera HTML i stora projekt med extrahering av komponenter, rendering på serversidan, designsystem och dokumentation av styleguides.

CoddyKit PRO

Lås upp alla 40 kurser i den här lärvägen och alla andra lärvägar

AI-handledare, certifieringsprov och certifikat. Fungerar på webben, iOS och Android.

Se alla abonnemang
Årsvis$29.90 / årCirka $2.49 i månadenBetala en gångLivstid$69.99 en gångInga förnyelser. PRO för alltid.
Kursöversikt

HTML: Språket bakom varje webbsida

HTML är webbens strukturella grund – varje webbläsarflik, formulärinskickning och inbäddad video börjar med markup. Den här kursserien ger er gedigna kunskaper i HTML, från reglerna för ett giltigt dokument till de webbläsar-API:er och komponentmodeller som används på moderna webbplatser i produktion. Målet är inte bara att skriva taggar, utan att förstå varför varje element finns och vad det signalerar till webbläsare, hjälpmedel och sökmotorer.

Det här får ni lära er

Ni börjar med dokumentstruktur, textinnehåll, länkar, bilder och listor och går sedan vidare till tabeller, formulär och attribut för formulärvalidering. Kursserien omfattar semantiska HTML5-element, <head> och metadata, ljud och video samt grunderna i tillgänglighet, inklusive ARIA-roller och attribut. I senare kurser behandlas anpassade dataattribut, HTML-mallar, Canvas- och SVG-elementen, Web Storage, Drag and Drop API, SEO och sociala metataggar samt HTML-mallar för e-post. Avancerade avsnitt går igenom Shadow DOM, Web Components och anpassade element, HTML-moduler och import maps, progressiv förbättring, internationalisering, säkerhet, History and Navigation API, Intersection Observer och att bygga HTML för progressiva webbappar.

Lärandevägen

Fyrtio kurser går från A1 via A2 och B1 till B2 och avslutas med en C1-kurs om HTML i stor skala. Kurserna på A1- och A2-nivå lägger grunden med dokumentstruktur, semantiska element, formulär och metadata. B1 introducerar tillgänglighet, ARIA, Canvas, SVG och lagring i webbläsaren. B2 är det största blocket och omfattar Web Components, Shadow DOM, prestanda, säkerhet, internationalisering och Intersection Observer. Den avslutande C1-kursen, HTML at Scale, behandlar de mönster och begränsningar som är viktiga när HTML skrivs, testas och underhålls i stora kodbaser.

Så fungerar det

Varje kurs är uppdelad i korta, praktiska lektioner som ni genomför i den inbyggda kodeditorn med feedback i realtid. En AI-handledare finns tillgänglig när ni kör fast, och ni går framåt i er egen takt – varje lektion är fristående, så att ni senare kan återvända till valfritt ämne som referens.

Så lär du dig

  1. 01

    Interaktiva lektioner

    Praktiska kodövningar med feedback i realtid

  2. 02

    AI-handledare

    Få omedelbar hjälp av vår AI när du kör fast

  3. 03

    Inbyggd kodredigerare

    Skriv och kör kod direkt i webbläsaren

  4. 04

    Certifikat

    Få ett certifikat när du slutför kursen

FAQ

Vanliga frågor

Är kursen i HTML Academy gratis?

Ja. Ni kan börja kursen i HTML Academy gratis och genomföra de interaktiva lektionerna utan kostnad. Med en valfri PRO-prenumeration får Ni tillgång till avancerade AI-verktyg och ett certifikat som kan delas.

Behöver jag tidigare erfarenhet för att lära mig HTML?

Nej. Kursen börjar med grunderna och går stegvis vidare till mer avancerade ämnen, så Ni kan börja även utan tidigare erfarenhet av HTML.

Hur lär jag mig HTML på CoddyKit?

Ni lär Er genom att göra. Korta interaktiva lektioner kombinerar tydliga förklaringar med praktiska kodövningar som körs i realtid, och en AI-handledare som är tillgänglig dygnet runt ger personlig hjälp när Ni kör fast.

Får jag ett certifikat när jag har slutfört HTML Academy?

Ja. PRO-användare kan göra ett prov och få ett delbart intyg på att de har slutfört kursen i HTML Academy, med en verifierbar kod.

Kan jag lära mig HTML i mobilen?

Ja. CoddyKit finns på webben och som inbyggda iOS- och Android-appar, så Ni kan lära Er HTML på valfri enhet och synkronisera Era framsteg mellan dem.

Vad kostar CoddyKit PRO?

Den första kursen i HTML Academy är gratis. CoddyKit PRO låser upp alla kurser: $5.90 per vecka, $7.90 per månad, $29.90 per år eller $69.99 en gång för livstidsåtkomst utan förnyelser.

Hur lång tid tar det att slutföra HTML Academy?

HTML Academy har 40 kurser och 159 lektioner. De flesta lektioner tar cirka 5–10 minuter, så hela lärvägen motsvarar ungefär 19 timmars praktisk övning i egen takt.

Börja med HTML Academy nu

Anslut Er till tusentals deltagare som lär sig programmering med AI-drivna lektioner.