- Jag ska göra en inriktning guide för de som går Teknik.
- Man ska kunna läsa om vilka kurser som hör till vilka inriktningar, vilka programfördjupningar som finns och vad det finns för teknikcollege kurser.
- Användarvänligheten och funktionaliteten är det viktigaste eftersom att man enkelt ska kunna använda webbsidan vem man än är.
- Kravspecifikation:
- ska: Sidan ska fungera bra på både en mobil och en dator.
- bör: Det bör vara med något slags JavaScript som tillför något till sidan, alltså att det inte bara är där bara för att.
- kan: Kan göra att den blir lite fin att kolla på om jag har tid i slutet.
- Planering:
- Jag ska först göra en skiss på hur jag vill att sidan ska se ut, vilket färgtemat det ska vara och vilka sidor och kurser som ska ingå.
- Sen ska jag börja koda sidan utifrån hur jag planerade.
- Sen ska jag testa sidan för mobilvänlighet, dess prestanda, användarvänlighet och validera koden.
- Sen ska jag göra de förbättringar som är nödvändiga så att sidan kan bli så bra som möjligt.
- Sen ska jag göra de testerna igen.
- För att få fram texter om kurserna så kommer jag att använda AI.
- Jag kommer att använda Materialize.
Vilka kurser som jag kommer ha med: Klicka här
- Det är så här som den ungefär ska se ut på datorn. Den ska vara lika dan på mobilen förutom att det ska vara en hamburgermeny istället för en sidenav.
Genomförande:
Det gick väldigt bra genom hela projektet, jag stötte inte på särskilt mycket problem. Det blev som jag hade tänkt mig att det skulle bli, så jag ändrade knappt på min första planering och idé.
Jag använde Pexels för att hitta de bilder som jag behövde. Men alla bilder som jag använde passar inte helt in i vad som står i texterna eftersom att det bara fanns ett begränsat antal gratis bilder.
Jag använde även imageresizer för att ändra storleken på bilderna så att de inte var större än vad som var nödvändigt, vilket påverkade prestandan på ett positivt sätt.
Jag använde Validator för att validera alla mina sidor och även min Css.
Det var inte några stora problem med min kod, så de problem som fanns var enkla att fixa.
Sedan kollade jag både prestandan och tillgängligheten med pagespeed.
På vissa av sidorna är prestandan inte jättebra, men jag kan nog inte eller vet inte hur jag ska göra för att förbättra det, så jag kommer att lämna det som det är. Tillgängligheten var det inga problem med.
Jag kollade mobilvänligheten med bing
Sidorna visar sig vara mobilvänliga, men så som det ser ut på bilden är inte hur det ser ut i verkligheten.
En sak som jag tyckte var lite krånglig var att textkorten att lägga sig rätt när man använde datorn. Det blev så som jag tänkte mig på mobilen, men på datorn så ville jag att det skulle ligga två textkort bredvid varandra istället för alla under varandra. Jag löste problemet med att lägga in de korten som skulle vara på samma rad i en och samma “row” och det textkortet som skulle vara själv under i en enskild “row”. Annars var det inte så mycket som var särskilt krångligt.
Jag tycker att slutresultatet blev väldigt bra och så som jag hade planerat. Det som jag är mest nöjd med är att sidan blir väldigt bra när man använder mobilen. Texten är inte för liten och det är lätt att navigera sig på mobilen.
Det gick bra att genomföra allt, men vissa delar var lite mer tidskrävande än vad jag först hade räknat med. De delarna som tog tid var alla tester som jag skulle göra flera gånger efter att jag hade ändrat på något. Jag hade inte från början tänkt på att det skulle ta så lång tid att göra testerna, så tills nästa gång ska jag ge mig själv lite mer tid till att göra alla tester. Allting tar generellt mycket längre tid att göra än vad man har förväntat sig att det ska ta.
Det som jag kan ta med mig till mitt gymnasiearbete är att jag ska ge mig själv mycket tid så att det inte blir stressigt i slutet.