Webbdesign är ett populärt och viktigt område inom medieproduktion. Som ett avslutande examensarbete inom högskoleprogrammet till medieproducent har jag producerat en webbplats till årets upplaga av musikfestivalen Popup i Umeå. Projektgruppen har bestått av mig som ensam producent och beställargruppen Kulturföreningen Humlan i Umeå, föreningen som arrangerar Popup. I den här rapporten beskriver jag vägen från första mötet med min uppdragsgivare till den färdiga webbplatsen. Jag redogör även för de verktyg som använts, bland annat CMS-systemet Wordpress. / Web design is a popular and important field within media production. As a final degree project within the University Programme in Media, I have produced a website for this year’s edition of the music festival Popup in Umeå. The project team has consisted of me as sole producer, and client group Kulturföreningen Humlan in Umeå, the organization that arranges Popup. In this report I describe the path from the first meeting with my client to the final website. I also state what tools I have used, including CMS Wordpress.

Σκοπός της παρούσας διπλωματικής εργασίας, είναι η παρουσίαση κάποιων επιλεγμένων λογισμικών υποδομής, δημιουργίας και υποστήριξης weblog (Ιστολογίων) καθώς και η ανάλυση δυνατοτήτων και συγκριτική μελέτη μεταξύ τους. Η διπλωματική καταλήγει σε ένα συγκριτικό πίνακα ο οποίος παρέχει χρήσιμα συμπεράσματα για τη δυναμική κάθε λογισμικού υποδομής, που απευθύνονται σε κάθε ενδιαφερόμενο και ειδικά σε κάποιον που θέλει να ξεκινήσει το δικό του ιστολόγιο. / The intention of this paper is to recognize, rate and compare the most common weblog software.

Goal of my thesis is to design and create a new template for CMS WordPress for online journal or a blog with use of HTML5 and CSS3. The resulting template will be responsive. In the first part I will focus on describing WordPress and its history in general. In the next, second, chapter, I will examine the architecture and technologies used by the system. Third chapter will deal with structure of plugin and theme systems. In the fourth and final chapter I will examine the process of creating template in a greater detail. In the partical demonstration I will show creating a new template from scratch, going over basic conceptions, wireframes, coding and final implementation on a live website.

Innehållshanteringssystem används för att hantera innehåll och det finns många system att välja på. Detta arbete har fokuserat på fyra innehållshanteringssystem för innehåll på webben. Det är systemen Drupal, Joomla, Polopoly och Wordpress. Syftet var att inhämta teoretisk och praktisk kunskap om dessa system och besvara huvudfrågeställningarna om vilka inbyggda funktioner som finns, hur anpassbara systemen är, hur de olika systemen är att arbeta med för en utvecklare och hur anpassade systemen är för webbplatser med mycket trafik. Det jag kom fram till var att Drupal är ett mycket väl utbyggt och omfattande och anpassbart system där det går att utnyttja mycket tredjepartstillägg och anpassa den efter egna önskemål. Joomla är ett system som innehåller mycket inbyggd funktionalitet och det finns mycket tredjepartstillägg att tillgå, men anpassbarheten är dålig. Wordpress är ett minimalt användarvänligt system som inte innehåller så mycket inbyggd funktionalitet, men som har bra möjligheter att utvidgas med tredjepartstillägg och egenutvecklade. Anpassbarheten är god, men inte lika omfattande som i Drupal. Polopoly är till skillnad från de övriga systemen bara ett ramverk. Själva webbplatsen måste utvecklas från grunden. Polopoly är bra för välbesökta webbsidor som ska skala bra, med mycket innehåll. Anpassbarheten är god, men mycket funktionalitet måste implementeras. / Content Management System is used to manage content and there are many systems to choose from. This work has focused on four content management systems for web content. The systems are Drupal, Joomla, WordPress and Polopoly. The aim was to obtain theoretical and practical knowledge about these systems and answer key questions about the built-in features, how adaptable systems are, how the various systems are working with a developer and how the systems are tailored for sites with heavy traffic. What I came to was that Drupal is a very extensive and comprehensive and customizable system that can use much additional third-party extensions and adapt it to their liking. Joomla is a system that contains a lot of built-in functionality and there are a lot of third-party extensions available, but adaptability is poor. WordPress is a minimal user-friendly system that does not contain as much built-in functionality, but which has great potential to be extended with third-party extensions and self developed ones. Adaptability is good, but not as extensive as in Drupal. Polopoly is unlike other systems, only a framework. The actual site must be developed from scratch. Polopoly is good for popular Web pages that will scale well, with much content. Adaptability is good, but a lot of functionality must be implemented.

