Superskolernes kampagne

Transkript

1 Superskolernes kampagne Projekt i Kommunikation/IT Roskilde Tekniske Skole Side 1 af 12

2 Indhold Indledning... 3 Målgruppeanalyse - Kanylemodel... 4 Begrundelse for valg af medie... 5 Grovskitsering... 6 Endelig hjemmeside... 6 Kommunikationsteorier... 7 Interaktionsdesign... 7 Gestaltlove... 7 Teknologier... 8 HTML-typer... 8 HTML-tags... 8 DOC-typer... 9 Ophavsret, plagiat og etikette Konklusion Bilag Brugertest Side 2 af 12

3 Indledning Dette projekt er lavet som mit afsluttende projekt i Kom/IT på 1. år af HTX. For elever der ikke skal have kom/it de næste 2 år er dette en eksamen. Opgaven er at vi skal lave et produkt i form af en brochure, plakat, hjemmeside eller anden form for kommunikatorisk design, der skal fortælle om de nye Superskoler, som vil blive indført i Jeg har valgt at lave en hjemmeside, da jeg synes det er en god måde at formulere meget information på, og da dette skal fungere som noget nyt, og ikke-før-set er der dermed meget information. Side 3 af 12

4 Målgruppeanalyse - Kanylemodel Afsender: Regeringen og de nye skoler. Indkodning: Html-side - her er alle informationer, om alt hvad der er værd at vide. Der er også en quiz, så alle kan blive fordelt på skolerne. Budskab: At bevise overfor folk at det er en god ide at centralisere skolerne. Eksempel er hospitalerne Støj. Hvem kan være imod det: Hippier, de gamle og sundhedsmennesker. De kan være imod at alt bliver digitaliseret og komme med modkampagner. Afkodning: Blikfang. Den skal ikke være so alle andre. Der skal være noget nyt. Ikke kun læsning, men også spil el. Lign. I vores tilfælde; quiz. Virtuel firewall: Ekstraordinært Modtager: Målgruppen er både unge og voksne. Voksne i den forstand at det er dem der sætter deres børn af sted i skole. Unge fordi de skal videre til f.eks. Gymnasie osv. Effekt: Vi har ikke fået noget feedback Side 4 af 12

5 Begrundelse for valg af medie Vi har valgt en html-hjemmeside, da jeg mener det er den bedste måde at formidle meget information på. Derudover er det også fremtiden, så hvis vi hat tænkt så meget på miljøet at vi har samlet skolerne, skal vi også tænke på vores papir-forbrug. Derfor også en grund til ikke at lave en brochure. man husker også en hjemmeside bedre end en brochure, for hjemmesiden er der hele tiden, mens man hurtigt får smidt en brochure væk, og glemmer den. den vigtigste grund jeg havde til at lave en hjemmeside, var at jeg ville afprøve det nye HTML5 og CSS3, som jeg aldrig havde arbejdet med før. Der er mange forskelle fra HTML 4.1 og HTML5, som har lavet meget om på mange ting, men også har gjort at jeg har brugt CSS en langt mere, hvilket har gjort at min html-kode er langt mere overskuelig. Side 5 af 12

6 Grovskitsering 1. Dette var den første skitse, som også endte med at blive den vi gik mest ud fra. Ideen i den er at menuen er ude i siden er sat til fixed, som også skulle gælde for header en, bortset fra at den selvfølgelig er i toppen. I midten skulle der være et tekstfelt hvor der skulle komme opdateringer, med hvordan både hjemmesiden og forløbet i al almindelighed gik. I højre side ville der være links til andre steder på siden sat op som reklamer. 2. Anden skitse som vi også gik ud fra ligner den anden rimelig meget bortset fra at der nu er hover-menuer, så det bliver mere overskueligt, og så er reklamerne ude til højre fjernet. 3. Ideen med 3. skitse var ligesom nr. 2, forskellen værende at flytte menuen til toppen, men stadig med hover-funktionen, og dermed ha det størst mulige tekstfelt. Det var heller ikke meningen at nogle af tingene skulle være fixed. Denne blev droppet da der ville blive for meget spild, og mente det ville være bedre altid at have adgang til menuen. 4. Kopi af nr. 2, men i stedet for et tekstfelt er det et kort over Danmark, hvor der er links i Århus, Odense og København, der fører til info om hver skole. Dette startede med at være denne der var forsiden, men blev senere lavet om til skitse 1/2 da forsiden blev utrolig kedelig, med kun et kort. Kortet blev derfor flyttet til en under-side. 5. I denne var der to menuer, hvor den ude i siden var hvad der ville ha stået i hoverundermenuen fra skitse 2., som så først ville være der når man gik ind under over-menuen. Alt andet er som skitse Ingen menuer. Kun header og kortet. Dette design var bare upraktisk på alle måder. Det ville være besværligt at komme ind til andet indhold, og så ville den bare være utrolig kedelig. Endelig hjemmeside Den endelige hjemmeside er sat sammen af skitse 1 og 2. I toppen er header en som er et konstant link til forsiden. Ude i siden er der et GIF-billede som henviser til de vigtigste steder på hjemmesiden. Henholdsvis info om skolerne, og optagelsesquizzen. Det er forskelligt hvilken reklame der er, alt efter hvilken side du er på. I midten er der et tekstfelt, hvor der kommer opdateringer om hvad der sker. Dette startede med at være et kort over Danmark, som forklaret ved skitse 4. Alle tre ting er sat til absolute så de ikke rykker med ned på siden. Til venstre er menuen. Den er sat til fixed så der altid er adgang til den. Holder man musen over Superskolerne kommer der mulighed for at gå direkte ind under info om hver skole. Side 6 af 12

