Bringázz a munkába! weboldal re-design

Ügyfél: Magyar Kerékpárosklub, Bringázz a munkába!

Projekt: weboldal re-design, egyedi fejlesztésekkel

Bringázz a munkába! weboldal redesign

Másnak is megmutatnád? Oszd meg!

Néhány hét alatt teljesen új külsőt kapott a Magyar Kerékpárosklub Bringázz a munkába! oldala. A honlap eredetileg kampányoldalnak indult, és évről-évre bővült a tartalom. Amikor megkerestek minket, látszott, hogy az oldal már kinőtte magát, és egy könnyebben áttekinthető, stabil felépítésű honlapra lenne szükség, amit azonban könnyen hozzá lehet igazítani az éves kampány megjelenéséhez és témájához is.

Az ügyfél kérései

Amikor valaki megkér, hogy tervezzük teljesen újra a weboldalát, először mindig tisztázzuk, hogy ő mit gondol arról, miért van erre szükség. Szerencsések voltunk, mert a Magyar Kerékpárosklub munkatársai felkészültek voltak, rengeteg cikket olvastak a témában és egészen határozott elképzeléseik voltak, miben várnak változást. Kaptunk egy nagyon hosszú listát, hogy milyen weboldalt szeretnének. Ez egyrészt a fennálló problémákkal foglalkozott (például magas visszafordulási arány vagy nehezen kezelhető admin felület), másrészt a kitűzött célok elérésével (például hogy az érdeklődők sokkal könnyebben kapjanak információkat a következő eseményekről).

A lista nagyjából ezeket az elemeket tartalmazta:

  • magas visszafordulási arány csökkentése;
  • friss tartalmak könnyű publikálása, könnyen kezelhető admin felület;
  • magasabb konverzió (pl. hírlevél feliratkozás, belépés a Kerékpárosklubba);
  • átlátható, telefonon is könnyen használható navigáció;
  • hiányzó oldalak kialakítása (rólunk, kapcsolat, kötelező oldalak);
  • blogszerű bejegyzések megjelenésének javítása;
  • a Kerékpáros Kisokos kiadvány népszerűsítése;
  • előző évek kampányanyagainak elérhetővé tétele;
  • weboldal tartalom kereshetővé tétele.

Arculat re-design

A Bringázz a munkába kampány már rendelkezett egy néhány éve elkészített arculati kézikönyvvel, ami tartalmazta a színeket, betűtípusokat, logó variációkat. A weboldallal kapcsolatban nem volt benne sok információ, hiszen akkor még nem terveztek ekkora tartalmat.

A kézikönyvnek megfelelően felmértük, hogy ezek mennyiben jelennek meg a weboldalon, és azzal találkoztunk, ami sok más helyen is előfordul: az oldal több, az arculati színekhez hasonlító árnyalatot használt. A képen látszik, hogy színek nagyon hasonlóak, de mégsem egyeznek meg. Ezek közül választottak a Kerékpárosklub munkatársai.

Bringázz a munkába weboldal színei felméréskor

A weboldalon használt betűtípusok licencének érvényességéről sajnos nem sikerült megbizonyosodni, így újakat választottunk, de ezúttal szabadon használható Google Fontokat.

Bringázz a munkába weboldal betűtípus választás

A betűtípusok esetében végül a BaiJamjuree és Figtree lettek a kiválasztottak.

A logót változtatás nélkül használtuk tovább, csak a színe lett hozzáigazítva a választott palettához. Az elkészült moodboard már a weboldalon látható grafikai megoldások nagy részét tartalmazza. A moodboardon látszik, hogy sosem használunk tiszta feketét a szövegek megjelenítéséhez, hanem azt is a weboldal színeihez igazítjuk, és egy passzoló sötétszürke színt választunk.

Bringázz a munkába weboldal moodboard

Tartalom felülvizsgálata

Létező weboldal esetén minden esetben oldal-leltárt készítünk a már publikált oldalakból. Ezeket csoportosítjuk funkció és tartalom szerint, majd az ügyfél felülvizsgálhatja, ha esetleg módosítani szeretne a tartalmakon vagy a felépítésen (azaz a csoportosításon). A Bringázz a munkába weboldal esetében egyértelmű volt, hogy

  • vannak hiányzó oldalak (Impresszum, Kapcsolat, Rólunk);
  • nem használják a WordPress által létrehozott kategóriákat, de nincs is jól átirányítva a létrejött kategóriaoldal;
  • sok oldal „zsákutca”, ahol csak „olvasnivaló” található, de még az sem jó minőségű;
  • kevés a látogatók lehetősége a konverzióra (például hírlevél feliratkozásra).

