Denna rapport redovisar för design- och utvecklingsprocessen i byggandet av en responsiv webbsida. Webbsidan skapades för användning av den blivande spelstudion Rocket Luncher Studios. Wordpress som CMS (Content Management System) har används som innehålls-hanteringssystem för att förenkla uppdatering av webbsidan av uppdragsgivaren själva. Webbsidan är kodad utifrån Luke Wroblewskis ”mobile-first”-tänk, vilket börjar med att fokusera designen på mindre skärmar för att sedan anpassa innehållet mot större skärmstorlekar. För att göra designen responsiv har de tre beståndsdelarna flexible grid, flexible images/media och media queries använts, utöver kodning i HTML, CSS, PHP och JavaScript. Resultatet av denna rapport blev en undersökning av design- och utvecklingsprocessen vid byggandet av en responsiv webbsida. Det praktiska i examensarbetet resulterade i en responsiv prototyp till en webbsida för en spelstudio. / This report describes the design and development process in building a responsive website. The website was created for the use of the intended game studio Rocket Lunches Studios. Wordpress has been used as a CMS (Content Management System) to simplify the updating of the website by the client themselves. The website is coded by thinking "mobile-first", which begins with the design focusing on smaller screens and then adapt the content on larger screen sizes. To make the design responsive the three components flexible grids, a flexible images / media and media query has been used, in addition to coding in HTML, CSS, PHP and JavaScript. The result of this report is a survey of the design and development process when building a responsive website. The practicality of the thesis resulted in a responsive prototype of a web page for a game studio.

För att särskiljas från konkurrenter och vara förtroendeingivande är en konsekvent grafisk identitet av stor vikt. Därför syftar föreliggande undersökning till att modernisera den grafiska identiteten hos Falu Glastjänst för att denna ska förmedla hållbarhet, kvalité och service. Vidare är målet att leverera en webbsida där den grafiska identiteten tillämpas och en rekommenderad grafisk manual till Falu Glastjänst. Semi-strukturerade intervjuer genomfördes med Falu Glastjänst och en kund till företaget. Två webbaserade enkätundersökningar utfördes där den första syftade till att ta reda på målgruppens tillvägagångssätt vid behov av ett glasmästeri, medan den andra enkäten utfördes för att testa det framtagna materialet på potentiella kunder. Vidare genomfördes Card Sortings med fyra potentiella kunder och tre personer inom IT-branschen för att bygga en maximal hierarki och således en användarvänlig webbsida. Undersökningen resulterade i en logotyp och grafisk identitet som enligt Falu Glastjänst samt tidigare- och potentiella kunder förmedlar hållbarhet, kvalité och service. Från undersökningen har även en webbsida kunnat tas fram, där hierarkin är baserad på respondenternas och således målgruppens önskemål och vanor. / Graphical identity is important for a company to distinguish itself from the competition and to give it a reliable business image. The present study aims therefore to modernize the graphical identity of Falu Glastjänst in order to communicate sustainability, quality and service. A further goal is to develop a website in which the modernized graphical identity is applied as well as a recommended graphical manual for Falu Glastjänst. Semi-structured interviews were conducted with Falu Glastjänst and one of its customers. Two web-based surveys were carried out. The first survey aimed at studying the behavior of a target group in need of glazing service. The second survey was carried out to test the results of the first survey on a new group of potential customers. In order to build a user-friendly website with best hierarchy, Card Sortings was carried out with four potential customers and three IT professionals. Results of the study include a new logotype and graphic identity which communicate sustainability, quality and service. This has been confirmed by Falu Glastjänst as well as their former and potential customers. A further result of the study is a new website for Falu Glastjänst with a hierarchy based on participants of the study and thereby the target group’s wishes and habits.

