Expander (Laajennuspaneeli)
Laajennuspaneeli piilottaa näkyvistä otsikon alle määriteltyä informaatiota tai sisältöä. Laajennuspaneeli helpottaa käyttäjää hahmottamaan sellaisia näkymiä, jossa on laajasti sisältöä. Komponenttia käytetään, kun tilaa on pystysuunnassa rajoitetusti. Komponentin avulla sivun pituutta voidaan lyhentää.
Saavutettavuus ja käytettävyys
- Laajennuspaneelien käytössä tulee erityisesti huomioida kognitiivinen saavutettavuus, koska laajennuspaneeli piilottaa osan sisällöstä. Käyttäjät eivät välttämättä huomaa paneelikomponentin olemassaoloa tai eivät ymmärrä, miten komponenttia tulisi käyttää.
- Ensisijaisesti kannattaa miettiä, voiko sisältöä ryhmitellä, lyhentää tai jakaa niin, että sisältö on hallittavissa ilman laajennuspaneelin käyttämistä.
- Laajennuspaneelia tulee käyttää vain, jos sisältöä on erityisen paljon ja käytettävyyden kannalta on perusteltua lyhentää sivun pituutta erillisiin paneeliosioihin.
- Laajennuspaneelia ei tule mielellään käyttää sellaisissa tapauksissa, joissa sisältö on olennaista käyttäjille.
- Liian pitkien laajennuspaneelien kokonaisuuksia tulisi välttää.
- Suomi.fi:ssa laajennuspaneelia on käytetty silloin, kun sisältöosuus on erityisen pitkä. Tällä tuetaan kokonaisuuden hahmottamista.
Mistä komponentti koostuu
Laajennuspaneelissa on otsikko ja sisältöalue. Otsikko tiivistää sisällön ja se voidaan ilmaista myös kysymysmuodossa. Laajennuspaneelin sisältöalue kertoo otsikon aiheesta tarkemmin. Mikäli yksittäisen laajennuspaeneelin sisältö on erityisen laaja, sisältöalueella voidaan käyttää toista tarkentavaa ja sisältöä ryhmittävää otsikkoa.
Koko ja käyttö
Käytä laajennuspaneelia ainoastaan sisällölle, jonka ei ole välttämätöntä olla käyttäjälle näkyvissä koko ajan. Laajennuspaneelia voidaan myös käyttää vähemmän tärkeälle sisällölle.
Laajennuspaneelin sisällössä on oletusarvoisesti täytettä (padding). Tämä voidaan poistaa "noPadding" attribuutilla, mikäli oma tyylitys sen vaatii.
Yksittäinen laajennuspaneeli (Single Expander)
Yksittäistä laajennuspaneelia käytetään, kun on tarvetta on ainoastaan yhdelle paneelille, esimerkiksi sisältökokonaisuudessa toistuvalle tietosisällölle.
Laajennuspaneeliryhmä (Expander Group)
Laajennuspaneeliryhmä koostuu useasta (kaksi tai useampi) päällekkäisestä yksittäisestä laajennuspaneelista. Laajennuspaneeliryhmä liittyy yhteen sisältökokonaisuuteen. Sivunäkymässä voi olla monta erillistä laajennuspaneeliryhmää, jotka on selkeästi eritelty toisistaan alaotsikoita hyödyntäen. Yksittäisen laajennuspaneeliryhmän yläkulmassa on "Avaa kaikki" toiminto, jonka avulla kaikki ryhmän paneelit saa halutessaan auki. Auki ollessa toiminto muuttuu muotoon "Sulje kaikki", jonka avulla kaikki ryhmän paneelit saa kiinni. Toiminto helpottaa käyttäjää pääsemään käsiksi heti koko sisältöön ja se myös parantaa paneelien sisällä olevasta sisällöstä etsimistä.