Grafisk Workflow HOVEDFORLØB 02/ ELISABETH GÅRDBO NIELSEN

Transkript

1 Grafisk Workflow HOVEDFORLØB 02/ ELISABETH GÅRDBO NIELSEN

2 Aslakgottlieb.dk OPGAVE Udarbejdelse og design af wordpress-website for Aslak Gottlieb. Aslak ville have en side der var let at overskue, og som var nem for ham selv at tilføje til at rette i efterfølgende. MÅLGRUPPE Nyhedsmedier, uddannelsesteder, mellemstoreog store virksomheder og private og offentlige institutioner. FORMAT Responsiv og testet på forskellige enheder. SYSTEMER Wordpress, visual composer KUNDEBSKRIVELSE Aslak Gottlieb er bliver beskrevet som debattør og provokatør, forfatter og formidler, projektmager og motiverende iværksætter i krydsfeltet mellem undervisning, journalistik og it. Siden 2009 har han leveret konsulentopgaver i spektret børn og unge, medier, it og skole. I Pressens Hus fungerer han også som projektansvarlig på Avisen I Undervisningen. 2

3 Flowchart FORSIDE Aslak Gottlieb lille kronik + video i header UDD&J&IT About-side ASLAK I AKTION Galleriside OM ASLAK About-side PRESSE KONTAKT Toggle under hvert billede Testimonials i slider Tumbnails og download Formular Google map 3

4 Wordpress THEME Efter at have dannet mig et overblik over siden indhold og materiale, gik jeg på jagt efter et theme. Jeg sendte her et udvalg til kunden, og i samarbejde med ham valgte vi et der passede godt til formålet. Vi valgte et der havde mange muligheder i form af Visual composer der giver en god mulighed for et. overskuelig og struktureret website Visual composer har et bredt udvalg af plugin muligheder, editor til formatering at tekst og webelementer til design af siden. Jeg har her f.eks lavet nogle custom løsninger, på de ting jeg ved kommer til at gå igen på siden. Jeg har lavet alle knapper er der lavet en custom indstilling på, så jeg ikke skal taste alt info ind hver gang, og så jeg er sikker på de bliver ens hver gang. 4

5 Elementer VIDEO På forsiden ville kunden gerne have en præsentationsvideo. Den bliver trukket fra Youtube, og er blevet redigeret til formålet. GOOGLE MAPS På kontaktsiden er der et kort. Det bliver trukket fra Google Maps, og fungerer ved at man via Google for genereret en customeret kode, som man indlejrer i elementet. GALLERI Under ASLAK I ACTION er der gjort brug af portefoliofunktionen i form af et galleri. Her bliver det brugt som en slags menu der sender dig videre til de forskellige undermenuer som også er tilgængelige i form af en dropdownmenu. Til at starte med fungerede portefoliosiden ikke til formålet da billederne kun kunne linke videre til case sider. Det blev løst ved at lave en redirect på case-siderne så de linkede videre derfra og hen til den side de skulle. 5

6 CSS CUSTOM CSS Da der er enkelte ting der ikke var muligt at indstille i selve temaet, er der også gjort brug af en custom CSS. På øverste billede ses css-indstillinger for den dropdown menu der ligger under fanen ASLAK I AKTION. Det miderste billede viser indstillingen af teskten på de testimonials der ligger på siden OM ASLAK. De havde nogle præ-indstillinger der ikke passede til de lange testimonials som der skulle på her. På det nederste billede ses ændringerne for de dots der er at finde under alle slider-elementer på siden. De var for store, så her er de gjort mindre. 6

7 Søgeoptimering SEO Da siden har en bredmålgruppe og også skal bruges til at promovere kunden, er det vigtig at synliggøre siden i søgemaskinernes søgeresultater. Siden her er søgeoptimeret, og bliver vedligeholdt ved brug af google analytics. Til SEO er der også brugt et plugin der hedder Yoast SEO. I deres premium plugin er det muligt for dig at tilføje keywords der hjælper siden til at rangere højt i søgeresultaterne. Den kører løbende check på keyswords, for at kontrollere om de bliver brugt ofte nok på siden og at de har den ønskede funktion. 7