Logo Camilla Borgos
Menu button

webkoding

Gjennom IT1 på videregående og et emne i bachelorstudiet har jeg grunnleggende kunnskap i HTML, CSS og JavaScript. Her vises prosjekter hvor jeg har kodet selv, som inkluderer denne porteføljen.

portefølje

introduksjon

Designprosessen av egen portefølje har vært et prosjekt hvor jeg måtte få enkelhet til å passe med et personlig preg, og kunne strukturere ulike deler konsekvent for å skape en helhet. Porteføljen skal speile meg og mitt arbeid på en attraktiv måte ovenfor en potensiell arbeidsgiver, altså et blikkfang. De to første rundene ble designet noe rotete, og jeg fikk ikke helt ro med fargepaletten i ettertid. Den siste versjonen er en helomvending og gir et roligere uttrykk. Disse versjonene viser også en utvikling gjennom bachelorstudiet.

kontraster

Målet med siste versjon var å minimalisere bruk av ulike farger, og det ble heller supplert med underlinjer for å signalisere lenker i tekst. Dette gjør at designet ikke oppleves brutt opp. Alle knapper har samme design og utforming så det er tydelig hvor man kan forvente å kunne trykke.

designløsninger

Porteføljen inneholder en stor mengde bilder, og dette er viktig å samle på en ryddig måte for alle skjermstørrelser. Valget falt derfor på å lage et slide-galleri. Mine grunnleggende kunnskaper i JavaScript holdt til dette designet, selv om funksjonene måtte kopieres. Dette skyldtes at parameterne ikke ville fungere. Jeg står for å "eie" sin egen kode, og når dette lå utenfor mitt kompetansefelt falt valget på å duplisere og heller endre listenavn. Bildene er også i samme størrelse for å bevare layouten når man bytter mellom bildene, som er endring fra tidligere versjoner hvor dette skapte uro.

kodestruktur

Det er lagt et fokus på å samle så mye kode som mulig og minske antallet kodelinjer. Mappestrukturen er gjennomtenkt til hva som vises i url. Jeg har også fokusert på bruk av semantiske tags og kommentering for å forenkle endringer senere og lesbarheten for andre interesserte. All CSS er strukturert etter mobil først, da det er lettere å ekspandere enn motsatt.

goal 13 - skoleprosjekt

introduksjon

Dette skoleprosjektet var avsluttende oblig for å få ta eksamen i Webkoding. Her hadde vi fått en grunnleggende innføring i HTML og CSS, og skulle bruke dette til å bygge en hjemmeside for en bestemt målgruppe omhandlende bærekraftsmål 13. Min målgruppe var alder 14-16 år.

design

Jeg fokuserte mye på å levere på alle punkter, her skulle vi tenke på bærekraft under valg og eventuelt omgjøring av bildeformater, mengden farger og størrelse på bildene. En side for ungdommer er mest appellerende ved bruk av farger i mange tilfeller, men jeg valgte et gjennomgående istid-tema. Her kunne jeg minimere mengden farger, og heller bruke en film som er veldig populær i den aldersgruppen, som virkemiddel til å lese.

universell utforming

Hele veien overholdt jeg kontrastverdier samt å designe så universelt som mulig. Nettsiden ble sjekket med Lighthouse som ga 100% score på SEO, accessibility og "best practices". Dette var noe vi ble vurdert mest etter inkludert kodestruktur og semantikk i koden, ikke nødvendigvis brukergrensesnittet. Vi hadde også et krav om å lage layout til ulike skjermstørrelser, så her hadde jeg mobil, ipad og pc med ulik layout. Her fikk jeg god erfaring med mobil-først prinsippet.

vurdering

Siden dette var et avsluttende prosjekt, hadde vi kun ett forsøk på å møte alle krav for oppgaven. Dette var alt fra å ikke repetere CSS til å bruke semantiske tagger riktig. Prosjektet ble godkjent med gode tilbakemeldinger. Hele prosjektet er mulig å se gjennom selv via knappen under.

se webside