Najbolj napredne spletne strani 2016

Če boste v letu 2016 menjali ali gradili novo spletno stran, potem morate vedeti, v katero smer se razvija splet, kaj ponujajo tehnologije ter kaj vse mora imeti spletna stran v letu 2016, da bo “sodobna”.

Po Google smo brskali za nekaj najbolj naprednih spletnih strani leta 2016. Zanimalo nas je, v katero smer se razvija splet, kaj omogoča html5 in katere druge tehnologije se uporabljajo. Kakorkoli, spodaj najdete nekaj primerov spletnih strani, ki so “pred časom” in trende spletnih strani za 2016. 

spletne strani

Uporabnost & navigacija spletne strani

Poosebitev spletnih strani za uporabnika

Prvi trend spleta je kot leta poprej, še vedno poosebitev vsebine. Ne zanima nas, kar nam ni dostopno (npr. Amazon za ZDA), ali Opera, če imamo Windows, ali pa cenik za korporacije, če smo s.p.

Zanima nas spletna stran, ki nas “razume” toliko, da nam ponudi aktualne informacije. Zanima nas rezultat, ki odgovarja na naše vprašanje, ki nudi pravi odgovor, za naš čas, lokacijo in potrebo. Če je to oglas ali ne, nam je pravzaprav vseeno.

spletna stran napredna 2016

Spodnja spletna stran deluje na html 5 in sodeluje z Google-nom ter Google streetview in maps. Predtsavlja bend, ki vam pokaže videospot, ki ga izdela “v vašem domačem kraju” s pomočjo streetview. Sočasno zavrtijo svojo pesem. Postopek je, da v okno spletne strani vpišete svoj domači kraj, lokacijo, nato pa vam program iz materiala na Google  sestavi video (proces je zahteven za procesor, zato se predlaga zaprtje oken v brskalniku ter zaprtje ostalih programov).

Poglejte si “The wilderness downtown

Poenotenje ali enoličnmost spletnih strani

Spletne strani so si vedno bolj podobne, večina jih je neprepoznavnih in dolgočasnih. po drugi strani pa spletne strani dobivajo neke enotne mere, se funkcionalno standardizirajo, s tem pa nam lajšajo uporabo. Ko zaidemo na novo spletno stran, vemo, kaj pomenijo tri črtice, vemo, kaj pomeni “shareikona in tako naprej. Omenjena simbola in drugi, bi nam v večini bili nerazumljivi še pred nekaj leti. Vprašanje sodobnosti je verjetno v prvi vrsti, kako to poenotenje spletnih strani uporabiti bolje, inovativno in ga poglobiti?

Poznavanje simbolov omogoča hitrejše branje, varčuje z našo energijo, poenotenost lokacij oz. strukture menijev, kot je npr. “hamburger menu” pa na račun poenotenosti, to je našega poznavanja zgradbe menija (saj vemo, kje kaj iskati) ne otežuje uporabe, struktura menija pa omogoča več prostora za dinamično ali slikovno vsebino, za zabavo in uporabo, medtem, ko je na prvi obisk nezanimiva vsebina lepo pospravljena.

Dober primer napredne spletne strani, ki bi mu raje rekli osnutek, a predstavlja vrhunsko in napredno idejo najdete na silenza.it.

Brskajte s telefonom (po računalniku)

silenza spletna stran

Zgoraj omenjena spletna stran poleg hamburgerja predtsavlja idejo uporabe spletne strani s pametnim telefonom. Omenjeno vam omogoča, da se udobno namestite v naslonjač in na “interaktivno” pogledate njihov oglas. Preverite!

Za spletno analitiko je vedno vprašanje, kako meriti bolje, zadnja leta predvsem želimo povezati obiske posameznih uporabnikov, ki dostopajo z mobilnih in namiznih naprav. Rešitev je odlična.

Popestrite postopek registracije

Registracija in obrazci spletne strani

Hja ti so nujno zlo, ki na koncu po pol ure javi “popravite zgornje napake”. Čas gre dalje z njim razvoj. Preverite interaktivne obrazce na typeform.com. Uporabljajo jih vsi “ta resni”.

Podobno rešitev na WordPress smo izdelali za eno naših strank Pancopy, oglejte si postopek, izračunaj ceno za vezavo diplomske naloge.

Ne klikajte, raje drsite po spletni strani

Scroll je lažji od klika. Če ne boste kliknili na “nakup“, vas bomo pa tja zapeljali! Koncept dolgih strani za scroll-anje je nastal po zaslugi pametnih telefonov in tablic, je pa hvaležna oblika za vsa podjetja, ki uporabljajo storytelling, ki želijo sporočiti svojo zgodbo.

elementare-projektiranje-interier

Zgodba je povedana, še preden se zavemo, da jo pripoveduje. Primer je spletna stran, ki smo jo izdelali za projektiranje notranje opreme, Element-Are.

