10 trend í vefhönnun árið 2015

17. apríl 2015
Stefna Ehf
Kíkjum aðeins á hvaða helstu nýjungar hafa sannað sig á undanförnum mánuðum og koma sterk inn í ár!

Kíkjum aðeins á hvaða helstu nýjungar hafa sannað sig á undanförnum mánuðum og koma sterk inn í ár!

Vefhönnun tekur alltaf mið af nýjustu tækni, þörfum notenda og breyttu fegurðarskyni áhorfenda. Við rennum hér yfir nokkur atriði sem hafa verið og eru að festa sig í sessi sem viðurkenndar nýjungar í hönnun vefja. Ekki eru þetta nákvæm vísindi og aðeins dreypt á því helsta sem hafa verið okkur hugleikið undanfarið.

Veftré getur teygt sig í margar áttir

Á vef CP Reykjavík eru tvær valmyndirÁður fyrr var afar hefðbundið og viðurkennt að veftré væri með aðalflokkum og að undirsíður teygðu sig út frá þeim. Þessum hefðbundna strúktúr hefur verið gefið meira frjálsræði og notendur eru farnir að venjast því að tvær eða jafnvel enn fleiri valmyndir hafi mismikið vægi.

Þannig geta vöruflokkar í vefverslun verið aðalvalmynd, en til hliðar við hana önnur valmynd (með tilheyrandi undirsíðum) fyrir upplýsingar um fyrirtækið/félagið/stofnunina, starfsmenn þess og jafnvel stuðningsefni á borð við myndasafn, viðburði og fréttir.

Stærri síður, meira skrun

Forsíða Hekla.is, gott dæmi um stóra skrunsíðu.Ein af skýrari breytingum síðustu mánaða hefur verið að meira efni er sett á hverja síðu. Í sumum tilvikum er allur vefurinn aðeins ein síða (one page). 2know.is vefurinn er gott dæmi um slíkt.

Kostirnir eru margir, þar sem notendur eru orðnir mun vanari skruni og það hefur óneitanlega sína kosti að þurfa ekki að bíða eftir að margar síður hlaðist upp. Gallinn getur verið að síða með miklu efni verður þung í niðurhali, sérstaklega í spjaldtölvum og farsímum.

Ein af lausnunum við þessu er að sækja efnið um leið og skrunað er niður síðuna. Þetta fyrirbæri hefur gengið undir nafninu lazy loading sem þýðir í raun að viðkomandi efni er ekki hlaðið niður þegar síðan er opnuð, heldur sækir vafrinn það þegar notandinn kallar það fram á skjáinn (t.d. með skruni niður síðuna). Vefur Hringbrautar, sem við hönnuðum og settum upp á dögunum, er ágætt dæmi um slíka virkni.

Fækkun síðna

Þátttökusíðan á vef Akraneskaupstaðar er efnismikil með eindæmumAukið efni á hverri síðu hefur það í för með sér að síðum fækkar. Þetta þýðir ekki alltaf að fókus á hverri síðu verði minni en áður, heldur þvert á móti að öllu efni sem viðkemur tilteknu efni er safnað saman á eina síðu.Þannig getur notandi kynnt sér það enn betur án þess að flakka á milli síðna.

Ágæt dæmi eru til dæmis fyrirspurnarform sem felld eru inn í síður (en voru áður sérstakar síður), sama á við um myndaalbúm sem tengjast umfjöllunarefninu eða myndbönd.

Skýr framsetning aðgerða

Á vef Líflands eru aðgerðir vel skilgreindarEitt af því mikilvægasta á hverjum vef er að skilgreina vel, með viðmóts- og grafískri hönnun, hvaða aðgerðir standa til boða og forgangsröðun þess hvaða aðgerð skiptir mestu máli.

Gott er að spyrja sig: „Hvað vil ég að notandinn geri hér?“, hvort sem það er að fara yfir á aðra síðu (til að kynna sér efnið nánar, eða skoða í samhengi), velja að kaupa/panta vöruna, hafa samband með fyrirspurnarformi eða einhver önnur aðgerð. Slíka aðgerðarhnappa (call to action) er mikilvægt að merkja með skýrum hætti, svo þeir blandist ekki saman við annað síður mikilvægt efni síðunnar.

Jörðin er ekki flöt, en vefurinn þinn getur verið það

Vefur Sæluhúsa er gott dæmi um flata hönnunMeð flatri vefhönnun er átt við að skuggar og upphleyptir hnappar (með tilheyrandi skuggum) hafa þótt heldur lummó undanfarið. Þetta er hluti af einföldun í hönnun, þar sem aukaatriðin, sama hversu smávægileg þau kunna að virðast, fá að víkja fyrir einfaldleika og skýrri framsetningu.

