Skip to content
Kursen webtec

Kmom03: Struktur och stil ⚠️

Bygg en personlig webbplats genom att jobba mer med CSS och olika typer av innehåll med HTML element. (Använd js för att hantera en form av stilväljare där man via querysträngen skickar in ett värde som läggs till som en klass på body-elementet.)

Gör flera små övningar som visar hur man stylar olika HTML-element samt använder mer magiska CSS-konstruktioner för dynamik.

Vilka HTML-delar kan vara av intresse?

  • form, formelements
  • table
  • dl, dd, dt
  • summary, details
  • externa fonter
  • bakgrundsbilder, färg
  • ljud, bild
  • position absolute/fixed
  • Kolumner lika höjd (träna flexbox)
  • Ändra små delar av texten, typ stor bokstav inledning av paragraf, första meningen bold…

(lägg till en (lång) webbsida där allt samlas)

Som uppgift kan man bygga en egen webbsida likt https://hvildmarken.se/

(cookies, hur använda dem med js?)

(försök visa hur man använder modul & funktion)

Mer HTML, CSS och JavaScript med fokus på en responsiv webbplats.

(Detta är instruktionen för kursmomentet och omfattar det som skall göras inom ramen för kursmomentet. Momentet omfattar cirka 20 studietimmar inklusive läsning, arbete med övningar och uppgifter, felsökning, problemlösning, redovisning och eftertanke. Läs igenom hela kursmomentet innan du börjar jobba. Om möjligt – planera och prioritera var du vill lägga tiden.)

Läs & Studera

(2-4 studietimmar)

Här kan du på egen hand studera och förbereda dig inför övningar och uppgifter.

Föreläsning

Titta på följande inspelade föreläsningar. Föreläsningarna kan innehålla tips om läsanvisningar.

  1. XXX

Litteratur

Studera litteratur och resurser enligt följande.

  1. XXX

Video för orientering

Titta på följande videor/filmer. Filmerna är tänkta att ge dig en allmän orientering i det område som behandlas i kursmomentet.

  • XXX

Videorna ovan finner du även i spellistan “Kursen webtec: Om webbteknologier HTML, CSS och JavaScript sat att bygga webbplatser och webbtjänster”.

Instuderingsfrågor

Här finns ett antal instuderingsfrågor som hjälper dig att finna information på egen hand för att träna på de koncept som är relevanta för detta kmom.

Instuderingsfrågor om HTML
  1. Vad står HTML för?
Instuderingsfrågor om CSS
  1. Vad står CSS för?
Instuderingsfrågor om JavaScript
  1. Ge en kort historik över programmeringsspråket JavaScript.

Övningar & Uppgifter

(8-12 studietimmar)

Övningar är träning inför uppgifterna, det är ofta klokt att jobba igenom övningarna då de förbereder dig inför uppgifterna. Uppgifter skall utföras och redovisas.

Övningar

Jobba igenom övningarna, de förbereder dig inför uppgifterna.

  1. Jobba igenom övningen “Bygg en responsiv webbplats med HTML, CSS och JavaScript”.

  2. Gå igenom artikeln om de vanligaste konstruktionerna del 2 i JavaScript.

Uppgifter

Följande uppgifter skall utföras och resultatet skall redovisas.

  1. Utför laborationen “Lab 3: XXX”.

  2. Gör uppgiften “Bygg en responsiv webbplats”.

Resultat & Redovisning

(1-2 studietimmar)

Läs instruktionen om hur du skall redovisa.

Se till att följande frågor besvaras i din redovisningstext.

  • Vilken är din TIL för detta kmom?