Responsive web design for Wordpress using Twitter Bootstrap
Klärck, Robin (2014)
Klärck, Robin
Arcada - Nylands svenska yrkeshögskola
2014
All rights reserved
Julkaisun pysyvä osoite on
https://urn.fi/URN:NBN:fi:amk-201405208678
https://urn.fi/URN:NBN:fi:amk-201405208678
Tiivistelmä
Responsive design is no newcomer to the field of web design, however the level of attention and detail it receives today is unprecedented in any form. Thanks to some very extensive frameworks available to web designers today, the design and development of websites of all sizes has become much more practical, and as such has brought the
different aspects of web design closer to each other. In this project, me and my partner Alex Erolin have created a web site for the exchange programme Documentary &
Diversity, a co-operative program between members form Finland, Ghana and South Africa.
We will start by approaching the project form a Mobile First-perspective, where we will design the site with mobile devices and tablets first in mind, after which we will advance to desktops and larger screens. After this we will build the site in two major steps; the first step will be to build the site using the Unsemantic framework, which will serve us as a learning platform for the second step. Here, we will build the site using Bootstrap, which will also serve as the final draft. At the end of the process, we will compare the two methods and analyze how they affected our workflow, what sort of projects they fit to and the major differences between them. The project will be based on responsive
design and the end result must reflect it as well as possible. Responsiv design är ingen ny filosofi inom web design, men aldrig förr har den fått lika
hög status som den får idag. Tack vare extensiva ramverk kan man idag planera och utföra
sidor i alla storlekar lättare än någonsin förr, vilket för de olika aspekterna av web
design varandra allt närmare. I detta arbete har jag tillsammans med Alex Erolin skapat
en webbsida för utbytes-programmet Documentary & Diversity, ett projekt med medlemmar
från Finland, Ghana och Sydafrika.
Vi kommer att börja med att närma oss projektet från en Mobile First-synvinkel, var vi
först bygger sidan med tanke på mobila telefoner samt pekplattor, varefter sidan kommer
att utvecklas för bordsdatorer och större skärmar. Efter detta kommer vi att bygga
sidan i två stora steg; i den första bygger vi upp en sida som ett test och som en praktisk
övning, med hjälp av Unsemantic-ramverket. Denna version kommer att fungera som
en inlärnings-fas. I det andra steget bygger vi sidan med Bootstrap-ramverket, vilket
kommer att fungera som det slutgiltiga resultatet. I slutet av arbetet går vi igenom skillnaderna
mellan ramverken, hur de har påverkat vårt arbetsflöde samt för vilka typer av
projekt var sitt ramverk fungerar bäst. Vi bygger sidorna med framförallt en responsiv
synvinkel och slutresultatet bör visa denna metod så brett som möjligt.
different aspects of web design closer to each other. In this project, me and my partner Alex Erolin have created a web site for the exchange programme Documentary &
Diversity, a co-operative program between members form Finland, Ghana and South Africa.
We will start by approaching the project form a Mobile First-perspective, where we will design the site with mobile devices and tablets first in mind, after which we will advance to desktops and larger screens. After this we will build the site in two major steps; the first step will be to build the site using the Unsemantic framework, which will serve us as a learning platform for the second step. Here, we will build the site using Bootstrap, which will also serve as the final draft. At the end of the process, we will compare the two methods and analyze how they affected our workflow, what sort of projects they fit to and the major differences between them. The project will be based on responsive
design and the end result must reflect it as well as possible.
hög status som den får idag. Tack vare extensiva ramverk kan man idag planera och utföra
sidor i alla storlekar lättare än någonsin förr, vilket för de olika aspekterna av web
design varandra allt närmare. I detta arbete har jag tillsammans med Alex Erolin skapat
en webbsida för utbytes-programmet Documentary & Diversity, ett projekt med medlemmar
från Finland, Ghana och Sydafrika.
Vi kommer att börja med att närma oss projektet från en Mobile First-synvinkel, var vi
först bygger sidan med tanke på mobila telefoner samt pekplattor, varefter sidan kommer
att utvecklas för bordsdatorer och större skärmar. Efter detta kommer vi att bygga
sidan i två stora steg; i den första bygger vi upp en sida som ett test och som en praktisk
övning, med hjälp av Unsemantic-ramverket. Denna version kommer att fungera som
en inlärnings-fas. I det andra steget bygger vi sidan med Bootstrap-ramverket, vilket
kommer att fungera som det slutgiltiga resultatet. I slutet av arbetet går vi igenom skillnaderna
mellan ramverken, hur de har påverkat vårt arbetsflöde samt för vilka typer av
projekt var sitt ramverk fungerar bäst. Vi bygger sidorna med framförallt en responsiv
synvinkel och slutresultatet bör visa denna metod så brett som möjligt.