Enhetssida 2.0 – så hanterar vi 1 000 mikrosajter

Göteborgs Stad är en stor kommun – en av Sveriges största. Vi har omkring 400 förskolor, 140 grundskolor, 60 äldreboenden och 25 bibliotek. Det är en utmaning i många sammanhang och webben är inget undantag.

Att presentera flera hundra enheter i en meny på en webbplats ger ingen vidare överblick för användaren. Därför har vi valt att skapa mikrosajter för många av våra enheter. Tanken är att det som är generellt och gäller för alla enheter i staden ska presenteras på goteborg.se medan det som är lokalt och specifikt för en enhet presenteras på en enhetssida.

Utseendemässigt ser enhetssidorna likadana ut med Göteborgs Stads logga tydligt synlig. Tanken är att användarna ska förstå att enheten är en del av Göteborgs Stad.

Exempel på enhetssida för en förskola.
Exempel på enhetssida för en förskola.

Gedigen behovsinventering

Sammanlagt har vi omkring 1 000 enhetssidor och just nu håller vi på att rulla ut nya versioner av dessa mikrosajter – ett projekt vi kallat Enhetssida 2.0 och som pågått i mer än tre år.

En stor del av projekttiden gick åt till att göra en gedigen behovsinventering för att ta reda på medborgarnas behov. Den processen har vi tidigare beskrivit här på bloggen i inlägget Enhetssida 2.0: Mikrosajter utifrån besökarnas behov.

I resultaten från behovsinventeringen kunde vi se vilka ämnen som var de mest efterfrågade av våra användare. Och utifrån de ämnena tog vi sedan fram generella webbstrukturer för de verksamheter som hade flest enhetssidor:

  • Förskolor
  • Grundskolor
  • Bibliotek
  • Fritidsgårdar
  • Gymnasieskolor
  • Äldreboenden
  • Bad- och simhallar
  • Gym
  • Motionsanläggningar

Enklare för webbredaktörer med mallpaket

I projektet för Enhetssida 2.0 är två viktiga effektmål att göra det enklare för kommunens webbredaktörer att administrera sina enhetssidor och att innehållet på sajterna bättre ska motsvara vad användarna faktiskt efterfrågar.

För att möta de effektmålen finns en teknisk lösning som ger redaktörerna en färdig struktur när de beställer en ny enhetssida, så de slipper uppfinna hjulet varje gång. När vi skapar en enhetssida för en förskola så får redaktören därmed en halvfärdig sajt med de viktigaste undersidorna, puffarna och externa länkarna redan förskapade. Detta kallar vi för ett mallpaket. Det finns ett mallpaket för förskolor, ett mallpaket för grundskolor och så vidare.

Men vi vill också centralt kunna justera enhetssidorna allt eftersom nya behov uppstår. Därför har vi utvecklat en funktion för att kunna skjuta ut nya sidor, puffar och länkar inom ett mallpaket. Det vill säga kunna lägga till en ny sida på samtliga befintliga förskolor. Eller för den delen kunna ta bort en sida från samtliga befintliga förskolor.

Det gör att det stora jobb vi lade ner på att ta fram en gemensam struktur för flera verksamheter inte var en engångsinsats utan att vi kan fortsätta att upprätthålla och utveckla den.

Gemensamt innehåll

Ett uttalat mål med Enhetssida 2.0 är att minska dubbelpubliceringen. Det vill säga att undvika att vi skriver i princip samma sak på flera olika ställen på webben. För att lyckas med det gör vi det möjligt för enhetssidorna att dela på gemensamt innehåll. Här finns det två varianter:

  • Innehållet finns redan på goteborg.se och eftersom enhetssidorna byggs på samma plattform kan vi återanvända innehållet. Ändras innehållet på sidan på goteborg.se slår ändringen också igenom automatiskt på samtliga enhetssidor.
    Gemensamt innehåll_1
  • Innehållet är gemensamt för flera enhetssidor och innehållet delas mellan dem. Innehållet lagras i vårt CMS (Content Management System) och visas upp på flera enhetssidor. Ändras innehållet på en enhetssida slår det även igenom på övriga enhetssidor.
    Gemensamt innehåll_2

Egna grafiska profiler

Vissa verksamheter i Göteborgs Stad har fått tillåtelse från kommunfullmäktige att presentera sina verksamheter med egna grafiska profiler. Ett exempel på detta är kommunens femtontal gymnasieskolor. Dock vill vi kunna erbjuda även dem att vara en del av Enhetssida 2.0. Därför har vi gjort det möjligt för dem att ha egna loggor, sidhuvuden och färgpaletter på sidan, men i grunden är det samma layout, navigering och funktioner som erbjuds.

Bernadottegymnasiet
Exempel på enhetssida med annan grafisk profil än Göteborgs Stads.

 

2 kommentarer


  1. Hej intressant läsning!

    Jag är nyfiken på hur ni praktiskt/tekniskt hanterar tematiseringen av enhetssidorna? Främst med färgerna. Låter ni redaktörerna redigera egenskaper som styr färgerna på olika element eller utvecklar ni separata CSS-filer som ’lager’ ovanpå, eller gör ni på något annat sätt?

    Hade browserstödet för CSS-variabler varit bättre hade man kanske kunna definiera dessa i och låta CMS-egenskaper styra. Jag tror LESS har något magiskt där den typ kan ta url-parametrar för att påverka variabler, dock använder jag själv SASS och mig vete går det inte där.

    Svara

    1. Hej Mathias! Så här funkar det enligt en av våra gränssnittsutvecklare.
      Vi har, precis som du skriver, ett extra ”lager” med CSS-regler som kör över standardutseendet. Dock påverkas inte slutresultatet av variabler eftersom en CSS-fil ändå måste genereras, med eller utan SASS/LESS.

      Svara

Kommentera

E-postadressen publiceras inte. Obligatoriska fält är märkta *