7 Kommunikationsteorier Interaktionsdesign Hjemmesiden er sat op som træstruktur, men med få forbedringer. En ulempe ved træstrukturen var at der skulle bruges mange museklik for at komme til de forskellige sider, men pga. undermenuer og reklamer i siden er det hurtigere og nemmere at komme rundt på denne hjemmeside. Var faktisk i tvivl om hvilken struktur jeg skulle vælge da jeg ikke mente nogle af dem passede 100 procent på hjemmesiden. Da den blev lavet blev der mest gået ud fra at den bare skulle være så brugervenlig og nem som mulig. Gestaltlove Dermed har jeg også brugt gestaltlove. Den første der blev brugt var loven om lighed. Man kan nemt se forskel på links, da de står med en meget speciel skrift i forhold til resten af teksterne der er på hjemmesiden. Desuden bliver alle links understreget når man holder musen over, men for ikke at forvirre brugeren er der ikke andre effekter ved links ne. Derudover bliver loven om lukkethed brugt i den forstand at tekstfelt og menu-boks er lukket inde i hver sin boks, mens de samtidig er to forskellige bokse. Menu-boksen har fået skygge så man kan se at der er lidt til forskel mellem de to bokse. Side 7 af 12

8 Teknologier HTML-typer Der findes 2 overordnede HTML-typer. HTML og XHTML. HTML står for HyperText Markup Language og er den officielle standard og er grundlæggende hvis man vil lære at kode hjemmesider. Der har været 7 udgaver af HTML i tidens løb. HTML HTML HTML 2.0 HTML 3.2 HTML 4.0 HTML 4.1 HTML5. HTML 4.1 har været standarden siden 1999, og er det stadig. HTML5 er nemlig først lige udviklet, og det er ikke alle dens attributter der bliver understøttet af browserne. Ideen med HTML5 var at forøge brugen af CSS, og formindske muligheden med at opsætte layoutet af hjemmesiden igennem HTML-koden. Dette har gjort at mange attributter der var i HTML 4.1 ikke længere er understøttet i HTML5. I processen med denne hjemmeside besværliggjorde det mange ting i processen en del. Man får hurtigt en meget længere CSS-kode, men til gengæld blev HTML-koden langt mere overskuelig. XHTML er en udvidelse af HTML. I XHTML skal man holde meget øje med hvad det er man laver, og se efter at alle ting hænger ordentligt sammen. F.eks. skal man huske at afslutte alle attributter: <br> er attributten til at lave linjeskift i HTML 4.1. I XHTML skal det se sådan her ud <br />. I HTML5 er HTML 4.1 og XHTML sat sammen, så reglerne fra XHTML nu gælder i det normale HTML. HTML-tags HTML-tags er det mest grundlæggende og på alle måder vigtigste når man skriver i HTML. Tags er hvad der fortæller browseren hvad den skal gøre. Der findes hundredvis af tags, så for at gøre det nemmere fortæller jeg i stedet om de tre tags som har været vigtigste på hjemmesiden der er lavet. <div> er et tag jeg brugte rigtig meget, da det klart er den nemmeste og smarteste måde at designe og sætte både tekst og billede op. Sammen med <div> tagget bruger man id til at tildele hver <div> tag et navn, så det kan bruges flere gange. <meta> er kort sagt information om HTML-dokumentet. Det er ikke noget der fremstår på hjemmesiden, men kun ses i koden. Der findes flere undermenuer i meta. På denne hjemmeside er der blevet brugt: description, hvor man skriver hvad hjemmesidens titel er. keywords, hvor man skriver søgeord til hjemmesiden, som kan hjælpe folk med at finde lige præcis din hjemmeside, når de søger noget specielt. author, hvor man skriver hvem der har lavet hjemmesiden. Dette kan være rigtig god reklame. revised bliver omskrevet hver gang der er lavet ændringer på siden. Der skrives hvem der har lavet ændringerne og hvornår. Til sidst er der meta charset, som er en af de vigtigste ting på en hjemmeside. Her definerer man hvilket tegnsæt der bruges på hjemmeside. Side 8 af 12

