Responsiv webbutveckling med Joomla

Abstract

Responsiv design är ett begrepp som Ethan Marcotte gjorde känd i sin artikel ”Re-sponsive Web Design” i webbtidningen ”A list apart” år 2010. I dagens läge vet en webbutvecklare sällan i förhand med hurdan apparat människorna besöker sina publikationer med. Det kan vara en smarttelefon, surfplatta, bordsdator eller t.o.m. en televis-ion. Alla dessa apparater kan ha olika skärmstorlekar och funktioner och ställer då också krav på hur en webbutvecklare planerar sin webbplats. Att planera en webbplats skilt för alla apparater skulle vara både tidskrävande och ofta ekonomiskt olönsamt. Dessa problem ville Marcotte lösa i sin artikel och senare i boken ”Responsive Web Design” 2011. Han kombinerade tre existerande metoder till en gemensam och kallade den för responsiv design. Detta sätt att bygga sidor började snabbt slå igenom bland webbutvecklarna. En responsiv webbsida är mera än en sida som bara anpassar sig till den apparat och skärmstorlek som slutanvändaren besöker sidorna med. Detta slutarbete kommer att koncentrera sig på hur man utvecklar en responsiv webbplats i Joomla in-nehållshanteringssystemet. Att använda ett innehållshanteringssystem har blivit ett allt vanligare sätt att publicera innehåll i internet och målet med arbetet är att bygga en re-sponsiv sida i Joomla genom att använda de nyaste CSS3 tekniker kombinerat med Twitter Bootstrap ramverket som finns färdigt implementerat i Joomla. Arbetet går ige-nom de viktigaste elementen för en responsiv design och hur man använder dessa ele-ment i Joomla miljön.

Responsive design is a term that Ethan Marcotte made known in his article “Responsive Web Design” in the webzine “A list apart” year 2010. Nowadays a web developer seldom knows beforehand with what kind of device the user is visiting his publications. It can be a smartphone, tablet, desktop computer or even a TV. All of these devices can have dif-ferent screen sizes and functionality and because of that set requirements on how the web developer designs his pages. To make a separate design for all of these devices would be time-consuming and often economically unwise. These were the problems that Marcotte wanted to solve in his article and later in the book “Responsive Web Design” 2011. He combined a few existing techniques into one approach and called it responsive design and that way of thinking quickly started to gain popularity in the web developing society. A responsive webpage is more than just a page that adapts according to the device and screen resolution that the user is using browsing the page with. This thesis concentrates on the development of responsive web pages to the Joomla content management system. The use of CMS for publishing content in the Internet has become more common and the purpose of this project is to build a responsive website using the newest CSS3 techniques combined with the Twitter Bootstrap framework that comes preinstalled in Joomla. The thesis will go through the most important elements of responsive web development and how to implement them to the Joomla working environment.