Min landing-page i Google Chrome på en mobil:

Min landing-page i Google Chrome på en surfplatta:

Min landing-page i Microsoft Edge på en mobil:

Min landing page i Microsoft Edge på en surfplatta:

Testresultaten:

Testresultaten visar att min landing-page inte är mobilvänlig. Länkar och knappar är tillräckligt stora och touchvänliga och zoom är tillåten vilket är bra. För att göra den mer mobilvänlig skulle man lägga till <meta viewport> vilket gör att sidan anpassar sig till skärmstorleken.

Uppdatering:

Jag lade till <meta viewport….> och testade sidan med testverktyget igen och nu fick jag bättre resultat.

Åtgärder

• Ändra om formatet till WebP
• Ändra själva skalan på bilden
• Komprimera bilderna

RESULTAT:

Efter att ha komprimerat och ändrat format på bilderna och även skalan så har prestandan ökat en del vilket indikerar att de förslag på åtgärder jag angav ovanför fungerade. Det var dock en bild jag inte kunde ändra formatet på då man behövde betala extra så den bilden hoppade jag över vilket är en av anledningarna till att prestandan inte blev tillräckligt hög för att klassas som bra.

Resultaten:

2 av 3 tjänster påpekar laddningstiden och alla tre sidor påpekar sid storleken.

Åtgärder

• Minska storleken på bilderna så att sidan laddar snabbare.
• Ändra om bilderna till WebP eller AVIF format då de laddar snabbare.

Efter komprimering av koden så gick prestandan upp lite men inte alls mycket vilket säger i sig att prestandan beror på större faktorer än ”tomrum” mellan kodraderna. Exempelvis kan det vara bildstorlekar, sådana saker som gör att sidan laddas långsammare.