Új weboldal dizájn, webdesign trendek. Tudom, mit érzel, na már megint egy trend, miért kell mindig változnia a dolgoknak, itt ebben az esetben a weboldal dizájnoknak. Nos ez nem azért történik, mert a grafikusok kitaláltak új trendeket, hanem a digitális világban a változás oka mindig a konverzió növelés és/vagy megtartás. A felhasználói szokások folyamatosan változnak, a figyelmük, az hogy mennyi ideig is vannak a weboldalon, vagy éppen, hogy mit és hol keresnek a weboldalon, továbbá, hogyan lehet elérni a gyorsabb és minőségibb befogadást (értse a fogyasztó, mit akarunk). A weboldalad grafikája, elrendezése, annak modernizálása segít, hogy változó felhasználói szokások mellett is megtartsd a konverziós értéked, sőt javíts rajta. Vágjunk is bele!
Összefogott a Minner és a Billingo, hogy a digitalizáció igazán kézzelfogható legyen egy magyar vállalkozás számára. Legyél Te is innovátor! Használd a digitális megoldásokat! Mutatjuk, hogyan kell.
Weboldal trendek, változások
Hozni fogunk nemzetközi példát, de az utóbbi 1 évben tüzetesen vizsgáltuk a hazai weboldalakat, mind a gyengébbeket, mind azokat, amelyek valóban milliárdos forgalmat tudnak felmutatni, és ehhez hozzá is járult a weboldaluk. Utóbbiak valóban izgalmasak, sokat tanulhatsz abból, hogy miként szabd újra a weboldalad menüjét, vagy hogyan is használd a slider-t. Hogyan építsd be a marketingedbe.
Magyar példák, tanulságok:
Most első körben a stratégiára, és a fő elemekre fókuszálunk:
- A sikeres cégek szinte minden oldalon törekedtek arra, hogy konverzióra optimalizálják a weboldalaikat.Tehát minden oldalon, aloldalon volt konverziós lehetőség, általánosságban 1 lehetőség volt (kivéve főoldal). Konverzió lehet vásárlás, kapcsolatfelvétel, űrlap kitöltés, hírlevél feliratkozás, videó megnézése… (A képen az Umbroll cég konverziós célja, CTA gombbal – érdekel szöveggel).
- Főoldalon slidert-t, nagyobb borítóképet használnak, amin az aktuális ajánlatuk, kampányuk szerepel. Ez a legtöbb esetben már szűkebb (200-300px) sávban helyezkedik el. Maximum 4-et használnak, tudod lapozni lehet. (Lásd Manna.hu, amazon.com)
- Piktogramok, ábrák segítségével adnak át még több információt a rendelkezésre álló idő / képernyő alatt, amíg a felhasználó a weboldalon van. Termékoldalakon, szolgáltatás leírásánál, bemutatásánál még inkább fontos.
- Videót használnak a weboldalukon. Ez főleg azokra jellemző, akik tényleg minden oldalon használnak konverziós eszközt.
- Betűméret legalább 15, de legtöbbször 16-os betűméret a folyószövegre.Ennél nagyobbak természetesen a főcímeknél, nagyobb feliratoknál.
- Ha nem is közvetlenül értékesítenek terméket / szolgáltatást, interaktív az űrlapjuk, vagy segíti a szegmentálást:
- Cikkek, amelyekben ezek benne vannak:
- Weboldal stratégia, tudásanyag: a MinnerAkadémia átfogó marketing alapok képzésében.
- Rossz példák, de annál többet tanulunk belőlük:
Dizájn trendek
- Egyik izgalmas, mostanában előretörő irányzat az absztrakt weboldalak, és vagy illusztrációval rendelkező oldalak használata. Biztosan te is találkoztál már ilyennel akár a Spotify oldalán, akár a Mailchimp hírlevél szoftvernél. Lehet venni akár illusztráció pakkokat is, de érdemes nézelődni olyan weboldal sablonoknál, akik kifejezetten ilyet csinálnak, adnak olyan illusztrációkat, amiket a közösségi médiában is tudsz majd használni (egységesség tudod). Ezt azért is használják a cégek, mert sokkal szebb, és könnyebben használhatóak, mint mondjuk a stock képek.
- További trend az átmenetes színek (két színt használunk), akár háttérben, akár betűszínben
Az alábbi képen például az Elementor színei láthatók, egy WordPressre épülő könnyen kezelhető weboldalkészítő rendszer, tudod amolyan „húzogatós”. Ők is használják az átmenetes színeket a saját marketingjükben, és persze a weboldal készítőjükben te is be tudod állítani.
Na és hol láttad még ezt? Hát persze, hogy a Minnernél! Mi is használjuk több helyen, sőt a közösségi média posztjainkban is.
Mi is alkalmazzuk, ahogyan az Apple is, a szövegnél az áttűnéses színhasználatot. - Több „üres tér” a képeknél, weboldalon, főleg a weboldal elején. De úgy általánosságban is használják. Ennek szintén oka, hogy a fogyasztó gyorsabban befogadja a látottakat.
- Paralax animációk, szöveg, weboldal effektek, micro animációk a weboldalon. Ezt főleg láthatod az Apple termék oldalain, például itt (iPhone 12). Tehát nem gifek, hanem a weboldal elemek, képek, feliratok animálva vannak, általában görgetéssel jönnek elő. Ezt azért is használják, amit már olvashattál a Minneren, hogy segítsék a fogyasztónál a fókusz fenntartását, értelmezését, ahogy ezt a piktogramokkal, ábrákkal tesszük.
Hol tudok inspirálódni? Akár WordPress, akár egyedi készítésű weboldalam esetében
Nézzük is a lehetőségeket! Sőt akár meg is tudod venni a neked tetsző dizájnt!
- Elementor – A WordPress weboldal rendszerre épülő megoldás. Ahogy látod az alábbi videóban is nagyon könnyű átszerkeszteni feliratokat, képeket hozzátenni, színeket változtatni, blokkokat beállítani a bal oldali panelen és közben élőben látod, mi történik. Valójában élőben szerkeszted.
Amiért előnyös, hogy a Themeforest websablon vásároldalon több 15-20 ezer forintba kerülő sablon is Elementor rendszerre épül (példák itt), érdemes úgy is keresni. Ennek előnye, hogy később is könnyen testre szabható, maradandóbb megoldás.
Kattints ide és merülj el az Elementorban.
- Envato Themeforest- Akár egyedi, WordPress weboldalakkal kapcsolatban itt érdemes nézelődni. Lehet az is, hogy csak ötleteket gyűjtesz, de akár meg is tudod vásárolni őket. Az a legjobb az egészben, hogy meg tudod nézni előnézetben, vagyis élőben, hogyan is néz ki az adott sablon.
Ez izgalmas volt! Még ilyet!
- Így állítsd be profin a Google Cégem fiókodat!
- GDPR süti sáv, cookie tájékoztató beállítása lépésről lépésre
- Domain, tárhely, weboldal. Hogyan kapcsolódnak egymáshoz?
A Billingoa Digitális Ninja rovat támogatásával is sokat segített, hogy kiaknázd a digitalizációban rejlő lehetőségeket. Ha már rákanyarodtál erre az útra, ne állj meg – nézz körül Billingodigitális megoldásai között, és kezdd el őket használni! Digitalizációra, innovációra fel! Kattints ide!