Web pages are visited through a variety of different devices with varying screensizes. One method for adapting web pages to this variety is called responsive design. Geographical information, often in the form of embedded maps, is common on the web. The combination of responsive design and geographical information has been shown to lead to interaction problems and is therefore assumed to need special considerations. This thesis examines this combination and investegates how presentation of geographical information can be adapted to responsive web design.

Idag kommer det hela tiden nya enheter, alla med olika egenskaper, med möjlighet att koppla upp mot internet. Därmed blir det allt svårare för webbdesigners att anpassa webbplatser för användarens behov och förutse i vilken kontext användaren brukar webbplatsen. Syftet med studien var att undersöka hur webbutvecklare kan implementera flexibilitet för webbplatser, för att webbplatsen ska passa de olika enheterna, genom responsiv webbdesign. Vidare undersöks också hur användare upplever en webbplats utvecklad med responsiv webbdesign.Studien omfattar utvecklingen av en prototyp som också har används som grund för användartestning och kvalitativa intervjuer. Användartestningen omfattade test på en webbplats utvecklad med fasta mått samt testning av den responsiva prototypen.

This report describes the process of developing a user-friendly and responsive archive website. The website is a Hi-fi prototype and was created for the company JG Communications, to serve as an archive for their customers? style guidelines. To create this website I have used HTML5 and CSS3 to make it responsive for various computer screens. I have also used PHP and some JavaScript to make some of the functions and Adobe Photoshop and Illustrator to make design elements for the prototype.

I det här examensarbetet har jag undersökt vilka aspekter som behöver beaktas vid utformandetav en webbplats med Responsiv design samt se hur användandet förändras utifrån de nyakontexter som den responsiva designen medför. Jag försöker besvara detta genom att själv tafram den responsiva utseendet för en publikationsdatabas på Skolverkets webbplats. Projektetkan delas upp i två huvudsakliga delar. Under den första delen har jag undersökt användandetav publikationsdatabasen genom att analysera data från Google Analytics samt genomföraintervjuer och utvärdering av desktopgränssnittet tillsammans med användare. Den andra delenfokuserade på att testa de responsiva designen i praktiken genom ett iterativt designarbete, däranvändarnas feedback samlades in via användbarhetstest av skisserna och prototyperna.Resultatet från studien visade att övergången till en Responsiv design innebär att fokus måsteskiftas från att enbart förbättra användarupplevelsen i respektive enhet till att se den responsivadesignen för de olika gränssnitten som ett gemensamt användande.

Idag anva?nds den smarta telefonen i allt sto?rre utstra?ckning fo?r att surfa pa? Internet. Problemet med att surfa i den smarta telefonen a?r att den mindre ska?rmytan ger begra?nsade mo?jligheter att rymma alla funktioner hos funktionsrika tja?nster. Fo?r att lo?sa detta utvecklas det flera lo?sningar fo?r en och samma tja?nst.

Användandet av enheter med varierande skärmstorlek för att surfa på webbsidor ökar. Webben är således under en ständig förändring. Ansvariga för en webbsida måste därmed bestämma hur de ökade kraven som dessa olika enheter ställer ska kunna tillgodoses. Genom att använda sig av HTML5, CSS3 samt Responsive Web Design kan en webbsidas design på ett önskvärt sätt anpassas efter enhetens skärmstorlek. Denna uppsats syftar till att ge riktlinjer för att förenkla den migrationsprocess som en designer av en webbsida förr eller senare måste ta ställning till för att kunna hantera olika enheters skärmstorlekar.

Att göra webbsidor tillgängliga för olika sorters enheter är ett område som har uppstått i och med smartphonens utveckling. Mängden enheter har under de senaste åren ökat stort och det är inte längre endast laptops och datorer som används. Då enheternas skärmupplösning skiljer sig krävs en anpassning beroende på enhet för att ge en bra användarupplevelse. För att identifiera tillgängliga tekniker har en kvalitativ undersökning genomförts. Undersökningen består av en genomgång av utvald litteratur samt intervjuer med utvecklare på företagen Nethouse och Laget.se utförts.

Denna uppsats beskriver utvecklingen inom projektet att skapa en redesign av en intranätmall till företaget Circuit i Stockholm. Denna intranätmall representerar de intranät som företaget producerar och används för att sälja in intranät till nya kunder. På grund av att många uppdateringar och nya funktioner tillkommit i de senaste intranäten som levererats vill företaget uppdatera sin intranätmall och som en del i arbetet skapa en ny design till den. Det som levererades inom projektet var slutgiltiga Photoshopskisser med syftet att beskriva designen i detalj, samt påbörjad kodmässig implementering i front-end med hjälp av ramverk för Responsiv design..