9 Skriver man f.eks. dansk skriver man iso , da det er dette er tegnsættet der indeholder Æ, Ø og Å. Men charset er blevet droppet i HTML5, så nu skrives tegnsættet som det første sammen med hvilken xml-version man bruger. <map> er et billede hvor man kan lave områder med links på. På den måde kan man nøjes med et enkelt billede, og det bliver ikke nær så uoverskueligt som hvis man skulle sætte flere billeder oven på hinanden, for at der kom links til byer, eller andet, på et kort. Udover map tagget skal man bruge area for at kunne fortælle browseren hvor områderne med links skal være. Dette defineres med pixels, som tælles fra kanten af billedet. DOC-typer I HTML 4.1 defineres dokumentet af en doctype, som er noget af det første der bliver skrevet i koden, medmindre man skriver i XHTML, da dette dermed så vil være det første man skriver i dokumentet. Man kan vælge at skrive tre forskellige ting i doctype. strict DTD, er det mest almindelige da dette er den man bruger når man koder almindeligt. Transitional DTD, bruges hovedsageligt nå det gælder ældre browsere, og når man bruger attributter som <font>. Den sidste er frameset DTD som kun bruges når man laver selve frameset et. Ikke til resten af dokumentet. Men alt dette kan faktisk være fuldstændig lige meget, da det ikke skal skrives i HTML5. Grunden til dette er at browseren selv kan regne ud at det at der bruges strict. Transitional bruges nemlig slet ikke mere, da der ikke længere er ældre browsere, og frameset-attributten er droppet helt i HTML5. Side 9 af 12

10 Ophavsret, plagiat og etikette Imens hjemmesiden blev lavet var jeg konstant opmærksom på ikke at lave plagiat eller andet lignende. Det største problem var danmarks-kortet, som skulle bruges til at vise hvor skolerne lå. For at have noget at gå ud fra, fandt jeg et kort på nettet, som blev skiftet ud senere. Efter noget tid blev der gjort det at tegne efter kortet, som jeg dermed regnede med ville være i orden, men fik senere at vide dette var et direkte plagiat. Dette var dog så sent i processen at der ikke er blevet gjort noget ved det. Men der er blevet gjort rede for hvad der skulle gøres om for at det var i orden, og stadig gratis. Kortet der er blevet brugt til at tegne efter var et i forvejen tegnet kort og dermed tilhørte det nogen. Havde man i stedet gået ind på krak, el. lign. Og tegnet efter der, ville det have været et satellit-billede, og dermed i orden. Dette er det eneste der er i strid med loven, så vidt kendt, på denne hjemmeside, og på viderebygningen af den kan dette hurtigt laves om. Side 10 af 12

11 Konklusion Projektet gik generelt godt. Jeg fik lavet en flot hjemmeside, hvor jeg lærte en masse nye ting og afprøvet en del samtidig. F.eks. arbejdede jeg med HTML5 og CSS3, som kun lige er blevet offentliggjort. Dette synes jeg generelt var rigtig spændende, og jeg synes også at det er en god udvidelse, da det sætter de 2 ting sammen på en helt ny måde, og det retter mange gamle fejl fra HTML Projektet har dog heller ikke været problemfrit, da jeg halvvejs igennem mistede mit gruppemedlem, og derfor blev der nødt til at blive prioriteret, og alle undersiderne blev ikke udfyldt med tekst, og tidsplanen røg dermed også ud, og er derfor ikke med. Men med de problemer jeg havde synes jeg det endte godt ud med både produkt og rapport. Dog blev den planlagte plakat droppet, da dette var min partners område. Side 11 af 12

12 Bilag Brugertest Brugertesten blev desværre aldrig gennemført pga. tekniske problemer. Spørgeskemaet der skulle være delt ud blev dog lavet: Fik du den info du gik efter? Ja Nej Ville du have vidst mere. Hvis ja, hvad? Havde du nemt ved at finde den info du ville? Ja Nej Hvad synes du om hjemmesiden i al almindelighed? Skal der laves ændringer. Hvis ja, hvilke? Har hjemmesiden gjort dig interesseret i at vide mere? Ja Nej Side 12 af 12