Ingångar
Ingångar används för att leda användaren vidare till mer prioriterat innehåll. De kan t ex placeras i början av en huvudsida för att lyfta fram viss innehåll på undersidor eller efter en artikel för att lyfta fram relaterat innehåll. Ingångarna är ett perfekt stället att personalisera eller lyfta ett innehåll längre ner i strukturen.
Huvudingångar
Denna typ är framförallt till för att styra användargrupper åt rätt håll och prioritera på webbplatsen och bör användas högt upp i strukturen. Ingångarna placeras på en eller flera rader. Är antalet ingångar ojämt så lämnas ytan tom automatiskt. Ingången består av bild, rubrik, ingress och CTA (uppmaning). Ingången är klickbar.
Tänk på
- Ingångar med tre kolumner ska inte representera ALLA sidor längre ner i strukturen utan dom som är mest relevanta. Alla sidor hittar man istället i megamenyn.
- Försök att undvika att ha en ingång per rad i utgångsläget.
- Variera bildernas utseende så det uppstår en dynamik i innehållet. Komplettera foton med illustrationer eller piktogram där det passar.
- En lockande rubrik.
- En beskrivande ingress på max 140 tecken
- En CTA (knappen) som uppmanar eller visar på vad som händer när jag klickar
Rekomenderad placering
- Högt upp på sidan.
- Efter hero eller ö med eller utan sektionsrubrik (för sektionen ingångar, t ex “Mina tjänster”).
- Efter pageheader utan sektionsrubrik
Kan exempelvis användas på nivåerna:
- sodra.com
- sodra.com/Om Södra
- sodra.com/Om Södra/Pressrum
Exempel
3 kolumner
4 kolumner
6 kolumner
Megaingångar
Megaingångar används på startsidan och sparsamt på sektionsidor. Syftet men megaingångarna är att styra användargrupper åt rätt håll och ge en känsla för webbplatsen och dess innehåll. Ingången består av bild, rubrik, ingress och CTA (uppmaning). Ingången är klickbar.
Tänk på
- Megaingångar representerar inte ALLA sidor längre ner i strukturen utan dom som är mest relevanta. Alla sidor hittar man istället i megamenyn
- Alltid fyra stycken
- Variera bildernas utseende så det uppstår en dynamik i innehållet
- Välj en bild som inte är för detaljerad och som fungerar att ha som bakgrund med vit text på
- En lockande rubrik
- En beskrivande ingress på max 140 tecken
- En CTA (knappen) som uppmanar eller visar på vad som händer när jag klickar
Rekomenderad placering
- Dessa placeras alltid efter pageheader eller hero.
Kan exempelvis användas på nivåerna:
- sodra.com
- sodra.com/Om Södra
Exempel
Den här modulen håller sig normalt inom den normala maxbredden men finns i en variant som blir extra bred. Det åstakommer man genom att lägga till klassen .is-wide på rotelementet.
Product
We help you find exactly the pulp that best matches your requirements.
Innovation
We help you find exactly the pulp that best matches your requirements. At your choice is hard and soft wood pulp in a wide variety of qualities, to match almost any specification.
Facts
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Modi quae porro officiis quas vitae impedit, voluptas repudiandae recusandae magnam suscipit, corporis eveniet ea voluptatum saepe explicabo molestias voluptates eum magni.
Support
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint repellat quos quisquam at aut necessitatibus facilis dolores qui, adipisci vitae cum officiis.
Product
We help you find exactly the pulp that best matches your requirements.
Learn more
Innovation
We help you find exactly the pulp that best matches your requirements. At your choice is hard and soft wood pulp in a wide variety of qualities, to match almost any specification.
Learn more
Facts
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Modi quae porro officiis quas vitae impedit, voluptas repudiandae recusandae magnam suscipit, corporis eveniet ea voluptatum saepe explicabo molestias voluptates eum magni.
Learn more
Support
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint repellat quos quisquam at aut necessitatibus facilis dolores qui, adipisci vitae cum officiis.
Learn more
Mega-mini-ingångar
Mega-ingångar-mini används sparsamt på undersektionsidor. Syftet men mega-mini-ingångarna är att styra användargrupper åt rätt håll och ge en känsla för webbplatsen och dess innehåll. Ingången består av bild, rubrik, ingress och CTA (uppmaning). Ingången är klickbar.
Tänk på
- Mega-mini-ingångar representerar inte ALLA sidor längre ner i strukturen utan dom som är mest relevanta. Alla sidor hittar man istället i megamenyn
- Alltid sex stycken
- Variera bildernas utseende så det uppstår en dynamik i innehållet
- Välj en bild som inte är för detaljerad och som fungerar att ha som bakgrund med vit text på
- En lockande rubrik
- En beskrivande ingress på max 50 tecken
- En CTA (knappen) som uppmanar eller visar på vad som händer när jag klickar
Rekomenderad placering
- Dessa placeras alltid efter pageheader eller hero.
Kan exempelvis användas på nivåerna:
- sodra.com/Om Södra
- sodra.com/Om Södra/Pressrum
Exempel
Den här modulen håller sig normalt inom den normala maxbredden men finns i en variant som blir extra bred. Det åstakommer man genom att lägga till klassen .is-wide på rotelementet.
Product
We help you find exactly the pulp that best matches your requirements.
Innovation
We help you find exactly the pulp that best matches your requirements. At your choice is hard and soft wood pulp in a wide variety of qualities, to match almost any specification.
Facts
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Modi quae porro officiis quas vitae impedit, voluptas repudiandae recusandae magnam suscipit, corporis eveniet ea voluptatum saepe explicabo molestias voluptates eum magni.
Support
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint repellat quos quisquam at aut necessitatibus facilis dolores qui, adipisci vitae cum officiis.
Product
We help you find exactly the pulp that best matches your requirements.
Learn more
Innovation
We help you find exactly the pulp that best matches your requirements. At your choice is hard and soft wood pulp in a wide variety of qualities, to match almost any specification.
Learn more
Facts
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Modi quae porro officiis quas vitae impedit, voluptas repudiandae recusandae magnam suscipit, corporis eveniet ea voluptatum saepe explicabo molestias voluptates eum magni.
Learn more
Support
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint repellat quos quisquam at aut necessitatibus facilis dolores qui, adipisci vitae cum officiis.
Learn more
Underliggande ingångar (fyra kolumner)
Denna typ är framförallt till för att visa upp underliggande sidor i strukturen. Ingångarna placeras på flera rader och ska vara klickbara. Är antalet ingångar ojämt så lämnas ytan tom automatiskt. Ingången består av bild, rubrik, ingress. Ingången är klickbar.
Tänk på
- Ingångar med fyra kolumner behöver inte representera alla sidor längre ner i strukturen men dom kan göra det. Alla sidor hittar man i megamenyn.
- Försök att undvika att ha en ingång per rad i utgångsläget.
- Variera bildernas utseende så det uppstår en dynamik i innehållet. Komplettera foton med illustrationer eller piktogram där det passar.
- Välj en bild som inte är för detaljerad och som fungerar att ha som bakgrund med vit text på
- En lockande rubrik
- En beskrivande ingress på max 50 tecken
Rekomenderad placering
- Högt upp på sidan eller långt ner på sidan.
- Efter hero eller ö med eller utan sektionsrubrik (för sektionens ingångar, t ex “Mina tjänster”)
- Efter pageheader utan sektionsrubrik
Kan exempelvis användas på nivåerna:
- sodra.com/Om Södra/Pressrum
- sodra.com/Om Södra/Pressrum/Tjänster
Exempel
Den här modulen håller sig normalt inom den normala maxbredden men finns i en variant som blir extra bred. Det åstakommer man genom att lägga till klassen .is-wide på rotelementet.
Product
We help you find exactly the pulp that best matches your requirements.
Innovation
We help you find exactly the pulp that best matches your requirements. At your choice is hard and soft wood pulp in a wide variety of qualities, to match almost any specification.
Facts
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Modi quae porro officiis quas vitae impedit, voluptas repudiandae recusandae magnam suscipit, corporis eveniet ea voluptatum saepe explicabo molestias voluptates eum magni.
Support
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint repellat quos quisquam at aut necessitatibus facilis dolores qui, adipisci vitae cum officiis.
Product
We help you find exactly the pulp that best matches your requirements.
Learn more
Innovation
We help you find exactly the pulp that best matches your requirements. At your choice is hard and soft wood pulp in a wide variety of qualities, to match almost any specification.
Learn more
Facts
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Modi quae porro officiis quas vitae impedit, voluptas repudiandae recusandae magnam suscipit, corporis eveniet ea voluptatum saepe explicabo molestias voluptates eum magni.
Learn more
Support
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint repellat quos quisquam at aut necessitatibus facilis dolores qui, adipisci vitae cum officiis.
Learn more
Relaterade och underliggande ingångar (sex kolumner)
Denna typ är framförallt till för att visa upp underliggande eller liknande sidor i strukturen. Ingångarna placeras på flera rader och ska vara klickbara. Är antalet ingångar ojämt så lämnas ytan tom automatiskt. Ingången består av bild och rubrik. Ingången är klickbar.
Tänk på
- Ingångar med sex kolumner behöver inte representera sidor längre ner i strukturen utan snarare sidor på samma nivå som sidan dom finns på.
- Försök att undvika att ha en ingång per rad i utgångsläget.
- Foton används
- En beskrivande rubrik
- Använd alltid sektionsrubrik (för sektionens ingångar, t ex “Liknande tjänster”)
Rekomenderad placering
- Längst ner på sidan, efter huvudinnehållet och innan sidfoten.
Kan exempelvis användas på nivåerna:
- sodra.com/Om Södra/Pressrum
- sodra.com/Om Södra/Pressrum/Tjänster
Exempel
Den här modulen håller sig normalt inom den normala maxbredden men finns i en variant som blir extra bred. Det åstakommer man genom att lägga till klassen .is-wide på rotelementet.
Heading
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Heading
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Heading
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Heading
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Heading
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Heading
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Product
We help you find exactly the pulp that best matches your requirements.
Learn more
Innovation
We help you find exactly the pulp that best matches your requirements. At your choice is hard and soft wood pulp in a wide variety of qualities, to match almost any specification.
Learn more
Facts
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Modi quae porro officiis quas vitae impedit, voluptas repudiandae recusandae magnam suscipit, corporis eveniet ea voluptatum saepe explicabo molestias voluptates eum magni.
Learn more
Support
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint repellat quos quisquam at aut necessitatibus facilis dolores qui, adipisci vitae cum officiis.
Learn more