Vsebino v kontejnerje
spletna stran wordpress

“content containers” po domače, ali “card layout” je dobra rešitev za dve stvari. Prvo je branje, uporabnik lažje prebere vsebino razvrščeno v kartice. Druga prednost je dinamično razvrščanje kartic/kontejnerjev glede na velikost zaslona uporabnika.

Dober primer je thenextweb.com, malo slabši pa naš blog outdooraktivnosti.si.

Nagovorite čutila

wordpress spletna stran

 

Vid naj bi bil #1 čutilo, po količini informacij, ki jih sprejema. “HD hero images” so bannerji (zastave), ki so #1 na spletni strani. To so slike, ki so se prikazovali na najbolj vidnem mestu, vrhu spletne strani, sedaj pa čez celo stran, preden “scroll”-amo. Razvoj tehnologije je omogočil hitro nalaganje velikih HD fotografij, ali posnetkov. Ti lahko hitro in zanesljivo prenesojo sporočilo, zato so kar ključni (pri logični uporabi).

Ena boljših idej je predstavljena kriesi.at, pri temi, ki jo uporablja tudi ena naših strank, oglejte si jo (v izvorni verziji).

Bogate(?) animacije

Animacije delimo na take, ki delujejo ob/po/pred dejanju/em uporabnika in take, ki delujejo ne glede na uporabnika.nalaganje spletne strani

Primer prvih je, da se slika poveča, predvaja video, zasveti besedilo, ob prehodu z miškinim kazalcem, ali se nam pred zapustitvijo spletne strani odpre pop-up. Aktualni so tudi “parallax” efekti, ki dajejo občutek prostora oz. globine spletne strani. Drugi so “loading progress bar” a la kolo/črta za nalaganje strani ipd.

Napredne galerije so odličen način za predstavitev slik in del, ne da bi preobremenili in dolgočasili uporabnike. Primerne so predvsem za portfelje, fotografske spletne strani in določene predstavitve produktov.

Izpostavite posamezne dele fotografij, del & izdelkov

Kot že nekaj časa uporablja houzz.com, smo funkcijo “hotspot” na fotografijah uporabili tudi za predstavitev projektov opremljanja interierja (oglejte si jo!) pri Elementare. Kot boste zasledili pri pregledu strani na portfelju, so tudi slike odzivne na prehod s kazalcem miške (hover animation). Tudi to je ena od funkcij, ki na nek način dodatno komunicira z uporabnikom, daje nek “feedback”.

Animacija na spletni strani

gibanje bolj pritegne pozornost. Dinamična vsebina nas pritegne k uporabi. Nekaj najboljših primerov, kako je bil uporabljen “motion animation” oz, “motion graphics” si poglejte spodaj.

Alfred service: animacija na spletni strani

spletna stran animacija gibanje

Eat: The story of food animacija

spletna stran animacija gibanje

Poleg omenjenih imate na svoji novi spletni strani lahko tudi animacije v ozadju, scroll-animacijo vsebine in podobne ali kombinirane funkcije.

Mikrointerakcije za (vsaj) minimalen “feedback”

Mikrointerakcije so dejanja, ki jih uporabnik naredi z vašo vsebino, spletno stranjo, z vami. Zahtevati povpraševanje je lahko že korak preveč za uporabnika. Mikrointerakcije so tiste malednkosti, o katerih niti ne razmišljamo, pa jih naredimo. “Like”, komentar, ogled izdelka, …

Material ali flat dizajn

Gre za “ali-ali”, ali je “material” dizajn stopnja, ki je nasledila “flat” dizajn? Sence, gibanje (motion) in globina (parallax) so glavni elementi “material” dizajna. Lani ga je predstavil Google. Ni nujen, je pa verjetno prihodnost. Primer na Google Now, Nimbus 9, Wohnberatung Wien, …

Kaj res potrebujete?

Vse omenjeno zgoraj, razen prilagojenih rešitev dizajna, lahko pridobite s spletno stranjo na WordPress profesionalni predlogi. Predloga znese cca 50 €, računati pa je treba še nekaj dela, ki znese od 150 € in vsebine, ki se računa po številu znakov, ki se jih napiše za stranko, manj če je dogovor za dolgoročno pisanje. Skupna cena za minimum od spletne strani znaša nekje od 200 €.

Ko kupujete spletno stran imejte zgornje podatke v mislih. Nekatera večja in manjša podjetja, ki nudijo izdelavo spletne strani, zakupijo šablono (predlogo) s pravicami za nadaljnjo prodajo spletne strani. Težava nastane, ko predlogo, ki je stara celo 5 let in  več, računajo enako, kot nekatera druga podjetja računajo za novo predlogo. Vredno je plačati več za zahtevnejšo spletno stran, a vedeti morate, kaj ste plačali takega, kar je naneslo toliko več. Nekaj o tem smo pisali na Spletni marketing nima smisla na linkedin-u. Povežite se!