Denna uppgift går ut på att du ska koda en enklare webbplats från grunden med HTML, CSS & JavaScript. Det du ska bygga är en CV-sida för dig själv med information om dig, ditt CV och en portfolio.
Du ska bygga en webbplats som följer nedanstående kravställningar:
Försök lösa denna uppgift utan CSS-ramverk så som Bootstrap. Du kommer ha mer nytta av att lära dig "ren" CSS och att öva på det. Dock är Bootstrap inte förbjudet i denna uppgift.
- Din webbplats ska bestå av minst fem (5) olika sidor som besökaren kan navigera mellan
- Du ska ha en meny där användaren kan ta sig runt till alla olika undersidor
- Det ska från alla dina sidor gå att komma åt alla andra sidor och det ska vara en konsekvent meny (dvs inte olika menyer/navigation) på de olika sidorna
- I menyn ska det synas vilken sida man som besökare är på
- Alla sidorna på webbplatsen ska ha innehåll
- Innehåll som måste finnas någonstans på webbplatsen är:
- En presentation av dig själv
- Ditt CV med utbildningar, arbetsplatser m.m. (precis som ett vanligt CV)
- En portfolio med projekt du gjort (du kan som minst lägga in dina skolprojekt men du kan även lägga till andra projekt)
- Det ska finnas minst en bild på sidan, gärna fler.
- Resterande sidor kan innehålla bara Lorem Ipsum-text eller så hittar du på något värdefullt så som kontaktuppgifter eller något annat som passar in på sidan.
- Din portfolio ska vara en lista av projekt med en rubrik och en bild samt en knapp besökaren kan klicka på för att få mer information.
- När knappen för mer information klickas på ska det dyka upp en modal-popup med lite mer information om projektet. Denna ska inte kräva JavaScript utan enbart byggas med HTML & CSS.
- Din sida ska i några delar av innehållet (eller allt innehåll) ha två eller fler kolumner.
- Din sida ska ha ett eller flera typsnitt som laddas in från en typsnittsfil eller från exempelvis Google Fonts.
- Sidan ska vara någorlunda anpassad för olika skärmstorlekar så det går att ta del av innehållet utan större problem både i en mobil och på en dator.
- Du ska skapa två påskägg (Easter eggs) på din webbplats som besökaren ska kunna hitta
- Ditt ena påskägg ska aktiveras av att användaren klickar på någon "udda" del av webbplatsen som man vanligtvis inte brukar klicka på. När denna del klickas på ska webbplatsens bakgrund bytas ut.
- Ditt andra påskägg ska aktiveras när användaren skriver in en kombination på tangentbordet, exempelvis "1337". När användaren skrivit in kombinationen på tangentbordet ska det komma upp något roligt meddelande i en modal-popup.
- Din webbplats ska vara kompatibel med moderna webbläsare och fungera rimligt bra i alla webbläsare som inte är äldre än tre år.
- Din HTML-kod ska vara någorlunda korrekt när det kommer till semantik (ex. ingen layout genom tabeller eller ologiska rubriknivåer) samt att du använder semantiska taggar som .
- Din CSS-kod ska skapa sidor som mycket väl anpassar sig utifrån olika skärmstorlekar (responsivitet)
- Du ska ha en CSS-print som gör att utskriften av CV-sidan blir snygg.
- Din JavaScript-kod får inte finnas inuti HTML-filerna.
- Dina påskägg ska fungera på alla sidor.
- Publicera din sida på Github Pages så att den blir åtkomlig via en länk.