På webbplatsen arbetsliv.org finns webbsidorna branschkunskap och ämneskunskap innehållandes länkar till andra webbsidor, med fakta kring arbetsmiljö. Webbsidorna riktar sig främst till arbetsmiljöingenjörer och medlemmarna inom organisationerna FTF (Föreningen Teknisk Företagshälsovård) Arbetsmiljö och EHSS, Ergonomi och Human Factors Sällskapet Sverige. Arbetsmiljöingenjörer arbetar med frågor relaterade till branscher inom många olika områden. Därför anses det underlätta deras arbete genom att ha en samlad plats för branschspecifik information. Syftet med uppsatsen är att utveckla webbsidor till en egen domän, arbetsmiljowiki.se, och att utifrån organisationsmedlemmarnas åsikter skapa en wiki med bransch- och ämneskunskap inom arbetsmiljö. För att ta reda på användarnas åsikter genomfördes åtta stycken kvalitativa telefonintervjuer med intervjupersoner från olika åldersgrupper. Litteraturstudier skedde kring val och utveckling av teknisk lösning för att få en bild av de möjligheter som finns. Jämförelsen av tekniska lösningar, analysen av telefonintervjuerna och de uppställda kraven utgör tillsammans ett delresultat. Delresultatet ledde fram till en integration av Facebookinloggning, YouTubelänkar, kommentarsfält och att resultatet arbetsmiljowiki.se utformades enligt organisationsmedlemmarnas åsikter. / Located on the website arbetsliv.org is the webpages branschkunskap and ämneskunskap, containing links to other websites with facts about occupational health and safety. The webpages mainly target themselves towards occupational health engineers and members of the two organization’s FTF (Föreningen Teknisk Företagshälsovård) Arbetsmiljö and EHSS, Ergonomi och Human Factors Sällskapet Sverige. Occupational health engineers work with questions related to industries of many different fields. Therefore, it is considered to facilitate their work by providing a collaborative collection of industry-specific information. The purpose of this thesis is to develop the webpages into an independent domain, arbetsmiljowiki.se, and based on the organization members’ opinions create a wiki about industry and subject knowledge related to occupational health and safety. To collect the users’ opinions, eight qualitative telephone interviews were carried out with interviewees from different age-groups. Literature studies regarding choice of and development of technical solutions were performed in order to obtain a greater picture of the available possibilities. The comparison of technical solutions, analysis of the telephone interviews and the specified requirements together make up a part of the result. One part of the result resulted in an integration of Facebook login, embedded YouTube videos, comment fields and that the final result arbetsmiljowiki.se was shaped as per the organization members’ requests.

[pt] Uma estratégia comum de linha de produtos de software envolve sistemas da Web baseados em plug-ins que suportam a incorporação simples e rápida de comportamentos personalizados, sendo amplamente adotados para criar aplicativos baseados na web. A popularidade dos ecossistemas que suportam o desenvolvimento baseado em plug-ins (como o WordPress) é, em grande parte, devido ao número de opções de personalização disponíveis como plug-ins contribuídos pela comunidade. Entretanto, as vulnerabilidades relacionadas a plug-ins tendem a ser recorrentes, exploráveis e difíceis de serem detectadas e podem levar a graves conseqüências para o produto personalizado. Portanto, é necessário entender essas vulnerabilidades para permitir a prevenção de ameaças de segurança relevantes. Neste trabalho, realizamos um estudo exploratório para caracterizar vulnerabilidades causadas por plug-ins em sistemas baseados na web, examinando os boletins de vulnerabilidade do WordPress catalogados pelo National Vulnerability Database e os patches associados, mantidos pelo repositório de plugins do WordPress. Identificamos os principais tipos de vulnerabilidades, o seu impacto e o tamanho do patch para corrigir a vulnerabilidade. Identificamos, também, os tópicos mais comuns relacionados à segurança discutidos entre os desenvolvedores do WordPress. Observamos que, embora as vulnerabilidades possam ter consequências graves e permanecerem despercebidas por muito tempo, elas geralmente podem ser atenuadas com pequenas alterações no código-fonte. A caracterização ajuda a fornecer uma compreensão de como tais vulnerabilidades se manifestam na prática e contribui com as novas gerações de ferramentas de teste de vulnerabilidades capazes de antecipar sua possível ocorrência. Esta pesquisa propõe uma ferramenta de suporte para mitigar a ocorrência de vulnerabilidades em sistemas baseados em plugins web, facilitando a descoberta e antecipação da possível ocorrência de vulnerabilidades. / [en] A common software product line strategy involves plug-in-based web systems that support the simple and rapid incorporation of custom behaviors and are widely adopted for building web-based applications. The popularity of ecosystems that support plug-in-based development (such as WordPress) is largely due to the number of customization options available as community-contributed plugins. However, plug-in related vulnerabilities tend to be recurring, exploitable and difficult to detect and can lead to serious consequences for the custom product. Therefore, these vulnerabilities must be understood to enable the prevention of relevant security threats. In this paper, we conduct an exploratory study to characterize plug-in vulnerabilities in web-based systems by examining the WordPress vulnerability bulletins cataloged by the National Vulnerability Database and the associated patches maintained by the WordPress plugin repository. We identify the main types of vulnerabilities, their impact, and the size of the patch to address the vulnerability. We have also identified the most common securityrelated topics discussed among WordPress developers. We note that while vulnerabilities can have serious consequences and remain unnoticed for a long time, they can often be mitigated with minor changes to source code. Characterization helps provide an understanding of how such vulnerabilities manifest themselves in practice and contributes to new generations of vulnerability testing tools that can anticipate their potential occurrence. This research proposes a support tool to mitigate the occurrence of vulnerabilities in web plugin based systems, facilitating the discovery and anticipation of the possible occurrence of vulnerabilities.

The subject of this thesis is content management systems (CMS) with a focus on an open source CMS Wordpress, which is designed for creating and managing content of the web sites. Also there are explained advantages and disadvantages of using CMS in commercial and non-commercial environment on two specific projects. Based on the analysis, some recommendations have been proposed for both projects.