I det här arbetet undersöks det ifall ett CMS som befinner sig på webben kan få bättre exekveringstid ifall databaskod ifrån webbapplikationen istället flyttas till databasen i form av stored procedures. Det har skapats 4 stycken testapplikationer för att testa procedurernas effektivitet jämfört med hur det fungerar originellt. Testapplikationerna skickar en slumpad text till Wordpress funktionerna som har hand om inmatningar till databasen. Textsträngarna matas då in i databasen via antingen procedurer eller databaskod i webbapplikationen beroende på vilken version av Wordpress det är.   I det här arbetet förklaras varför det kan vara intressant att använda sig av stored procedures och vilka för och nackdelar det finns med dem. Resultatet av det här arbetet tyder på att det kan finnas anledningar till att använda sig av procedurer vid större projekt men kan anses som överflödigt vid mindre arbeten.

The thesis focuses on developing e-shop with CMS WordPress and plugin eShop. Its aim is to write a methodology by which it would be possible to create e-shop step by step. The work outlines the advantages and possible disadvantages of this solution. Outcome of this work are also additional scripts that optimizes functionality of eShop plugin and extensions for linking e-shop with Czech e-commerce services. Czech localization for plugin eShop is also part of this thesis. Writing methodology precedes the preparation of the technical background documents WordPress and the selected extension called eShop. The first chapter defines the objective of the thesis and are defined substrates. The following is research that confirms the absence of similar methodologies or guidelines in both Czech and foreign language. The third chapter presents the used solution and reveals the technical basics of WordPress and plugins. The main part - the fourth chapter contains the very methodology of creating e shop. It takes the reader through the process from installation to launch the e-shop. Includes introduction of making templates, analysis appropriate plugins and show how to edit them. This part also presents how to manage products and orders, create Czech localization, links to e-commerce services and additional programming required functions in e-shop. Chapter contains recommendations for the operation and maintenance of the e shop and subchapter about user testing describes method by Steve Krug, use it as a practical demonstrations and evaluating conclusions. Contribution of this thesis is the know-how in terms of methodology, expanding the knowledge base of the community, the additional scripts for e-shop and written recommendations for the process of operation e-shop by WordPress.

