Högskolan i Borås. Solveig Betnér 820211-2028. Webbredaktörsprogrammet distans Projekt: webbplatsutveckling 15 hp V11 (31RPW1)



Relevanta dokument
Högskolan i Borås HT10 Webbredaktörsprogrammet distans Formgivning av webbsidor. Projektarbete Solveig Betnér

Högskolan i Borås HT10 Webbredaktörsprogrammet distans Grafisk produktion för webb och tryck. Projektarbete Solveig Betnér

Sociala medier för företag

Avstämning med Referensgrupp Sprint 11 lnu.se + Mina saker

Frågor och svar - Diagnostisk prov ht14 - Webbutveckling 1

Användarmanual för Content tool version 7.5

FÅR JAG GIFTA MIG MED VEM JAG VILL?

Laboration 3 i kursen Produktion för tryckta medier och webb: Webbplatsproduktion med ett publiceringssystem

GRATIS FÖR PRENUMERANTER

MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR

Bloggdesign { ALEXANDRA 299:- 359:- Lilla Designpaketet. Designpaketet Mellan. Prislista: Designpaket

Projektplan för Website Project Japan

Webbsida i Wordpress. Existens på webben och bli sökbar

Att skriva för webbplatsen. Stöd för webbredaktörer

Manual

MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR

Att skapa en webbplats

Klarspråk på nätet - Webbredaktörens skrivhandbok av Karin Guldbrand & Helena Englund Hjalmarsson

Ungas internetvanor och intressen 2015

Övning (X)HTML 2. Sidan 1 av

Manual för nya hemsidan. Grundläggande funktioner för lagledare

Slutrapport Uppdrag 1 Introduktion till UX-produktion. Johanna Lundberg Finnsson HT2016

Del 1 och 2 HTML/CSS. Webbutveckling Laboration 1 Nicklas Bostedt

Webbsidekurs för nybörjare

MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR

Lathund för webbpublicering på Vi Ungas distriktswebbplatser

Skapa Bufblogg

Valet 2010 på facebook!

Hemsida. Lathund för medlemsföreningar. Funktioner för medlemsföreningar på hemsidan. Syfte med medlemsföreningens sidor

Uppdateramera. Tio tips för en bättre webbplats. PRODUKTIONSBYRÅ AB. 1 Krokedil Produktionsbyrå AB

Starta din försäljning med hjälp av sociala medier

[Innehåll] Sida 2, Sida 3 - Persona Sida 4, Sida 5 - Persona Walk-Through Sida 6 - Reflektioner

3. Skapa sida 5. Hitta innehåll 6. Meny 7. Användare

HANDLEDARE: Jonny Pedersen Datum: (Detta skrevs i November 09)

HANDLEDNING TILL WEBBUTSTÄLLNINGEN HEM, LJUVA HEM - OM BROTT I NÄRA RELATIONER

ANVÄNDARBESKRIVNING FÖR PERSONAL

Blogga med wordpress. Lina Tannerfalk Wiberg

RAPPORT. Vad har du fått för reaktioner på din konsert? Leader Bergslagen Box Skinnskatteberg Besöksadress: Kyrkvägen 7

Steg-för-steg-guide så lånar du en e-bok på en dator!

Värderingsövning -Var går gränsen?

Projektrapport. Magnus Krantz Oscar Berggren Olof Hammarberg Daniel Kreivi. Diverse slutsatser i relation till ursprungligt projektplan

Publicera på sodrastation.org

Wordpress och Sociala medier av Sanna Ohlander Guide till hur du skapar och förändrar inlägg och sidor på staffanstorp.se

Lägga till bild i e- handeln

Instruktioner. Innehåll: 1. Vad är Kimsoft Control (SIDA 2) 3. Hem (SIDA 2)

Publicera material i Learn

Valet 2010 på facebook!

Att arbeta med. Müfit Kiper

Riktlinjer och tips för facebookgrupper Erikshjälpen Second Hand

Sammanfattning från Stormötet med skolorna 14 april

Människa-Dator Interaktion

Nya sundbyberg.se. Webbkoncept. v1.0, Sundbyberg där staden är som bäst

PROJEKTRAPPORT GRUPP 10

Definition av svarsalternativ i Barn-ULF

12 Webb och kurshemsidor

Wordpress och Sociala medier av Sanna Ohlander Guide till hur du skapar och förändrar inlägg och sidor på staffanstorp.se

Bättre webb för barn och unga!

Scio. en liten användarguide. Skriven av: Josefine Siewertz

Hemsida. Lathund för medlemsföreningar. Funktioner för medlemsföreningar på hemsidan. Syfte med medlemsföreningens sidor

Wilhelms mamma Rosa kommer in och säger att det finns kaffe och tårta. Tårtan är från dagen innan då Wilhelm hade födelsedagsfest.

Kom igång med utbildningen bättrevardag.nu!

Snabbkurs i Wordpress för IOGT-NTO

Vem lånar e-böcker från bibliotekens hemsidor? Sammanställning av elibs webbenkät på bibliotekens hemsidor.

Projektplan Magasinet

Frågor och svar Gränssnittsdesign/Webbutveckling

Om rapporten. Direkt effekt PostNord

Kom-igång-hjälp för hemsida & e-butik. Praktiska tips för hur du lyckas med innehåll, design och sökmotoroptimering.

Gmail, kalendern och Google dokument. Här lär du dig att skicka

lär dig söka och publicera på världens största videocommunity!

Umgås på nätet KAPITEL 6. Chatta via webbläsaren

PROSPEKT MEDIAS HANDBOK

Inledning. Innehåll. Inledning

Vilken version av Dreamweaver använder du?

Installera din WordPress med 9 enkla steg

Kommunikationspolicy samt Grafisk profil för Kungsbacka Ridklubb

Musik bland dagens ungdomar

Bidrag till tävlingen Bästa vara

Analys av com hems startsida

Word-guide Introduktion

Hur man lägger upp och redigerar dokument i Typo3.

Projektrapport. Projekt - Anna Broström Keramik

Nöjdhetsmätning bland besökare på parklekar, mötesplatser, träffpunkter och ungdomens hus i Skärholmen.

Manual för webbpublicering. Enköpings kommun

INDIVIDUELL INLÄMNINGSUPPGIFT

Användarmanual för webbapplikationen Fejjan för alla. Manualens version:1.0. Datum: 5 februari 2014

Vem är vi? Magnus Äng

Sociala medier för företag

Ungdomsfullmäktige Göteborg 07/10/17

Systerskap för att främja unga tjejers hälsa. Återrapportering från en enkätundersökning med tjejer som deltagit i Tjejzonens Storasysterverksamhet

Kommunala fritidsledare online. Av: Jens Eriksson, koordinator Skarpnäcks folkhögskola

Tekniska prylar leder till gräl i de svenska villorna

Sida 1 av 7. Slutrapport. ULVIS Unga Lär Vuxna Internet på eget Språk. Uppsala den 4 december Serbiska Kulturföreningen Sloga

Innehållsförteckning Inloggning: Allmänna inställningar hur du ändrar utseende och språk samt navigerar i menyn högst upp i bildkant.

KULTUR OCH FRITID Ung i Gävle

Kravspecifika.on, pappersprototyp & CSS

Annonsprodukter Kamrat.com Oktober

Lathund för att publicera på SAKs webbplats för användare i lokalföreningar.

1 Mötet öppnade Lina öppnar mötet! 2 Val av mötesordförande Mötet väljer Olivia till mötesordförande.

ANVÄNDARMANUAL FÖR WORDPRESS

Kom igång med FrontPage 2003

Transkript:

Högskolan i Borås Solveig Betnér 820211-2028 Webbredaktörsprogrammet distans Projekt: webbplatsutveckling 15 hp V11 (31RPW1)

Innehållsförteckning Sammanfattning 4 Bakgrund 4 Kursen 4 Rapporten 5 Valet av projekt 5 Tjejjouren Juventas systrar 5 Min kontakt 6 Upplägg 6 Ambitionsnivå 6 Syfte 7 Uppdraget 7 Önskemål 7 Utseende 7 Funktioner 7 Sidor 8 Problemanalys 8 Walkthrough 8 Text och design 8 Länkning och url:er 9 Problem som ska lösas 9 Möjligheter och vägval 9 Konkurrenten 9 Skissering 10 Målgrupp 10 Tillvägagångssätt 10 Enkätsvar 11 Fritid 11 Intressen 11 Övrigt 12 Slutsats av enkäten 12 Analys 12 Människorna 12 Uppgifterna 13 Tekniken 13 Sociala aspekter 13 Persona 13 Malin 14 Scenario 15 Scenario 15 Grafisk profil 15 Nuvarande material 15 2

Färger 15 Färgschema 16 Typsnitt 16 Utformningen av webbplatsen 16 Funktioner 16 Enkät 17 Sociala medier 17 Tillänglighet 17 Design 17 Bilder 18 Navigationsmöjligheter 18 Tekniska lösningar 18 Programmering 19 Sökmotoroptimering 19 Validering 19 Trycksaken 20 Kommunikation med uppdragsgivaren 20 Vecka 1 20 Vecka 2 21 Vecka 3-4 21 Vecka 5 21 Vecka 6-8 22 Hur gick det? 22 Planeringen 22 Problem 22 Ambitionsnivån 23 Min roll som webbredaktör 23 Källförteckning 24 Bilagor 25-28 3

Sammanfattning Projektrapporten tar i början upp bakgrund kring kursen Projekt: webbplatsutveckling (15 hp) och information om organisationen jag utvecklat webbplatsen åt samt syfte. Önskemål från organisationens sida följs av en problemanalys av deras tidigare webbplats och rubriken Möjligheter och vägval. En utförlig del om målgruppen finns i rapporten och den delen innehåller bland annat persona och scenario. Avsnittet om organisationens grafiska profil följs av en beskrivning av hur webbplatsen utformades. Rubriken Trycksaken beskriver hur en folder utformades åt organisationen och efter den finns en del av kommunikationen med uppdragsgivaren beskriven. Sista avsnittet innehåller tankar kring hur projektet gick. Bakgrund Kursen Den sista kursen i Webbredaktörsprogrammet distans (120 hp) är Projekt: webbplatsutveckling (15 hp) som går ut på att skapa en riktig webbplats åt en riktig organisation. Även en trycksak skall skapas och en rapport skrivas. Detta är rapporten som redovisar och för en diskussion kring projektets alla delar. 4

Rapporten Denna rapport syftar till att redogöra och analysera genomfört projektarbete. Jag tänker mig också att min uppdragsgivare kan dra nytta av rapporten. Det är hon som kommer jobba mest med webbplatsen när mitt uppdrag är slutfört och kanske ser nya sätt att redigera innehållet. Jag tror att det kan vara bra för mig att kunna gå tillbaks till denna rapport vid funderingar i början av mitt yrkesliv inom webb. Valet av projekt Jag ville att mitt projektarbete skulle vara betydelsefullt. I mitt framtida yrkesliv önskar jag att jobba med sådant som känns moraliskt rätt. Jag vände mig därför till Volontärbyrån 1 i sökandet efter projektarbete. Där fann jag att tjejjouren Juventas systrar i Södertälje behöver en ny webbplats. Tjejjouren Juventas systrar Tjejjouren Juventas systrar är en ideell, partipolitiskt- och religiöst obunden verksamhet inom föreningen Brottsoffer- Kvinno- och Tjejjouren i Södertälje, Salem och Nykvarn. Syftet är att stärka tjejers självkänsla och på ett respektfullt sätt stötta och möta tjejerna. Tjejjourens mål är att få tjejer att känna att de är värdefulla och har en plats i samhället, att motarbeta våld mot tjejer och att få tjejer att lita på vuxenvärlden. Ytterligare mål är att förebygga psykisk ohälsa hos tjejer och arbeta med att medvetandegöra och förändra begränsande attityder hos ungdomar kring jämställdhetsfrågor. 1 http://www.volontarbyran.org/ 5

Tjejjourens verksamhetsidé är att erbjuda stöd till tjejer som har funderingar eller problem som de behöver prata med någon om. De har också en utåtriktad verksamhet som erbjuder systerskap, gemenskap och andra sammanhang med syfte att stärka tjejer. Verksamheten utgår från de mänskliga rättigheterna och barnkonventionen och bedrivs till största delen av volontärer. Min kontakt Gabriella Nilsson är anställd som verksamhetsansvarig för Tjejjouren Juventas systrar. Det är henne jag haft kontakt med under arbetets gång. Gabriella har fört vidare idéer från volontärer som arbetar för tjejjouren till mig. De idéer jag skickat till Gabriella har hon även spridit till jourtjejerna som gett mig respons. Upplägg Arbetet delades upp i fem faser enligt Projektboken av Martalla & Karlsson (1999) och ett arbetsprocesschema (bilaga 1) arbetades fram innan det praktiska arbetet påbörjades. I vissa av rapportens delar hänvisar jag till en vecka följd av en siffra. I rapporten är veckorna numrerade från vecka 1 till 9. I arbetsprocesschemat finns denna siffra inom parentes under det riktiga veckonamnet. Ambitionsnivå Min ambition var att göra en bra webbplats åt tjejjouren Juventas systrar. Tiden jag valde att lägga ner utgår ifrån hur mycket tid jag faktiskt hade möjlighet att disponera på detta. I början fick projektet ganska lite tid på grund av eftersläpning i tidigare kurser med utökning av tid i senare skede. Jag skulle dock ändå säga att min ambitionsnivå var ganska hög då jag ville att uppdragsgivaren skulle bli helt nöjd. 6

Syfte Uppdraget Juventas systrar ville ha en ny mer modern webbplats som passar verksamhet och målgrupp. Gabriella vill att tjejjouren i Södertälje ska få bort stämpeln som något negativt. Den positiva och utåtriktade verksamheten ska lyftas fram. Mer interaktivitet önskas som Gabriella själv vill sköta. Därför läggs sajten i Wordpress som hon tidigare jobbat i. Då kan hon själv gå in och redigera innehållet utan att behöva gå in i koden. Uppdragsgivaren behövde en ny folder om tjejjouren. Den gamla foldern är inte enhetlig med den nya webbplatsen och innehåller inte webbadressen. Önskemål Utseende Tjejjouren önskade sig en ljus och positiv webbplats som känns ungdomlig och modern. Tjejer som besökt jouren har tillfrågats av den verksamhetsansvariga. Jag fick en lista på webbplatser de gillar som jag hämtade inspiration ifrån: www.machofabriken.se www.101tillsammans.se www.tjejjouren.se www.tyttojentalo.fi/fi/etusivu/ Tjejjourens ansikte utåt är deras logotyp samt en affisch (bilaga 2) skapad av serietecknaren Lina Neidestam. De önskade att jag för över delar från affischen till webbplatsen. Funktioner Det ska vara lätt för den som arbetar på tjejjouren att redigera text på webbplatsen. De villa att den skulle läggas i Wordpress. Tillgänglighet för funktionshindrade ska finnas. Ett annat önskemål är en webbenkät. 7

Sidor Jag fick en lista över specifika önskemål över vilken typ av innehåll olika sidor ska ha. Här är förslag på rubriker från tjejjouren: Önskesida Sponsorsida Stöd och pepp Kurser hos oss Kalender Om oss Kontakt Månadens ord/pepp eller liknande Länkar Panik-knapp, dvs. att de kan lämna sidan snabbt. Problemanalys I Fas 1 sökte jag uppdragsgivarens problem. Jag gick igenom deras nuvarande webbplats, en så kallad Walkthrough. 2 Walkthrough Text och design Många texter skulle kunna förkortas utan att vara mindre informativa. Textstorleken är inte enhetlig. I Texten Om oss ändras storleken mitt i texten. På sidan Kontakta oss är viktig information placerad längst ned på sidan. Jag tror inte att den gamla webbplatsen talade till målgruppen. Jämför jag med andra tjejjourers webbplatser är det stor skillnad på färg, form och uttryck. Det kändes inte genomtänkt hur alla element var placerade. 2 Föreläsning: Maurin Söderholm & Lassi, 2011. 8

Länkning och url:er Länkning till sidans top fanns på varje sida, även de sidor med lite innehåll som man överblickade utan att behöva bläddra nedåt. När jag klickat mig vidare från startsidan till en annan sida och vill tillbaks till start fanns det ett alternativ bortsett från att klicka på webbläsarens bakåt-knapp. Längst ner i huvudmenyn fanns länken hem. Denna bör finnas högt upp. Många besökare förväntar sig också att man kommer tillbaks till start genom att klicka på logotypen (Van Duyne, Landay & Hong, 2007, s. 639). Undersidornas url:er var inte bra för sökmotoroptimeringen. Klickade du t.ex. på Systerskap såg url:en ut så här: http://www.juventassystrar.se/?page_id=56. Att ett ord förekommer i adressen kan ha betydelse för rankingen i en sökmotor. Dessutom ser besökaren vad sidan innehåller om man till exempel använder sidans titel i url:en (Wackå s.88). Problem som ska lösas Viktigt och bra innehåll fanns där men var överflödigt. Designen var inte målgruppsanpassad. Möjligheter och vägval Konkurrenten I Södertälje finns en till mötesplats för tjejer som kallar sig Tjejhuset. När Gabriella visade deras folder var det för att visa att så vill de inte att deras trycksak ska se ut. Jag ser den foldern som flickaktig och barnslig, inte riktad till ungdomar. Tjejhusets webbadress som finns på deras folder leder inte till något innehåll överhuvudtaget. Tjejhuset är nog inget större hot för Juventas systrar. 9

Skissering Den första skissen jag gjorde handlade om att få uppdraget. Jag tänkte att fler kanske hade anmält sitt intresse att göra tjejjourens webbplats och jag ville verkligen ha detta uppdrag. Efter att jag fått mail från Gabriella med länkar till webbplatser de gillar skissade jag spontant ett förslag (bilaga 3). Det blev en high-fidelity prototype (Van Duyne, Landay & Hong, 2007, s. 85) för att jag ville visa hur mina tankar rörde sig. Jag fick positiv respons. Jag förstod vad de var ute efter. Mer om det under rubriken Design. Min andra skiss är en bild över hur olika element skulle kunna placeras (bilaga 4). Jag valde att göra en medium-fidelity-prototype för att fokus inte skulle hamna på färg och formgivning. Tjejjouren var nöjd med denna skiss. Därför valde jag att utgå från denna och inte göra någon mer skiss utan att ett behov uppstod. Mina val av elementens placering förklaras under rubriken Utformningen av webbplatsen och underrubriken Design. Målgrupp Tillvägagångssätt För att lära känna besökarna av Juventas systrars webbplats behövde jag ta reda på vilka uppdrag de går dit för att utföra. Jag använde mig av egen erfarenhet, samt Gabriellas erfarenheter inom hennes uppdrag och en enkät som utförts av henne till unga kvinnor i Södertälje kommun. I Van Duyne, Landay & Hong (2007) s. 52 beskrivs fyra kategorier med olika frågor som kan hjälpa mig att lära känna de tänkta användarna av webbplatsen jag skapar. Dessa kategorier är människorna, uppgifterna, tekniken och sociala aspekter. Denna analys kan du läsa efter delen om enkätsvaren. 10

Enkätsvar Gabriella påbörjade en undersökning i våras. En enkät delades ut till tjejer i årskurs 8 och gymnasieår 1 i Södertälje kommun. I åttonde klass tillfrågades 80 tjejer och av gymnasieklasserna tillfrågades 16 stycken. Dessa enkätsvar samt Gabriellas beskrivning av tjejjourens målgrupp är underlag för mitt skapande av en persona. I stycket nedan har jag sammanställt det som jag anser mest relevant i skapande av persona. Fritid Den fritidsaktivitet som dominerar i hela tillfrågade gruppen är att lyssna på musik. Detta gör de flesta av tjejerna varje dag. Att surfa och chatta på Internet är också en vanlig aktivitet på fritiden bland denna grupp. Att umgås med vänner hör till de flesta av tjejernas vanliga aktiviteter. Övriga fritidsaktiviteter som många sysslar med är idrott, läxläsning och att hjälpa till hemma. Det som skiljer sig mest är att de äldre tjejerna hjälper till mer hemma än de yngre. En fråga i enkäten handlade om hur ofta de tillfrågade befinner sig i Södertälje centrum och vad de sysselsätter sig med där. De flesta av åttondeklasserna är i Södertälje centrum en till fyra gånger i månaden och det som dominerar är att shoppa, fika eller hälsa på vänner. Bland gymnasietjejernas svar är det samma aktiviteter som dominerar. De flesta av dem befinner sig dock i Södertälje centrum flera dagar i veckan. Intressen En fråga i enkäten handlade om vad tjejerna är intresserade av. Foto är ett stort intresse både bland åttondeklassarna och gymnasietjejerna. Bland de äldre dominerar idrottsutövning följt av att skriva och foto som tredje populäraste intresse. De som går i åttan har foto som största intresse på förstaplats, följt av idrott, dans samt rita och måla. 11

Övrigt Enkäten visar att en stor del av de tillfrågade önskar en biograf i Södertälje. Även andra ställen och arrangemang för ungdomar önskas. En stor del är dock nöjda med aktiviteterna som finns i Södertälje. Många har gett ett osäkert svar. Ungefär hälften av enkätens svaranden kände till Juventas systrar sedan tidigare. Mer än hälften av de tillfrågade kan tänka sig att vända sig med problem till tjejjouren. I gruppen med tjejer i åttonde klass vill de flesta ha stöd genom chatt eller mail. Många i den äldre gruppen vill också ha stöd på detta sätt men här är också personligt möte ett populärt alternativ. I gruppen med gymnasietjejer var svaren ganska varierande hur man ville ha kontakt med en tjejjour. Telefonkontakt var också ett vanligt svar. Vilka problem som tjejerna upplever var också en fråga i enkäten. Ångest/oro och deppigheter var de två vanligaste svaren här. Slutsats av enkäten Enkäten gav mig mycket hjälp till analysen som följer under nästa rubrik. Analys Människorna Besökaren av Juventas systrars webbplats identifierar sig som tjejer. Målgruppen är 13 till 21 år men de flesta som kontaktar jouren är 16 år. Den största delen är studerande. Populära intressen i gruppen är foto och idrott. När det gäller vad de gör på fritiden är det dock inte dessa intressen som dominerar. Det är mest Internetanvändande, att lyssna på musik och umgås med vänner som sysselsätter tjejerna. De är vana datoranvändare och är nog aktiva mobilsurfare. Den största delen av gruppen försörjer inte sig själva. De bor hemma med minst en förälder. En del av målgruppen hjälper till med hushållssysslor i hemmet ibland på fritiden. Jag tänker mig att det är Södertäljes smala utbud av fritidsaktiviteter som gör att intressen och fritidssysselsättningar skiljer sig åt. Tjejer med attityd, säger Gabriella om de som kontaktar tjejjouren. 12

Uppgifterna Målgruppens uppgifter i vardagen är att klara skolan och ha en betydelsefull fritid. Tjejerna besöker Juventas systrar för att få hjälp med något problem, prata med någon eller kolla om det är aktiviteter på gång. Tekniken Datorer och mobiltelefoner används flitigt av målgruppen. Sociala aspekter Det kan ju vara känsligt att besöka en tjejjour för att få hjälp med ett problem. Tjejerna tar hänsyn till vilka människor som rör sig runtomkring dem när de surfar på webbplatsen. Persona Min persona är skapad utifrån enkät, analys och verksamhetsansvariges beskrivning av målgruppen med utgångspunkt från hur Redish (2007) beskriver skapandet av en sådan på s. 19-24. 13

Malin Så fort jag är vid en dator kollar jag min Facebook. Man vill ju se vad folk gör o så. Malin Lundberg är 16 år och bor i Södertälje kommun. Hon avslutar snart sitt första år på gymnasiet. Studierna bedriver hon på ekonomiprogrammet. Det framtida yrkesvalet är hon osäker på men tror att det alltid är användbart att vara kunnig inom ekonomi. Malin, hennes mamma och mammans pojkvän bor tillsammans i en lägenhet. Malin bor hos sin far varannan helg. På fritiden träffar hon gärna vänner. De umgås gärna i Södertälje centrum där de ofta shoppar eller fikar. Vardagskvällarna ägnar Malin gärna framför datorn där hon mest chattar på Msn eller Facebook. Irritation kan uppstå när hon inte finner det hon söker snabbt på en webbplats. Ibland upplever Malin stress på grund av pressen att hänga med i sociala medier. Musik är viktigt för henne så hon har Spotify i sin Smartphone. Hon surfar även mycket på mobiltelefonen. Juventas systrar besökte Malins skola i höstas. Hon tycker det är bra att det finns en grupp som fokuserar på tjejer eftersom det alltid är killar som får mest uppmärksamhet. Malin har besökt tjejjourens webbplats för att ställa frågor som hon inte vill fråga någon annan om. Hon är också nyfiken på kursutbudet och vad tjejjouren gillar just nu. 14

Scenario För att testa om min uppbyggnad av webbplatsen fungerar fantiserar jag ihop scenarion för min persona. I mitt scenario utgår jag från personans egenskaper (Van Duyne, Landay & Hong, 2007, s. 54). Scenario Malin fick en folder av tjejjouren i skolan idag. Malin är nyfiken på vad en storasyster är eftersom hon inte har några syskon och känner sig ensam ibland. Hon är osäker på var hon ska klicka för att hitta den information hon vill ha. Hon väljer att klicka på Kontakt. Där finns inte så mycket information men det finns en länk att klicka sig vidare om man vill veta mer om kontakten med Juventas systrar. Där klickar Malin. Där kan hon läsa om vad det innebär att ha en storasyster hos tjejjouren. Hon vill dock fundera lite på saken innan hon mailar. Grafisk profil Nuvarande material Uppdragsgivarens grafiska profil bestod av en logotyp som är röd och svart (bilaga 6). De använder sig även av en affisch (bilaga) skapad av serietecknaren Lina Neidestam. Det är den de identifierar sig mest med just nu och ville att jag utgick ifrån den i jobbet med webbplatsen. Tjejjourens logotyp har fått en annan färg på affischen men Gabriellas önskan var att Logotypen är röd på webbplatsen. Färger Jag tycker det är ett problem att tjejjouren använt en annan färgskala till affischen än att utgå från deras logotyp. Det blev en diskussion kring vilken färg logotypen ska ha 15

på webbplatsen och om jag skulle ändra färg på bilderna så att det fungerar ihop. Den grafiska profilen känns spretig. Jag utgick från färgerna i tjejjourens affisch för det känns rätt att det är enhetligt. Då kunde inte logotypen vara röd. Det blir icke-funktionellt och mottagaren kan bli förvirrad av motstridiga färgsignaler (Bergström, 2007, s. 256). Färgschema Typsnitt En sans-serif bör används, alternativt en antikva som är anpassad för webb. Texten kan bli grötig när en antikva används för skärmanpassat material eftersom texten ofta är ganska liten (Bergström, 2007, s. 135). Typsnittet som används här i rapporten är en sans-serif. Efter diskussion med Gabriella väljer jag Arial för brödtexten på webbplatsen. Samma typsnitt använder jag i foldern för enhetlighetens skull. Till serierutor används typsnittet Comic sans för att det ska passa ihop med övriga serierutor. Utformningen av webbplatsen Funktioner Tjejjouren kan själva gå in och ändra i olika delar. Huvudinnehållet är lätt att ändra och styla. 16

Enkät Uppdragsgivaren önskade sig en enkät. Jag valde att inte bygga den själv utan använde mig av tjänsten SurveyMonkey för att spara tid. Användaren klickar sig vidare till den webbplatsen där enkäten finns för att svara på frågor. Sociala medier Jag anser att det bör vara självklart att länka till Facebook på webbplatser idag. Troligtvis använder målgruppen Facebook mycket. Juventas systrar har en Facebook-grupp och den är det tydligt länkat till. Tillänglighet Den största delen av den viktigaste texten är svart och mycket viktig information upprepas så tror jag att tillgängligheten är bra (Redish, 2007, s.152). I vissa delar är texten rosa mot vit bakgrund vilket inte är så bra eftersom det är viktigt med kontrast för läsbarheten, men som tidigare nämnts så upprepas mycket viktig information på olika ställen så det fungerar ändå. Webbplatsen bör finnas på flera språk, framförallt engelska. Detta hör dock inte till uppdragsgivarens prioriteringar därför får det ske i ett senare skede. Detta kan ju också tjejjouren själva göra. Användaren kan förstora texten genom att klicka ctrl och plustecken (pc) eller kringla och plustecken (mac). Alla kanske inte vet om det så det vore bra att ha en länk till att förstora texten tydligt på webbplatsen (Redish, 2007, s. 148). Design I placeringen av olika element på webbplatsen inspirerades jag mycket av tjejjouren.se. Det är snyggt och tydligt när olika innehåll är placerat i lådor med luft i mellan. Den stora tydliga rubriken på varje sida är placerad där många förväntas hitta det som användaren vill läsa först (Van Duyne, Landay & Hong, 2007, s. 641). 17

Bilder Jag arbetar fram en banner med logotyp och delar av affischen. Jag använder Adobes program Photoshop och Illustrator till detta. Navigationsmöjligheter De viktigaste delarna är placerade så att man inte behöver bläddra nedåt om man har en liten dataskärm. Här utgick jag från en 13 tums skärm. Klickar man på bannern kommer man tillbaks till start. I bannern finns logotypen och enligt undersökningar förväntar sig många att komma till startsidan när de klickar på logotypen (Van Duyne, Landay & Hong, 2007, s. 639). I övre delen av sidan är det också förväntat att man ser en huvudmeny som visar webbplatsens sidor. Tekniska lösningar Det blev mycket läsande om Wordpress på deras webbplats. Många problem löstes den vägen men också genom att hitta andra forum genom webbsökning. Under den 8:e veckan, två dagar innan projektet skulle lämnas in fick jag ett stort problem. Jag kunde inte logga in i Wordpress. Efter att ha mailat och skrivit i forum utan resultat efter ett dygn skaffade jag ett nytt wordpresskonto. Jag sparade phpfiler innan jag tog bort wordpress-filerna från min webbserver så det gick ganska smidigt trots att jag blev tvungen att göra om vissa moment. Många element på min webbplats visas frekvent på alla sidor, men några ska bara visas på vissa sidor. Att hitta en lösning på detta jobbade jag mycket med. Ett försök vara att göra en till stilmall som skulle användas på alla sidor utom start, men det lyckades jag inte med. I detta läge hade jag inte mycket tid att jobba med att få det att lyckas så jag lade specifika stilregler i en ny header. Jag hittade också php-kod för att hämta innehåll från specifika sidor i Wordpress. 18

Programmering Jag utgick från de filer som redan fanns i Wordpress när jag installerat det. Jag utgick från ett tema och redigerade några av filerna. Mycket innehåll som fanns från början har tagits bort. Vissa delar som tjejjouren själva ska kunna ändra ska inte vara placerade i content, den stora rutan i mitten, med huvudinnehållet för varje sida. Jag har använt en phpfunktion för att kalla på innehåll till olika element på webbplatsen. Jag har också använt custom fields i Wordpress som jag också kallat på med php-kod. Sökmotoroptimering Både sidans titel, taggad som <title> och sidans huvudrubrik, taggad som <h1> har stor betydelse för att lyckas i sökmotorer (Wackå, 2009, s. 78-81). Enligt Wackå (2009) är titeln den mest betydelsefulla delen i detta sammanhang. Först hade jag titeln Juventas systrar men ändrade det till Tjejjouren i Södertälje med tanke på att alla som söker efter dem troligtvis inte vet att de kallar sig Juventas systrar. Mellanrubrikerna, taggade med <h2> och <h3> har ju också betydelse (Wackå, 2009, s. 78-81). Url:en har betydelse för hur man hamnar i en sökmotor (Wackå, 2009, s. 83) men också beskrivningen av webbplatsen. Detta är enkelt för alla att tänka på i Wordpress. Validering Jag har en macintosh-dator och testade min webbplats i webbläsarna Firefox och Safari. Detta fungerade bra. Jag fick hjälp av en pc-användare att kontrollera sajten på en sådan dator i olika webbläsare. Jag blev tvungen att ändra på ord- 19

mellanrummet i menyraden från måttenheten em till px, samt lägga till en css-regel i filen header-other.php för att inte bottom-content skulle synas på alla sidor utom startsidan. Jag testar webbplatsen i w3c:s validator. Det blir 7 errors. Jag tror inte att dessa fel har betydelse för jag kan själv inte hitta dem och det syns inte i någon webbläsare. Trycksaken Jag beslutade mig för att göra en liten folder som är smidig att lägga i fickan. Gabriella tyckte att det var bra att den gamla foldern var så pass liten. I övrigt så är den gamla foldern inte enhetlig med webbplatsen och Linas affisch. En dubbelvikt folder valde jag dels för att Gabriella gillar den utformningen och det blir inte så mycket text så betraktaren tycker att det är för mycket. Här tänker jag som med webbtexterna, att det ska vara lätt att överblicka texten (Redish, 2007, s.191). För bilder, se bilaga 5. Tyvärr blev det ett tryckfel från tryckeriet. Kommunikation med uppdragsgivaren Min kontakt med tjejjouren skedde mestadels via e-mall med verksamhetsansvarige Gabriella Nilsson. Hon har i sin tur visat mina förslag för hennes medarbetare på tjejjouren. Diskussioner och beslut som kommunicerats mellan mig och Gabriella delar jag upp veckovis. Vecka 1 Efter min intresseanmälan till annonsen i Volontärbyrån fick jag ett mail med några önskemål. Ett möte bokades in mellan oss. Jag åker till Södertälje och träffar Gabriella tisdagen den 26 april. Det är projektets femte vecka. 20

Vi mailade en del fram och tillbaks angående färgerna i Linas affisch. Det kändes som att vi var överens om att det bästa vore att få Linas affisch i gråskala. Annars bör färgen i logotypen ändras så den passar ihop med Linas bilder alternativt använda andra bilder. Detta diskuteras men Lina verkar vara svår att få tag på. Vecka 2 En skiss på förslag till hur webbplatsens element kan byggas upp har mailats (se bilaga 4). Gabriella visade förslaget för sina medarbetare. De är nöjda med förslaget men vill få in en ruta med en enkät så att tjejerna lätt hittar den. Vecka 3-4 Här var det inte så mycket kontakt. Jag mailade några skisser och förslag och fick positiv respons. Vecka 5 Jag åkte till Södertälje för ett möte med Gabriella. Efter mötet fick jag med mig en del att jobba vidare med. Jag fick en liten folder som de vill förbättra. Detta blev min uppgift, att skapa denna trycksak. Eventuellt blir det fler trycksaker beroende på tid. Jag fick även en folder från en konkurrent till Juventas systrar och en folder från tjejjouren.se. Den sistnämnda ville de gärna att jag inspireras av och använder samma format. Jag gillar också tjejjouren.se:s folder och inspirerades även av deras webbplats i utvecklandet av Juventas systrars sajt. Gällande textproduktionen till webbplatsens innehåll mailade Gabriella mig kontinuerligt de texter som skulle visas på sajten. Texterna redigerades av mig. Gabriella önskade att webbplatsen ska vara mer interaktiv. Ett förslag från henne var att man ska kunna se vad tjejjouren gillar på startsidan, t.ex. ett You tube-klipp. Jouren är också på gång med en blogg och det bör finnas en länk till den på startsidan. 21

Vecka 6-8 Här handlade kontakten mycket om texterna till webbplatsen. Hur gick det? Planeringen Det blev lite brett uppdelat, att bestämma att en hel fas skulle vara klar åt gången. Detta med tanke på bland annat kommunikationen. Material som jag hade behov av var inte alltid tillgängligt i tid. Jag tycker ändå att det känns okej att de flesta delar i fas 1 var färdiga vid satt deadline. Att jag sedan gick tillbaks till vissa delar under arbetet med nästa fas kändes okej. Hade jag arbetat med fler än mig själv i webbplatsutvecklingen hade det nog varit bra att lagt upp fler deadlines och delat upp faserna i olika delar. Problem Den svåraste delen för mig var att arbeta i Wordpress. Mycket tid gick till att lösa problem. En annan del som tog upp mycket tid var bildredigering. Ett samarbete med illustratören som utformat bilderna jag arbetat med hade underlättat mycket. Förbättringar för webbplatsen Bakåtknappar Enkät där fler svar än 100 kan lämnas in Val av språk, först och främst engelska Klicka på en länk för att få större text Mobiltelefonanpassat Gul ruta med beskrivning kommer upp när man är över en länk Länka till oss. Bilder man kan ladda ner. Pressmaterial Drop-down-meny eller liknande för att minska text-innehållet på enskilda sidor. 22

Ambitionsnivån Jag tror att Juventas systrar är nöja med min prestation och därför anser jag mitt mål som uppnått. Däremot vill jag gärna jobba vidare med webbplatsen och lägga till de förbättringar jag listat ovan. Min roll som webbredaktör Jag har kunskap om hur man utvecklar en bra webbplats och borde varit mer bestämd. I min första kontakt med tjejjouren kunde jag ha gett mer konkreta riktlinjer om vilka uppgifter de måsta utföra själva och vilka tider som måste hållas. 23

Källförteckning Bergström, B. (2007). Effektiv visuell kommunikation : om nyheter, reklam och profilering i vår visuella kultur. Stockholm: Carlsson Marttala, A & Karlsson, Å. (1999). Projektboken: metod och styrning för lyckade projekt. Lund: Studentlitteratur Redish, J. (2007). Letting Go of the Words: Writing Web Content that Works. San Francisco: Morgan Kaufmann Van Duyne, D. K., Landay, J. A. & Hong, J.I. (2007). The Design of Sites: Patterns for Creating Winning Web Sites 2nd edition. Upper Saddle River: Prentice-Hall Wackå, F. (2009). Webbredaktörens handbok: skapa värdefullt innehåll för webb och intranät. Stockholm: No Digit Media AB Wedin, Å., Lundin, K., Westman, M. & Ehrenberg-Sundin, B. (2008). Att skriva bättre i jobbet: En basbok om brukstexter. Stockholm: Norstedts Juridik. Rapporten färdigställd: 2011-05-26 24

Bilaga 1 25

Bilaga 2 26

Bilaga 3 Bilaga 4 27

Bilaga 5 Bilaga 6 28