Dette dokument beskriver SUMOshop Frontend v3, primært med fokus på ændringer ift. Frontend v2.

Transkript

1 SUMOshop Frontend v3 Dette dokument beskriver SUMOshop Frontend v3, primært med fokus på ændringer ift. Frontend v2. Fra foråret 2013 laves alle nye shops og redesigns i v3. Da fuld overgang til v3 kræver omkodning af designimplementering - i mange tilfælde også ændringer af design - bliver eksisterende shops ikke ændret til v3 uden aftale. Nogle af de nye funktionaliteter kan dog aktiveres i v2 efter ønske. Frontend v3 udskifter grundlæggende al html, css og javascript, og tilføjer derudover forskellig ny standard funktionalitet (front+backend). Overordnet er fordelene i v3 som følger: Mere søgemaskinevenlig opbyging af indhold og URLs, især i varekataloget. Moderniseret og optimeret frontendkode, der fungerer hurtigere og bedre i moderne browsere. Responsive webdesign, der automatisk kan ombryde elementer på mindre enhed er, fx tablets og mobiltelefoner. Enormt fleksible muligheder for at opbygge sine egne standardsider, frit kombineret ud fra alle funktionaliteter. Lettere mulighed for at fremhæve og sammensætte kampagne/ankomstsider med udvalgte varer, optimalt til både kunder og søgemaskiner. For at få fuld udbytte af de tre sidste fordele, kræver det at shoppens layout er grid-baseret, så elementerne passer ind i hinanden. Vi foreslår som udgangspunkt at layoutet er i 960 grid med 10px margen, men det er på ingen måde et krav. I det følgende beskrives specifikke punkter der er nye eller markant ændrede i v3.

2

3

4 1. Katalogsider De gamle varekatalogsider (catalog) fra v2 bruges nu kun til varesøgning, der ikke søgemaskineoptimeres eller promoveres, præcis som det oprindeligt er tænkt. De nye katalogsider baseres i stedet på den type, som den pågældende varegruppe, der vises. Dette er fx Mærke, Kategori, Sektion, Fokusgruppe, Kampagne, Tilbud. Den enkelte katalogside får automatisk indhold (titel, tekst, metatags) ud fra objektet af den pågældende type. Ønsker man fx en katalogside med Adidas, så bruger man som standard url en brand/adidas (eller maerke/adidas ), og så vises automatisk info om mærket Adidas og alle varer herunder. Kunden kan ikke bryde ud af en katalogside, udover ved at vælge en anden katalogside. Fx fra brand/adidas kan man aldrig se mere end alle varer fra Adidas. Dermed undgåes problemet med at kunder og søgemaskiner slippes løs i varektaloget. Tekst og lignende vises altid kun på forsiden af den pågældende katalogside. Hvis der er flere sider med varer, eller andre sorteringer eller filtreringer, så vises teksten ikke på disse, og der opstår dermed ikke duplicate content. Dette sker usynligt for brugeren, da varerne opdateres dynamisk med Ajax-sideskift eller uendelig scroll. Alternativt kan der bruges canonical tags, hvis det ønskes.

5 2. Ankomstsider Ankomstsider (landing pages) er en ny type af sider i frontend, og et nyt punkt i backend. Som udgangspunkt bruges ankomstsider som startsted for brugere der kommer fra fx søgemaskiner eller annoncer, som man ønsker at sende til noget specifikt indhold, fremfor til forsiden. I praksis har de dog langt videre anvendelse, og kan bruges i mange tilfælde. Ankomstsider er valgfrie og frit konfigurerbare sider, som uden begrænsning kan sammensættes af alle andre elementer og funktioner i systemet. Ankomstsider kan også erstatte alle eksisterende systemsider, fx forsiden eller kurven. På den måde kan man forholdsvis let ombygge alle aspekter af shoppen, hvis man ønsker. Ankomstsider har 100% valgfrie url er og meta tags, og kan indeholde varer og blokke.

6 3. Blokke og placeringer Blokke er lavet grundlæggende om siden v2, og det normale menupunkt Blokke i backend udgår derfor. I stedet hører blokke nu kun til ankomstsider - en blok hører altid til én ankomstside. Som i v2 kan blokke placeres i rammen på shoppen (sidehoved, sidefod etc.), og da disse kan defineres per ankomstside, kan man dermed man lave unikke rammer for alle sider. Dertil kan blokke nu også placeres i indholdet på en side. Blokke kan have forskellige grundstørrelser, og når man således sorterer blokkene under en ankomstside, så flyder de automatisk sammen som Tetris-klodser. På den måde kan man lynhurtigt layoute indholdet på en ankomstside, blot ved at flytte blokke op og ned.

7 4. Handlingsblokke En anden ny type blokke er Handlingsblokke. En handlingsblok giver indholdet fra en hvilken som helst anden funktion eller side på shoppen. Som eksempler kan en handlingsblok indeholde en varevisning (valgfri vare), et udsnit af varekataloget (valgfri parametre til udvælgelse af varer), kurven, login-siden, konto-siden eller kontaktformularen. Alle shoppens indbyggede sider og funktioner kan altså betragtes som byggesten, som man så med ankomstsider med handlingsblokke kan bygge sine egne sider med. En handlingsblok kan endda indholde en ankomstsider, hvormed man nemt kan lave alternativer og kombinationer. 5. Fokusgruppeblokke En ny type blokke er Fokusgruppeblokke. En fokusgruppeblok viser alle varerne der er i en fokusgruppe, og er således en meget let måde at vise en gruppering af udvalgte varer, hvorend man ønsker. 6. Automatiske fokusgrupper Fokusgrupper er nu fuldt integreret i systemet og har flere anvendelser. De kan fx bruges som katalogsider, ligesom mærker, kategorier osv. Udover at indeholde manuelt udvalgte varer som i v2, kan fokusgrupper nu også være automatiske. Der kan sættes en række parametre for vareudvælgelsen (fx kategori, mærke, pris), samt et antal og en sortering. På den måde kan fokusgruppen fx automatisk udvælge de 10 mest solgte varer, de 25 nyeste varer etc. Fokusgruppen opdateres hver nat, eller når det ønskes. Fokusgrupper kan også udvælges ud fra interne tags/nøgleord, som kan sættes på varer manuelt.

8

9 7. Menuer Som standard kan man nu manuelt opbygge sine egne menuer i sidehovedet, sidefoden etc. som man ønsker. Man kan også ignorere dette og lade systemet selv sammensætte menuer med faste sider, sektioner og kategorier som i v2.