In today’s digitized society, it is not big news that the internet use in Sweden is large but also increasing every year. A large amount of the users, approximately 7,5 million people, have impairments in areas such as movement, motor skills, reading, understanding, seeing, hearing, concentration and memory. With such a large amount of the population present on the internet, there is a form of responsibility. This responsibility is based on making the usage of the millions of websites that can be visited by a user accessible and easy to use. In this project a WordPress website is developed for a company. The focus of the project is to develop with accessibility as the basis. An agile work process with increments and iterations is used in the project. After conducting an audience analysis, a sitemap, wireframes and a moodboard were created. Images were photographed and optimized while other graphic material was created. After that, design sketches were created by following web guidelines and gestalt laws. The coding was planned with flow charts and the website was created statically and then dynamically. Finally the website was tested in regards to functionality, responsiveness, compatibility with different browsers and a number of user tests were also conducted. All tests imply that the project has met the goals that were set and that the accessibility of the website is thus perceived as adequate. Furthermore, the ethical aspects that have been taken into account during the course of the project have been discussed. Lastly problems that have arisen and how they have been resolved have been analyzed. A discussion consisting of future improvements and final thoughts of the project concludes the report. / I dagens digitaliserade samhälle är det ingen större nyhet att internetanvändningen runt om i Sverige är stor men också ökar för varje år. En stor del av användarna, ungefär 7,5 miljoner personer, har nedsättningar inom områden såsom rörelse, motorik, läsning, förståelse, seende, hörsel, koncentration och minne. Med en så stor andel av befolkningen närvarande på internet medför detta faktum ett ansvar. Detta ansvar grundar sig i att tillgängliggöra och förenkla användningen av de miljontals webbplatser som kan besökas av internetanvändare. I detta projekt utvecklas en WordPress-webbplats åt ett företag. Fokus i projektet är utveckling med tillgänglighet som grund. I projektet används en agil arbetsprocess med inkrement och iterationer. Efter att en målgruppsanalys genomförts skapades en sitemap, wireframes och en moodboard. Bilder fotograferades och optimerades medan annat grafiskt material skapades. Därefter skapades designskisser med användning av webbriktlinjer och gestaltlagar. Kodningen planerades med flödesscheman och därefter kodades webbplatsen först statiskt och därefter dynamiskt. Avslutningsvis testades webbplatsens funktionalitet, responsivitet, kompatibilitet i olika webbläsare och ett antal användartester gjordes. Samtliga tester visar att projektet uppfyllt de mål som satts och att tillgängligheten på webbplatsen alltså uppfattas som god. Vidare diskuteras de etiska aspekterna som har tagits hänsyn till under projektets gång. Sist analyseras problem som har uppstått och hur de har lösts, förslag till framtida förbättringar och slutsatser av hela projektet.

This project has been about creating a website for rehoming pets together with a team at the digital agency West Art. The company had identified a need for a pet rehoming service that feels safe for the user and does not violate laws and regulations. The website was developed with the CMS WordPress in the language PHP. A plugin was widely used called Advanced Custom Fields, this allows developers to create custom fields for creating posts or pages in WordPress. It is possible for a user to create an account on the website and they are able to post their own ads of their pets. The user have their own profile page on the website with information about them. Animal shelters can also create accounts on the website, which upon registration have the opportunity to enter an address for later placement on the website's animal shelter page on a map. The project is focused on complying with laws and regulations such as the GDPR, the DOS Act and copyright. Accessibility was also important for all people to be able to use the website. This was ensured by all elements being tabbable, it is good contrast on elements and text, there is no moving elements on the page and so on. / Detta projekt gick ut på att skapa en webbplats för omplacering av smådjurtillsammans med ett team på digitalbyrån West Art. Företaget hade identifieratett behov av en tjänst för omplacering av smådjur som känns trygg föranvändaren och som inte strider mot lagar och regler. Webbplatsen harutvecklats med CMS-verktyget WordPress i språket PHP. Ett plugin haranvändts i stor utsträckning vid namn Advanced Custom Fields, detta låterutvecklare skapa skräddarsydda fält för skapandet av inlägg eller sidor iWordPress. Det ska gå för en användare att skapa ett konto på webbplatsen ochkunna lägga upp egna annonser. Användaren har en egen profilsida påwebbplatsen med information om denne. Även djurhem kan skapa konton påwebbplatsen, som vid registrering får möjlighet att mata in en adress för attsenare på webbplatsens djurhemssida placeras ut på en karta. Projektet hadefokus på att följa lagar och regler som GDPR, DOS-lagen och upphovsrätten.Tillgänglighet har också varit viktigt för att alla människor ska kunna användawebbplatsen. Detta försäkras genom att alla element går att använda tab på, detär god kontrast på element och text, det finns inga rörliga element på sidan ochså vidare.