I stort sett vartenda företag och organisation har idag en webbsida för att nå ut till sina kunder. I dagsläget krävs det lite mer än att endast anpassa webbsidorna efter datorer eftersom användandet av smartphones ökar både upp och ned i åldrarna för varje år som går. 2013 var året som responsiv webbdesign slog igenom ordentligt men redan år 2010 förklarades begreppet av grundaren Ethan Marcotte. Responsiv webbdesign innebär att en webbsida är plattformsoberoende och anpassar sig beroende på vilken enhet som används.IT-branschen växer ständigt och möjligheten att nå framgång i mjukvaruprojekt är fortfarande ganska låga. Det är bland annat medvetenhet om kritiska framgångsfaktorer som är anledningen till att fler och fler IT-projekt blir lyckade.Syftet med denna kandidatuppsats i ämnet informatik är att identifiera och beskriva kritiska framgångsfaktorer som bör beaktas vid utveckling av en responsiv webbdesign.En kvalitativ undersökning i form av fyra intervjuer har genomförts i kandidatuppsatsen.

Idag besöker vi inte längre webbplatser enbart via datorer, utan även mobiltelefoner och surfplattor. För att göra interaktionen på en webbplats användbar via flera olika plattformar blir det allt vanligare med responsiv anpassning. Denna utveckling ställer högre krav på den grafiska formgivaren som bör ha god kunskap om de plattformar som designen tillämpas på för att nå högsta möjliga användbarhet. En grafisk formgivare ska alltså förstå vad användbarhet innebär och hur denna kunskap ska tillämpas i designen. Kandidatarbetet undersöker vad som definierar användbarhet och vad grafisk design bidrar till i skapandet av responsiva webbplatser.

Östgötatrafiken är ett länstrafikbolag i Östergötland och har idag en hemsida, en mobil hemsida och appar. De har sett att användningen av deras mobila hemsida och deras appar har ökat. För att skapa en bättre användarupplevelse samt för att minska de underhålls- och utvecklingskostnader som kommer med många system är en responsiv hemsida ett bra alternativ för dem. En responsiv hemsida innebär att ett system anpassar sig efter den skärmstorlek som den enhet som används har. Vad som visas och hur det visas beror på om det är en dator, en mobiltelefon eller en surfplatta som används.För att skapa en modern och innovativ hemsida valdes att fokusera på den mobila upplevelsen och att designa systemet för mobiltelefonen först.

På vilka sätt kan ett företag profilera sig och vad kan effekterna komma att bli? Hur uppfattas ett företag vid en drastisk imageförändring? Denna rapport går igenom skaparprocessen över en re-design av en webbsida och framtagning av en presentationsfilm för att se om företaget Ligistfilm kan uppfattas på ett nytt sätt. Från en svart, mörk och maskulin webbsida till en ljus, modern och frigjord tillsammans med en presentationsfilm över hur Ligistfilm arbetar, tittar vi närmare på hur besökarnas syn på företaget kan förändras. Förändringen innefattar även ett skifte i fokus, från en webbsida med fokus på företaget Ligistfilm till en webbsida med fokus på individuella regissörer. Användartester som utförts visar hur Ligistfilm uppfattas utifrån den gamla webbsidan jämfört med den nya webbsidan tillsammans med presentationsfilmen..

Det blir allt mer vanligt att människor kopplar upp sig mot internet via sin smartphone, både privat och i arbetet. Detta innebär att webbsidor måste anpassas för att visas i dessa enheter. Men att mobilanpassa en webbsida kan vara svårt när det kommer till överskådlighet och navigation av webbsidan. Detta på grund av den begränsade skärmytan. När det kommer till att mobilanpassa en webbsida talas det ofta om två tekniker, responsiv webbdesign och mobila webbapplikationer.

Idag besöker vi inte längre webbplatser enbart via datorer, utan även mobiltelefoner och surfplattor. För att göra interaktionen på en webbplats användbar via flera olika plattformar blir det allt vanligare med responsiv anpassning. Denna utveckling ställer högre krav på den grafiska formgivaren som bör ha god kunskap om de plattformar som designen tillämpas på för att nå högsta möjliga användbarhet. En grafisk formgivare ska alltså förstå vad användbarhet innebär och hur denna kunskap ska tillämpas i designen. Kandidatarbetet undersöker vad som definierar användbarhet och vad grafisk design bidrar till i skapandet av responsiva webbplatser. Utifrån litteraturstudier i samband med en produktion i form av en responsiv webbplats, presenterar vi i detta arbete våra metoder för hur den grafiska designen ska uppnå användbarhet oavsett plattform. ---- We no longer visit websites solely by using computers, but also mobile phones and tablets.

Uppsatsen behandlar ämnet användbarhet i mobila webblösningar med inriktning mot tidningsbranschen. En jämförelse mellan de två aktuella designfilosofier, dedikerad design och Responsiv design, för den mobila webben har utförts genom att fokusera på användbarhet, där centrala begrepp studerats. Begreppen är som följer: Usefulness, Efficiency, Effectivness, Learnability, Satisfaction. Mixade metoder i form av enkätstudier, heuristiska tester, användartester, intervjuer och prestandatester har utförts för att samla in empiriskt material för analys och för att sedan ge en slutsats angående vilken av de två designfilosofierna som tenderar att ge hög användbarhet i system som exempelvis tidningssajter i mobilen.De mest intressanta resultaten var att, sett ur användbarhetssynpunkt, var båda designfilosofier likvärdiga, majoriteten svarade att de testade sajterna fungerade på liknande sätt. Alla uppgifter kunde utföras utan större problem på båda sajterna vilket uppfyller kravet för effectivness.