Beroende på vilken sidtyp du har finns det rekommendationer för hur du använder en puff.

Genomgångssida

Puff används för att leda besökaren vidare i navigeringen. Genomgångssidan består till största del av puffar. Rekommendationen är att undvika puffar till sidor utanför gu.se på genomgångssidor, eftersom syftet med dessa sidor är att leda besökaren vidare i navigeringen på gu.se.

Informationssida

Puff används för relaterad information till den rena faktan som finns på informationssidan. Du lägger då puffen längst ner på sidan i en grå sektion med rubriken “Relaterad information”.

Utbildningssida

Puff används för relaterad information till den rena faktan som finns på utbildningssidan. Då lägger du puffen längst ner på sidan i en grå sektion med rubriken “Relaterad information”.

Nyheter

Puff används för relaterad information och hamnar automatiskt längst ner på sidan. Rubriken är Relaterat innehåll och går inte att ändra.

Forskningsprojekt/grupp

Puff används för relaterad information och läggs längst ner på sidan i en grå sektion med rubriken “Relaterad information.”

Forskningsreportage/porträtt

Puff används för relaterad information och hamnar automatiskt längst ner på sidan. Rubriken är Relaterat innehåll och går inte att ändra.

Rekommendationen är att länka vidare till sådant innehåll som Göteborgs universitet inte äger. Vi ska alltså inte skriva om innehåll som inte är vårt, utan istället länka vidare. Däremot är det viktigt att vi länkar till bekräftade och säkra webbsidor.

Vi länkar också till relevant innehåll, vilket innebär att du inte bara ska länka till startsidan på en webbplats utan till själva sidan där informationen som du vill att besökaren ska ta del av finns.

Titeln i själva puffen ska vara samma som sidans titel. Under Etikett/kategori är rekommendationen att du skriver vilken webbplats du länkar till. Undvik också att använda ingress och bild i en puff som går till sida utanför gu.se, till exempel:

Du har möjlighet att anpassa puffen beroende på placering. Det finns rekommendationer för hur du ska anpassa puffen.

• Rekommendationen är att titeln börjar med Hitta… till exempel Hitta sommarkurser, Hitta masterprogram.

• Använd inte etikett/kategori

• Använd ingress om det tydliggör vad länken leder till. Annars kan vara bra att undvika ingress för att puffen inte ska kännas rörig.

• Om bild används i puffen, se till så att bilden inte är för stökigt samt att den inte innehåller någon text. Då syns länktexten som lägger sig över fotot bättre och besökaren har lättare att uppfatta vart puffen leder.

Beroende på vilken sektionstyp du har valt ser puffarnas storlek olika ut i desktop (i mobil är majoriteten av puffarna alltid lika stora). Puffar i en sektion ska alltid vara överskådliga och ha en struktur. Rekommendationen är att max antal puffar i en sektion är sex stycken. Vill du ha fler puffar skapar du fler sektioner.

Generellt finns det ett visst samband mellan puffens storlek och besökarens benägenhet att klicka på den. Men för att skapa ett snyggt flöde för besökaren är rekommendationen att du kombinerar olika storlekar på puffar.

Puffarnas utseende skiljer sig åt beroende på om besökaren är på en mobil eller i desktop, till exempel syns aldrig sammanfattningen i en puff på en mobil.

Storleken på puffen är också likadan vid majoritet av sektionstyperna, det skiljer sig bara åt för sektionstypen Fullbredd. Detta kan göra att en sida som känns ganska kort i desktop blir väldigt lång i mobil. Kom därför ihåg att alltid kolla hur din sida ser ut i mobil!