The objective of this project is a, for client, optimized website built in Wordpress using Beaver Builder and Beaver Themer plugin, together with a basic set of chosen plugins for a modern, secure and cost effective Wordpress site. The projects also includes an evaluation of and analysis about how functionality and design could be prioritized for optimal delivery and client satisfaction. The purpose is to get a satisfied client and to procure enough knowledge to build websites in Beaver Builder with a healthy priority of funcionality and design. A market research have been done with questions about websites within the swedish hospitality industry. The design have been made, with the result in consideration, to be clear, simple and, with the help of pictures, to bring the right sense of purpose.Usability testing on both big screens and small screens have been made with surveys. The result shows that the website is clear, neat and easy to navigate. The website of Vemdalen Catering have been published on the domain vemdalencatering.se. The website is built in Wordpress with chosen plugins. The design is responsive, works well on different screen sizes and is, according to usability testing, also user friendly.Validation has been performed and shows results following the set objectives. Search engine optimization has been performed. Evaluation and analysis from the result of usability testing, market research, SE ranking and Google Analytics shows that a priority for design and experience in many cases can be higher than availability, depending on target group, and that more work is needed to rank higher up in Googles search engines and essentially aquire more visitors on the website. / Projektets mål är en, för kund, optimerad webbplats byggd i Wordpress med tillägget Beaver Builder och Beaver Themer samt en grunduppsättning av valda tillägg för en modern, säker och kostnadseffektiv Wordpressajt. Projektet ska även innefatta en utvärdering och analys av hur funktionalitet och design kan prioriteras för optimal leverans och kundnöjdhet. Syftet är en nöjd kund samt att införskaffa tillräcklig med kunskap för att bygga webbplatser i Beaver Builder med en sund prioritering av funktionalitet och design. Marknadsundersökning har gjorts med frågor om webbplatser inom svensk besöksnäring. Utefter resultatet har designen gjorts för att vara tydlig, enkel och för att, med hjälp av bilder, få rätt känsla. Användartester på både stora skärmar och små skärmar har utförts i form av enkäter. Resultaten visar på en tydlig, snygg och lättnavigerad webbplats.Vemdalen caterings webbplats har publicerats på domänen vemdalencatering.se. Webbplatsen är byggd i Wordpress med valda tillägg. Designen är responsiv och fungerar bra för olika skärmstorlekar samt är enligt användbarhetstester även användarvänlig. Validering har utförts med resultat som följer de utsatta målen. Sökmotoroptimering har utförts. Utvärdering och analys med hjälp av användartester, marknadsundersökning, SE ranking och Google Analytics visar att prioritet för design och upplevelse i många fall kan vara högre än tillgänglighet, beroende på målgrupp, och att mer arbete behövs för att ranka högre i Googles sökmotor och få fler besökare till webbplatsen.

The goal of this project has been to get an idea of what the work process looks like in a typical web assignment at Jo Kommunikation and to recreate an internal web assignment with a focus on improvements in usability and accessibility. More in-depth questions about what the work process looks like are answered. These questions were answered with the help of practical work equated with asking questions and having conversations with project manager and web developer. To evaluate how the internal web assignment could offer current accessibility, I will use a checklist from webbriktlinjer.se. Through usability tests, it was evaluated how the internal web assignment could be required regarding usability. Results from evaluations and tests showed that there were improvements to be made. The report ends with a discussion of how the project has worked. / Målet med detta projekt har varit att få en bild över hur arbetsprocessen ser ut vid ett typiskt webbuppdrag på Jo Kommunikation samt att återskapa ett internt webbuppdrag med fokus på förbättringar avseende användbarhet och tillgänglighet. Mer ingående frågor om hur arbetsprocessen ser ut besvaras. Dessa frågor besvarades med hjälp av praktiskt arbete jämsides med att ställa frågor och föra samtal med nyckelpersoner. För att utvärdera hur det interna webbuppdraget kunde förbättras gällande tillgänglighet användes en checklista från webbriktlinjer.se. Genom användbarhetstester så utvärderades hur det interna webbuppdraget kunde förbättras gällande användbarhet. Resultat ifrån utvärderingar och tester visade att det fanns förbättringar att genomföra. Rapporten avslutas med en diskussion om hur projektet har fungerat.