Módosítások a tartalomban

Probléma volt a kifejezetten magas visszafordulási arány. Hogy ezen javítsunk, megszüntettük a „zsákutca” oldalakat és minden egyes oldalon további, kattintásra buzdító tartalmat helyeztünk el. Például az egyes hírek mellett most már megjelennek az események, a bringás tippek oldal pedig további tippeket ajánl. Szinte minden oldal alján megjelenik a Magyar Kerékpárosklub bannere, illetve a Kerékpáros Kisokos letöltési lehetősége.

Bringázza munkába weboldal bejegyzés grafikai terv

Rendeztük a hírek, tippek gyűjtőoldalainak a lapozórendszerét, most már nem jelennek meg többszöröződve oldalak.

A hírlevél feliratkozási lehetőség végül kizárólag a Kerékpárosklub saját weblapján érhető el, de a szervezeti bemutatkozás nagyon sok oldal alján megtalálható.

Egyértelműen elválasztottuk egymástól a friss, aktuális és a korábbi évek tartalmait. Az előző évek kampányainak grafikai fájljai évenkénti bontásban tölthetők le.

A főoldal két élete

A weboldal életciklusa két elkülönülő részre osztható: ősztől tavaszig nincsenek események, nem aktív az éves kampány. Ilyenkor a tartalomnak a keresőkben kell jól szerepelnie, és egyrészt szemléletformáló célt ellátnia, másrészt a Magyar Kerékpárosklubba való belépés előnyeit hangsúlyoznia. Ebben az időszakban „örökzöld” megjelenést vesz fel a főoldal.

Tavasztól őszig viszont a főoldal átalakul, és igazodik az éves kampány megjelenéséhez és témájához. Az oldal legfelső grafikája és szlogenje ilyenkor cserélődik és a kampánynak megfelelően jelenik meg. 2023-ban például a következő programok listázódnak ki.

A főmenü átalakítása

A legnagyobb változást azt hozta, hogy az oldal kapott főmenüt. Korábban egy menünek látszó sor szerepelt a főoldal kampányképe alatt, azonban egyértelműen idejétmúlt menüpontokat is tartalmazott, rengeteg almenüponttal. Telefonos nézetben pedig alig lehetett megtalálni, nem volt egyértelmű a megnevezése és elhelyezkedése sem. A menüpontok között olyanok is szerepeltek, amelyek azonnal elnavigáltak erről az oldalról és átvittek a Magyar Kerékpárosklub oldalára.

Létrehoztunk egy, a konvencióknak megfelelő megjelenésű és felépítésű főmenüt, amiben az elemek egyértelműek és a legfontosabb tartalmakra mutatnak. Kivettük a külső oldalakra mutató linkeket, viszont beemeltünk olyan oldalakat, témákat, amiket sokan keresnek.

Frissülő tartalmak

Folyamatosan friss tartalom most már 3 tartalomtípusba helyezhető el az oldalon, mintha három blog működne rajta. Az egyik a híreket, egy másik a bringás tippeket, egy harmadik pedig a programokat tartalmazza. A hírek a WordPress alapértelmezett blogja, és ebben lehet a bicibusz kategóriát használni, ami egy külön oldalon is megjelenik.

Nem esett róla még szó, de a WordPress használata miatt az admin felület könnyen kezelhető, egyértelmű, és sokkal több tartalmat is töltenek fel a weboldal megjelenése óta.

Ha van kedved, nézz az elkészült weboldalra itt: Bringázz a munkába! (És menj bringával a munkába!)

Vajon a te oldalad is megújításra szorul? Ha igen, szívesen segítünk, hogy a honlapod hatékonyabban dolgozzon a céljaid érdekében!

Másnak is megmutatnád? Oszd meg!

* * * * * * * *

Ha több projektünket is megnéznéd, a Munkáink oldalon találod őket! Lehetnél te a következő cikk szereplője!