WordPress-vinkit

VERKKOSIVUPROJEKTIN KÄYTTÖLIITTYMÄSUUNNITTELU – VALMIINA VISUAALISEEN SUUNNITTELUUN

Kun sivuston rakenne ja navigaatio on lyöty lukkoon, voidaan niiden ympärille miettiä tarvittavat sivumallit, jotka muodostavat niin sanotun rautalangan sivustolle. Usein mallit tehdään noin 5-8 erilaisesta sivutyypistä. Loput tarvittavat sivut voidaan soveltaa näiden perusteella.

Sivupohjamallit tehdään usein seuraavista elementeistä:

  • Etusivu
  • Yhteystietosivu ja mahdollisesti henkilökuntaesittelysivut
  • Artikkelisivu (uutis- tai blogiartikkeli)
  • Tuote- ja/tai palvelunkuvaussivu
  • Referenssisivu
  • Arkistosivu
  • Hakutulossivu

Kussakin verkkosivuprojektissa mietitään 

  • montako erilaista sivutyyppiä pitää piirtää rautalangoiksi,
  • mitkä sisältötyypit voivat käyttää joko kokonaan tai osittain samaa sivumallia, ja
  • kuinka paljon ja millaista sisältöä sivuille on mahdollista tuottaa, erityisesti kuvien ja videoiden saatavuus.

Kun sivuston rakenne ja navigaatio on lyöty lukkoon, voidaan niiden ympärille miettiä tarvittavat sivumallit, jotka muodostavat niin sanotun rautalangan sivustolle.

ERILLISET NÄKYMÄT SIVUTYYPEILLE HELPOTTAVAT KÄYTTÖÄ

Rautalankoihin mietitään sopivat sisältölohkokokonaisuudet tarvittavia sisältöjä ja tarpeita varten. Yleensä hyödynnetään WordPressin (tai muun sisällönhallintajärjestelmän) vakiolohkoja, jotka voidaan kustomoida, ja tarvittaessa suunnitellaan myös mittatilauslohkoja juuri tiettyä tarvetta varten.

Periaatteessa, koska sivut koostuvat lohkoista, voitaisiin käyttöliittymäsuunnittelussa luoda vain yksi massiivinen sivumalli, jossa olisi mukana kaikki tarvittavat sisältölohkot. Eri sivutyypit on kuitenkin helpompi hahmottaa ja erotella toisistaan, kun UX-protoon luodaan erilliset näkymät kullekin sivutyypille

Käyttöliittymää varten suunnitellaan peruselementtien, kuten otsikot, leipätekstikappaleet, listat, mediaelementit ja taulukot, lisäksi tarpeen mukaan esimerkiksi

  • haitarielementtejä, jotka aukeavat ja sulkeutuvat klikkaamalla, jolloin sisältöä voidaan piilottaa erityisesti pitkillä sivuilla,
  • laskureita,
  • nostolaatikoita,
  • bannereita, ja
  • lomakkeita.

LOHKOJA YHDISTELEMÄLLÄ UNIIKKI SIVUSTO

Sivumallit ovat käytännössä siis lohkokokoelmia. Lohkoja voi vapaasti käyttää myös muussa järjestyksessä ja luoda tarvittaessa uudenlaisia kokonaisuuksia, jolloin kustakin sisältösivusta voidaan rakentaa uniikki. WordPressin Gutenberg-editori mahdollistaa myöhemmin ylläpitovaiheessa myös täysin uusien sivutyyppien luomisen vain käytettävissä olevia lohkoja eri tavoin yhdistelmällä. 

Kun käyttöliittymäsuunnittelu on valmis ja rautalangat on hyväksytty, voi sisällönsuunnittelu ja -tuotanto alkaa yhtä aikaa visuaalisen suunnittelun kanssa. 

Tarvitsetteko apua Käyttöliittymän suunnittelussa?

Jos haluat keskustella siitä, miten voisimme Verkkoasemalla auttaa sinua, varaa aika tuotantojohtajamme Joni Norringin kalenteriin!

Joni Norring

Sinua saattaisi kiinnostaa myös nämä