1. Køreplan for selvstudie til hjemmeside

  1. Gå ind på www.w3sc hools.com og løb øvelserne til og med HTML images igennem 
  2. Download en editor. Du kan bruge Notesblok, men den er meget primitiv. Gratis editorer som Brackets og Notepad ++ er mere hjælpsomme, og dem må du gerne bruge. Selv Visual Studio kan bruges. Bemærk dog, at egen-installerede programmer vil blive slettet mellem hver kursusdag 
  3. Lav en mappe på din computer, der hedder ”Hjemmeside”. Opret en fil, som du kalder index.html (forsiden skal altid hedde index.html) 
  4. Sæt kode ind fra w3schools.com og åben filen i en browser. Se, at koden virker 
  5. Gå ind på https://www.w3schools.com/css/default.asp og løb øvelserne til og med CSS Colors igennem. Suppler med øvelserne CSS Text og CSS Font 
  6. Lav en side i din editor og kald den for mystyle.css 
  7. Forbind mystyle.css til din side index.html 
  8. Opret en side i din editor, og kald den side2.html. Sæt lidt tekst ind på siden. Gem siden i samme mappe som index.html 
  9. Gem et billede, f.eks. af AGFs fodboldhold i den mappe 
  10. Sæt billedet ind på index.html (få evt. Hjælp fra w3schools under HTML-sektionen 
  11. Sæt en 4 x 3 tabel ind med billetpriserne til AGF’s kampe. Den skal se ud som vist nedenfor med en synlig kant og fed overskrift. Find selv ud af hvordan ved at søge på W3schools under HTML > Tables  
Tribunen Voksne Børn 
A-tribunen 250,- 125,- 
B- og D- tribunen 150,- 75,- 
C-tribunen 200,- 100,- 
  1. Lav link mellem index.html og side2.html 

Du kan nu grundlæggende alt, hvad du har brug for, for at lave en hjemmeside. Du bestemmer selv herfra, men her er et par forslag: 

  • Lav en hjemmeside med mindst 3 sider, hvor du præsenterer dig selv, din køkkenhave, din bil eller hvad du har lyst til. Siden skal indeholde billeder, man skal kunne navigere mellem alle siderne. Alt layout skal styres fra en side med css kode 
  • Kik på https://www.w3schools.com/css/css_templates.asp (som du finder meget langt ned på CSS siden. Den tager hul på, hvordan man laver professionelle hjemmesider. Bemærk at tagget <div></div> er meget centralt. <div> er en kasse, men en bedre kasse end en tabel 
  • Kik på https://www.w3schools.com/howto/howto_css_menu_icon.asp og se, om du kan finde noget inspiration. F.eks. til fald-ned menuer 
  • Byg en ny hjemmeside efter eget valg, hvor du bruger både responsive sider og vandrette menuer. Du kan finde al nødvendig inspiration på w3schools.com, men du er selvfølgelig velkommen til at søge info andre steder