Þetta getur haft það í för með sér að vefir virðast e.t.v. í auknum mæli vera áþekkir hvor öðrum. Litir, uppröðun og val á efni inn á síðuna fær því enn meira vægi en áður, þar sem útlitslegar „æfingar“ eru komnar úr tísku.

Myndbönd gleðja

Útskýringarmyndband frá VodafoneÍ stað þess að skrifa langlokur eða útskýra efni í samblandi texta og myndmáls er hægt að fá fagaðila til að setja upp og útskýra vörur og þjónustu, eða bara hvað sem er á myndrænan og líflegan hátt með myndböndum.

Minna og minimalískara leiðakerfi

Farsímavefir og skalanlegar útgáfur af hefðbundnum vefjum hafa haft mikil áhrif á uppbyggingu á leiðakerfi. Einfaldleikinn sem aðlögun að minni skjáum hefur í för með sér smitast yfir á öll stig hönnunar. Þetta leiðir af sér að leiðakerfi er aðgengilegra en áður.

Þróunin hefur verið mjög sterk í átt að stærri leiðakerfisflekum á borð við þá sem notast er við á jafnt vef Akraneskaupstaðar og Fjallabyggðar, en „hamborgarinn“ eins og táknmyndin fyrir leiðakerfi á farsímum er jafnan kölluð, verður vafalaust fyrirferðarmeiri á næstunni.

Virk tenging við samfélagsmiðla

Westfjords.is hvetur til Instagram notkunarSamfélagsmiðlar geta virkað jafnt sem aðdráttarafl inn á vefinn þinn sem og orðið hluti af vefnum. Eins og gefur að skilja eru þeir afar vel til þess fallnir að nálgast notendur vefsins á þeirra forsendum, hvort sem er með myndefni, beinum samskiptum eða móttöku ábendinga og spurninga.

Twitter getur hentað mjög vel til að taka við fyrirspurnum og bæta í kjölfarið framsetningu upplýsinga á vefnum til samræmis við óskir notenda. Með Instagram er jafnt hægt að miðla eigin myndum og hvetja notendur til að merkja myndir af þinni vöru eða þjónustu með viðeigandi hætti. Möguleikarnir eru margir og þarf alltaf að skoða með tilliti til þjónustu og áherslna viðkomandi fyrirtækis, stofnunar eða félags.

Hvað vill notandinn þinn gera og hvað vilt þú að hann geri?

Á vef Icelandair Hotels er bókunarvél blandað inn í stærsta bannerinnÞað getur verið nóg að spyrja sig einfaldra spurninga til að draga fram aðalatriði í hönnuninni. Spurningar á borð við: „Hverju eru notendur helst að leita að?“ og „Hvað er óljóst í þessari framsetningu?“ geta leitt hönnunina áfram í markvissa átt að betra viðmóti og skilvirkari framsetningu upplýsinga.

Það mætti ætla að þetta segði sig sjálft, en oftar en ekki eru mikilvægustu atriði vefsins allt í einu orðnar ósýnilegar eða lengri leið en þarf að vera af aðalsíðu í mikilvægustu aðgerðina.

Öðruvísi hugsun, metnaður!

Á vef Hilton Nordica er valmyndin vinstra meginÞað stendur alltaf fyrir sínu að brjótast út úr hefðbundnum hlekkjum hugarfars og hefða. Þetta getur þó verið mjög vandmeðfarið, þar sem notendur bregðast heldur illa við þegar hlutirnir virka ekki eins og þeir „eiga að gera“.

Passa þarf vel upp á að staðsetning á leiðakerfi sé skýr, venjur um hvar eigi að smella og hver hegðun er þegar smellt er fái að halda sér og að notandi þurfi ekki að „læra ᓠvefinn. Að því sögðu er mikið svigrúm til að prófa spennandi framsetningu þar sem upplýsingarnar fá að njóta sín til fulls með öðrum hætti en notendur eiga að venjast.

Góð dæmi um þetta eru á síðum þar sem sterkt myndmál með risastórum texta skapar sterk hughrif en e.t.v. ekki mikið á því að græða fyrir notendur sem sækja sér upplýsinga. Í þeim tilvikum er stóra spurningin hvort stóra myndin réttlæti niðurskurð á hreinlega öllu öðru á borð við valmynd, aðgerðarhnöppum og efniseiningum sem leiða áfram inn á undirsíður.

Þyrstir þig í meira?

Kíktu á nokkra af þessum vefjum og skoðaðu gagnlegar pælingar annarra í vefbransanum um trendin í hönnun í dag:

Einhverjar spurningar eða ábendingar? Sendu okkur línu!