Oblig 4 Webutvikling Oppgave 1 Lag din egen Wordpresssite der du tester ut CMSsystemet. Det å lage egne templates fra bunnen kan være noe komplisert, så det holder for dette prosjektet om dere modifiserer på en av de innebygde. Det letteste er om dere kjører Wordpress i deres egen lokale WAMP(/MAMP) server (JFR forelesninger eller utallige guides på nett). IKKE kjør på wordpress.com siden dette er en nedskalert versjon. Serveren ask.hiof.no gir dere heller ikke nok rettigheter til en god installasjon, så det må i såfall legges på en server dere administrerer. Siden dette er den eneste oppgaven i denne obligen forventer vi at det er gjort en god del rundt tilpassing av templates + innhold. Som alltid trenger dere ikke ha fornuftig innhold, men dere skal ha testet ut å fylle nettstedet med en god del innholdssider av ulike typer. Som et minimum skal dere teste ut minst en widget og en plugin (i tillegg til widget) som ikke følger med i pakka... NB! Innlevering består i å lage et notat der dere beskriver prosessen med å sette opp siten. Beskriv valg dere har gjort for å sette opp siden. Ha med skjermdumper av essensielle steg. Dere trenger altså IKKE levere den tenkiske løsningen. Lever som PDF. Merk at dere må dokumentere mens dere gjør ting. Altså ikke i etterkant. Det som ikke er helt standard i installasjonen skal også dokumenteres. (Svaret begynner på neste side!) 1/19
Svar oppgave 1 Installeringen Jeg lastet ned Mamp server fra http://mamp.info og installerte den. Jeg lastet ned en.zip fil fra wordpress.org, som inneholdt installasjonen til Wordpress, som er CMS systemet jeg velger å bruke i dette tilfellet. Kopierte mappen wordpress inn i htdocs mappa til Mamp serveren. Gikk inn på localhost:8888 som er siden for den lokale serveren, så startet jeg installasjonen av Wordpress Deretter gikk jeg inn på localhost:8888/phpmyadmin/ for å kunne administrere mine databaser, her la jeg til en ny database som skulle kobles opp mot Wordpress installasjonen. Jeg koblet wordpress systemet opp mot min lokale database og fullførte installasjonen ved å fylle ut diverse informasjon som for eksempel brukernavn, passord, side tittel osv. Deretter installerte jeg et ny versjon, med et annet navn, slik at jeg fikk et testsystem og et produksjonssystem. 2/19
Theme Det første jeg gjorde etter installasjonen var å laste ned noen forskjellige themes, for å se hvordan de forskjellige fungerte og hvordan de så ut. Da jeg hadde bestemt meg for en layout, begynte jeg å utforske de forskjellige valgene og instillingene som var med i den valgte layouten. I den layouten jeg gikk for (Twenty Eleven) var det flere ferdig programmerte instillinger som jeg kunne velge mellom, men det var kun en av dem som ble brukt, resten ville jeg ordne selv i CSS koden. o Sidebar på vesntre eller høyre side, eller ingen sidebar i det hele tatt. Jeg ønsket ikke å ha noen sidebar, så den ble fjernet. o Mørk eller lys side o Farge på linkene o Header hvilken farge skal være på teksten, hvilket bilde som skal ligge under headeren osv.. o Bakgrunn 3/19
Forandringer i CSS koden (Det som er markert gult, er det jeg har endret i koden.) Deretter begynte jeg å utforske koden for å få en liten forståelse for hva som tilhørte hva. Jeg begynte med å endre bakgrunnsfargen. Headeren var plassert til venstre, men jeg ønsket å ha den i midten. Menyen hadde en hover, slik at når jeg holdt musepekeren over menyen ble boksene hvite, jeg ville at de skulle ha en annen farge slik at jeg kunne kjøre en relativt lik stil på nettsiden. Kommentarboksen ville jeg også endre, da den ikke sto i stil med resten. 4/19
Sumbit knappen og fargen på teksten i den måtte også endres. Det siste jeg endret på i koden var størrelsen på den hvite boksen (content) som innholdet plasseres i. Ettersom jeg ikke har noen sidebar, ville jeg at content skulle være litt bredere enn hva den var. 5/19
Dette ble resultatet etter litt endring i CSS koden 6/19
Pages For å fylle nettsiden med litt mer informasjon valgte jeg å lage 3 forskjellige sider. Om oss Prosjekter Kontakt oss Dette gjorde jeg ved å gå inn på Pages og trykket deretter på Add New. Når jeg laget disse sidene, ble sidene lagt i alfabetisk rekkefølge i menyen, men jeg ønsket å ha det i en annen rekkefølge. For å endre dette måtte jeg inn på Pages, deretter holdt jeg musepekeren over en av sidene slik at det kom opp noen menyvalg, hvor Quick Edit var en av dem, trykket på Quick Edit og endret Order til den rekkefølgen jeg ønsket å ha sidene i menyen. Før: Etter: Når dette var gjort, begynte jeg å fylle sidene med Lorem Ipsum tekst og noen bilder for å få noe informasjon på sidene. Jeg valgte også å fjerne kommentarboksen på Om oss, Prosjekter og Kontakt oss sidene, dette fordi jeg ikke ønsker at det skal være noen funksjon som gjør at de kan kommentere eventuell informasjon på disse sidene. Dette gjorde jeg også på Quick Edit, der slo jeg av Allow Comments, deretter ble kommentarfeltet fjernet. Grunnen til at jeg fjernet kommentarfeltet fra kontakt oss siden, er fordi jeg ønsker at den siden skal inneholde et kontaktskjema som gjør at brukerne kan snakke direkte med firmaet, i stedet for at spørsmål og andre henvendelser skal være tilgjengelige for alle som besøker siden. 7/19
Plugin Jeg lastet ned en plugin som inneholdt flere forskjellige kontaktskjemaer, jeg ønsket å ha et av kontaktskjemaene på Kontakt oss siden. Når jeg hadde lastet ned denne plugin en fikk jeg opp et nytt valg i menyen til venstre. I denne menyen kan jeg administrere de forskjellige skjemaene som finnes i Contact Form Builder. Når jeg gikk inn på Manager, fikk jeg opp en liste med 10 forskjellige skjemaer som hadde hver sin ID, for å kunne implementere et av skjemaene på Kontakt oss siden, måtte jeg kopiere en kodesnutt og lime den inn i Kontakt oss editoren. 8/19
Det finnes egne innstillinger som hjelper deg med å få sendt informasjonen som blir skrevet inn i skjemaet til din mail. 9/19
Widgets Jeg lastet ned en widget som heter Opening Hours, som du kan legge til åpningstider på nettsiden på en enkel måte uten at du må kode noe som helst. Når nedlastningen var ferdig, aktiverte jeg widget en slik at den kunne tas i bruk. Etter aktivering fikk jeg enda et nytt valg i menyen til venstre, som inneholdt de innstilligene jeg kan endre på. Ved å gå inn på Opening Hours fikk jeg opp en liste fra mandag til søndag. Her kunne jeg enkelt endre åpningstidene og legge til eventuelle nye tider. 10/19
Etter å ha lagt inn åpningstidene, lagret jeg endringene, gikk inn på widgets under appearance. Ettersom layouten jeg bruker har tre forskjellige footer områder, valgte jeg å legge Opening Hours under Footer Area One. Jeg ville også legge til en kalender ved siden av åpningstidene, kalenderen ble lagt i Footer Area Two. Det siste jeg ville ha med var noen sosiale medier ikoner, slik at brukerne skjønner at siden også er koblet opp mot sosiale medier. For å få disse ikonene, lastet jeg ned en widget som heter Social Icons Widget. Når jeg aktiverte den og la den til i Footer Area Three fikk jeg opp en lang liste med mange forskjellige ikoner som jeg kunne koble opp mot en link. 11/19
Resultatet etter å ha lagt til tre forskjellige widgets, ble footeren slik: 12/19
Gamle Eksamensoppgaver Oppgave E.1 Hvordan tolker du påstanden om at "god SEO ofte gir god tilgjengelighet, og at god tilgjengelighet ofte gir god SEO"? Gi også eksempler i svaret ditt. Svar oppgave E.1 Jeg tolker det slik at dersom siden din er optimalisert for søkemotorer på en god måte, vil du som regel havne på topp 5 av relevante søkeresultater (til din side). Men du trenger ikke ha god SEO for å være tilgjengelig, dersom siden din er populær og ofte blir besøkt vil det også ha en innvirkning på hvor siden din havner på Google for eksempel. 13/19
Oppgave E.2 Hvilke konkrete råd om sikkerhet vil du gi til de som skal sette opp og drifte et CMS? Begrunn rådene med hvilke trusler de skal motvirke der det er nødvendig. Svar oppgave E.2 Først og fremst er det viktig at CMS systemet oppdateres fortløpende når det kommer oppdateringer til det. Dette fordi at det som regel blir oppdaget et sikkerhetshull i systemet, og dersom du ikke oppdaterer jevnlig vil ditt system kunne bli utsatt for hackerangrep ettersom ditt system kan inneholde et sikkerhetshull. Moduler og plugins bør ikke installeres fra alle kilder, du bør være kritisk til det du tenker å installere, gjør litt research å se hva andre sier om den modulen eller plugin en du ønsker å installere. Ikke la hvem som helst få tilgang til ditt CMS system eller admin tilgang til nettsidene dine. Dersom det blir mange som har tilgang kan det skje ting du ikke hadde forventet. Med admin tilgang kan du kaste ut andre brukere akkurat som du vil, det kan skje at faktisk du blir kastet ut av systemet, og skjer det får du aldri tilgang igjen. Derfor er det viktig at du rydder opp i brukere som har tilgang til systemet. Husk å bytte passord ofte, og lag avanserte passord slik at andre ikke kan gjette seg til passordet ditt. Når du installerer CMS systemer er det viktig at du har to installasjoner, en for testing og den andre for produksjon. Dermed kan du teste ut forskjellige widgets og plugins og se at de virker før du legger de ut på den offentlige siden din. Enkelte widgrets og plugins kan nemlig krasje hele systemet ditt, noe som hadde vært utrolig synd hvis du hadde lagt mye arbeid i siden din. Rediger navnet på adminsiden slik at det ikke er åpenlyst at dette er adminsiden din. 14/19
Oppgave E.3 a) For hvilke grupper brukere (en vid definisjon av ordet) ønsker vi å øke tilgjengeligheten når vi snakker om tilgjengelighet og websider? Svar som en punktliste. (Dette blir selvsagt ikke noen absolutt og endelig liste, men få med de viktigste) Svar oppgave E.3 a) Svaksynte / blinde Tunghørte Bevegelseshemmet Eldre mennesker og barn Dyslektikere Kognitiv svikt Strandsurfere Slitne Søkemotorer som for eksempel Google Alkoholpåvirkede Motorikk Språk (kognitive funksjonshemninger) Maskinvare/Programvare o Gammelt utstyr o Utradisjonelt utstyr (nettlesere, OS osv.) Andre enheter o Mobil, tab, TV, bilnett osv. 15/19
b) Hva er WAI i forbindelse med tilgjengelighet? (Her er det ikke hva forkortelsen står for som er det viktige, men hva som ligger i begrepet) Svar oppgave E.3 b) WAI (Web Accessibility Initiative) er en standard som utviklere følger for å tilrettelegge siden slik at tilgjengeligheten er optimal. Denne standarden har tre nivåer, hvor det laveste er A, så er det AA og det strengeste er AAA. Den går også på tre forskjellige grupper, nemlig de som lager innholdet, de som lager verktøyet for å lage innholdet med (wordpress, dreamweaver, joomla) og de som lager verktøy for å lese innhold med. 16/19
Oppgave E.4 Gi en mest mulig presis forklaring på hva et CMS er. Hvilke fordeler og ulemper ser du ved å benytte et CMS for henholdsvis utviklere og sluttbrukere? Svar oppgave E.4 CMS systemer er en publiseringsløsning som gjør det lettere for både utviklere og sluttbrukere å redigere innhold på en eller flere nettsider. Eksempler på slike CMS systemer er Joomla og Wordpress. Fordeler ved bruk av CMS systemer: CMS systemer er publiseringsverktøyet som blir benyttet av utviklere hver eneste dag og som stadig er under utvikling. Det er enkelt å redigere innhold. Du slipper også å betale store summer til IT konsulenter du eventuelt kunne hatt, som driftet siden din. Sikkerheten mot hacking er høy, grunnet den jevnlige utviklingen av systemet, men må oppdateres jevnlig allikevel. Flere utviklere og designere spesialiserer seg til å utvikle og designe templates og maler til CMS systemer. Ulemper ved bruk av CMS systemer: For å kunne redigere malene eller designet, må du kjenne til php, css og html. Det finnes flere plugins og widgets som kan krasje hele systemet ditt, du må derfor være kritisk til hva du installerer. Dersom du ikke oppdaterer systemet jevnlig, kan det være at det er et sikkerhetshull i systemet som hackere kan dra nytte av. 17/19
Oppgave E.5 Norge følger etter en rekke land og innfører nå lovgivning som skal sikre universell utforming av bl.a. nettsider. (http://lovdata.no/dokument/sf/forskrift/20130621732) For oppgaven er 1,2,4,6,7 og 11 spesielt interessant. Se bort i fra det som står ang. automater. a) Hva tror du blir den nye lovens innvirkning på norske utviklere og brukere på kort og lang sikt. Svar fra et teknisk vinklet perspektiv. b) Det Norge her gjør er lignende det flere land alt har gjort eller står på trappene for å gjøre. Hva tror du betydningen blir for standarder og verktøy/teknologi i et større perspektiv. (Du kan gjerne svare på a og b sammen, men la det gå frem hva som hører til hvilken vinkling av spørsmålet) Svar oppgave E.5 a) Når disse lovene trer i kraft vil det bli en hektisk tid for utviklere, nettopp fordi det vil bli en stor etterspørsel på kort sikt, etter utviklere som kan re designe og oppdatere nettsiden til eventuelle firmaer som ikke følger de kommende kravene til nettsider. Men denne etterspørselen vil jo ikke vare lenge, for så fort nettsidene er redesignet og oppdatert er jo ferdig, da er jobben gjort og nettsidene fyller kravene. Det positive ved at disse lovene trer i kraft, er at alle nettsiden vil være tilrettelagt for alle typer mennesker, ikke bare de som kan se og høre, men også for de som ser dårlig og/eller hører dårlig og de som har andre spesielle behov. Nettsidene vil bli mer brukervennlige og tilgjengelige for alle. Men hva vil dette ha å si for utviklerne? Utviklerne vil kunne dra nytte av de nye lovene av den grunn at de nå vil kunne ha en standard å forholde seg til. Men noen må kanskje lære seg nye ting for å kunne følge disse standardene, men det alltid være nye ting å lære. 18/19
Svar oppgave E.5 b) Jeg tror at den fremtidige teknologien og verktøyene vil bli mer og mer tilgjengelige og tilrettelagt for alle typer mennesker, slik at det vil være enklere for mennesker med spesielle behov å bruke datamaskiner og annen teknologi. Om noen år vil det kanskje være lettere for mennesker med nedsatt funksjonsevne å få jobb i for eksempler IT avdelinger eller i andre typer jobber hvor mye blir styrt av datamaskiner og annen teknologi, av den grunn at teknologien er bedre tilrettelagt. Ved å tilrettelegge teknologien slik at den passer for alle mennesker, vil være moralsk riktig. Og når det gjelder internett, kan bedrifter nå flere kunder ved at nettsiden deres er tilrettelagt slik at alle kan navigere seg på den og forstå hvordan siden fungerer. Samtidig vil det kanskje bli utviklet andre programmer som gjør det letter for både utviklere og brukere å holde seg til standarden og holde nettsidene oppdatert i ettertid. 19/19