This thesis is concerned with mapping websites environment by comparison selected open-source Content Management Systems (CMS), also deals with possibility to use these systems by natural persons and different-sized legal persons operating in commercial or non-commercial sectors. An objective of the thesis is a proof that Content Management Systems satisfy all needs of legal personalities and mostly are suitable solution for them.

Målet med detta projekt har varit att migrera och förnya webbplatsen visitfjallen.se. Sidan innehåller ett brett register av olika företag inom områden som upplevelser, boende och restauranger i Sveriges fjällkedjor. Den tidigare webbplatsen var omodern och byggd på ett kostsamt system som saknade flexibilitet. I detta arbete har webbplatsen flyttats till det flexiblare och mer lättskötta systemet WordPress. Sidan har också moderniserats ordentligt och fått en hel del förbättringar och nya funktioner. I stället för en par enkla textrader med information har varje företag nu fått en egen profilsida med plats för stora mängder av information. Bland de helt nya funktionerna finns exempelvis egna kontaktformulär och möjligheten för besökare att lämna recensioner för bolagen. Företagen har också fått en integrering av sociala medier med egna knappar för Facebook och Twitter. Flera företag som finns listade på Tripadvisor har även fått detta integrerat på sin sida. Inloggade besökare kan nu spara sina favoritföretag genom att markera dem som sin favorit. Eller lämna en recension för bolag de har åsikter om. De flesta av de nya funktionerna har erhållits med hjälp av tillägget Geodirectory till WordPress, vilket är ett utmärkt och heltäckande verktyg som specialiserat sig på webbplatser med omfattande företagsregister. En betydande del av arbetet bestod av att flytta den stora mängden bolag med tillhörande information till den nya webbplatsen. Registret var möjligt att överföra via en kalkylfil, men informationen i den den exporterade filen var rörig och innehöll 900 rader med data som behövde sorteras och struktureras upp rad för rad. För att dela upp arbetet gjordes därför filen i episoder om ungefär 200 bolag åt gången. En stor del av webbplatsen har byggts upp med hjälp av sidbyggar-verktyget Beaver Builder. Verktyget har varit användbart och påskyndade processen med att konstruera det stora antalet sidor som var nödvändigt för att bygga upp den nya Visitfjällen.se. Den färdiga webbplatsen uppfyllde de flesta av beställarens önskemål och det nya utseendet för visitfjällen blev i slutändan mycket uppskattat.

Detta projekt handlar om att skapa en ny hemsida till Åhus Beach. Huvudmålen är att den ska vara fullt responsiv och fullt ut dynamisk. För att göra hemsidan dynamisk har vi använt oss av wordpress som CMS-verktyg. För att kunna utnyttja wordpress till dess fulla potential har vi använt oss av ett plugin som heter Advanced Custom Fields Pro. Nästan allting på hemsidan så som texter, bilder, färger, knappar och även sidor är möjliga att ändra på via wordpress. Miljön som använts är en wordpress boilerplate som kallas Bedrock tillsammans med ett starttema som kallas Sage och allting har kodats i Visual Studio Code. Med allt detta tillsammans har vi utvecklat en fullständig ny och fräsch hemsida till Åhus Beach. Slutresultatet är en sida som innehåller sidor för tre olika evenemang, deras undersidor med menyer. Sidan innehåller nyheter, erbjudanden, information om eventen, kartor, kontaktinformation, sökfunktion och videos.

The aim of this diploma theses is to briefly describe and compare Content Management Systems (CMS) WordPress, Joomla and Drupal and to create a web page for "bezzavazku.cz "project. This web page was created in CMS which was chosen on the base of the CMS comparison. For better understanding of customer's wants the market survey was made. Outcomes of this survey were took into consideration when creating the websites. After all the entire project was evaluated and return of the investment (ROI) was calculated.

Målet med detta projektet har varit att utveckla en webbplats åt ett företag med webbutveckling och användbarhet som kärnverksamhet. För att knyta designen och layouten till företagets verksamhet, så har projektet valt att titta på vad typografi för webb innebär, och hur det kan implementeras på webbplatsen. Resultatet ska ligga till grund för projektets webbplats samt framtida produkter och tjänster till företaget. Webbplatsen har utvecklats som ett tema för innehållshanteringssystem WordPress, tillsammans med ett eget insticksprogram för att utöka funktionaliteten till att innefatta en kontakt funktion. Det kompletta temat, typografi, layout och dess funktioner har utvecklats genom att använda HTML5, CSS samt PHP, tillsammans med en lokal webbserver och relationsdatabsen MySQL. Rapporten följer projekts utveckling av en webbplats som är både dynamisk och anpassar sin typografi och layout till storleken på användarens enhet, samt presenterar produkten av projektet.