Teori

Under det här momentet kommer vi att behandla.

Internets historia speciellt CSS och HTML.

Serverteknologi och forms

Säkerhet på internet

Lektion 1

Internetshistoria

Vi går igenom en översiktlig historia från ARPA-net till HTML 5. Begrepp som XML, SGML

och standarder förklaras.

Lektion 2

Säkerhet och faror på internet

Vi går igenom olika typer av Malware (dvs jävelskap) som skadar din dator, spionerar eller
försöker lura dig. Vi går också igenom sätt att skydda sig mot Malware på nätet.

 

Frågor

Vilket är det vanligaste Malware som cirkulerar på Facebook?

Nämn ett nytt virus.

Vad är Rootkit?

Lektion 3 - 5

Server och forms

Vi går igenom de vanligaste sättet att kommunicera med en server. Olika metoder att 
skicka in information som användaren matar in till server. För och nackdelar.

 

Uppgift 1

Vi skapar och stylar ett basic form tillsammans.

Här har du koden med förklaring till min genomgång.

Om du har glömt css-selectors har du en lista här

Sammanfattning.

Vi gick igenom några olika typer av <input> och forms.

Label = Det som förklarar vad som ska skrivas i ett input-fält.

Input= Det som matas in på ett formulär. Vi gick igenom några olika typer av input.

Typer av input som vi gick igenom

email = Avnändaren måste skriva in en email adress annars varnar webläsaren.

text =   Användaren måste skriva in text.

submit = Funger ihop med en knapp. Skickar iväg formuläret till en server.

<textarea> är underligt nog inte en form av <input>. Den här rutan har du om användaren ska skriva
en längre textmassa, tex en recension. 

 

Uppgift 2

Du ska nu skapa ett helt eget form. Rita på ett rutat papper hur det ska se ut.

Den här funktionaliteten ska du ha med.

 

En grupp av info med basinformation.

Namn, E-mail, telefon-nummer, adress.

Det ska stå en placeholder-text någonstans.

 

Du ska ha en till grupp av info, tex 

Ålder, Utbildning.

 

Båda grupperna ska vara grupperade med fieldset och namngivna 

med legend.

 

Här har du en lista från Mozilla med olika typer av forms

Här är olika input types, dvs text, checkbox osv

Här är en bra tutorial hur du stylar och skriver forms

 

Uppgift 2 Svår

Skapa ett form som det på bilden. För att lyckas med det behöver du tänka till lite grann om styling med css.

Headertexten är av typsnitt Abril Fatface som du hittar på google fonts.

oldOx

Här är bakgrundsbilder som du kan behöva till uppgiften

 

 

Uppgift 3

Vi hänger på ett javascript till vårt form så vi får lite snygg interaktivitet.

Examination: Prov + Inläming