Edukativni portal Plantea – hrvatska flora i priroda koja nas okružuje
Edukativni portal koji se bavi proučavanjem biljnih, gljivarskih i životinjskih vrsta koje rastu na području Hrvatske.
- Grafički dizajn
- Programiranje web stranice
- Internet marketing
Sažetak projekta
Plantea je edukativni portal kojoj je primarni cilj proučavanje prirode, prije svega biljaka koje prirodno obitavaju na području Hrvatske ili su poznate u vrtlarskom ili kućnom uzgoju. Opisuju se karakteristike kojima se diferenciraju razne vrste, stanište na kojem prirodno obitavaju biljke, etimološka značenja nazivlja, uzgoj i upotreba pojedinih dijelova biljke. U nešto manjoj mjeri proučavaju se gljivarske i životinjske vrste te se želi potaknuti ekološka svijest građana o prirodi koja ih okružuje.
Portal postoji više od desetljeća te iako je marketinška strategija posve zanemarena, web stranica je popularno odredište za široku publiku koja traži brze informacije i želi se upoznati s traženim pojmom.
Strategija izrade
Naš cilj je bio osvježiti dizajn web stranice i prilagoditi je modernim standardima. Uz to je potrebno riješiti programirano sučelje koje bi povezalo sadašnje informacije i raznolike podatke koji se provlače kroz ogroman broj stranica i objedinilo ih na jednom mjestu radi lakšeg održavanja.
Uvod u izradu projekta
S obzirom na to da web stranica postoji dugi niz godina imali smo mogućnost zaviriti u statističke podatke koje nam pruža Google Analytics. Na uzorku od velikog broja posjetitelja saznali smo koji tip sadržaja korisnici najviše traže i proučavaju, kako se kreću stranicom i kako se njome služe.
Primijetili smo da velik broj posjete dolazi putem organske pretrage na tražilicama te putem dijeljenja na društvenim mrežama. Vidjeli smo koje teme su korisnicima važne i zanimljive, na kojim člancima se korisnici najviše zadržavaju a na kojima brzo napuštaju stranicu. Shodno tome, potrebno je bilo kreirati vizualnu mapu stranica prema važnosti.
Kako je web stranica isključivo edukativno-informativnog karaktera radi društvene koristi, nema postavljenih ciljeva i potrebe za izvršenjem konverzija kao što je slučaj prema tvrtkama koje su orijentirane na prodaju i rast.
Vizualni dizajn
Navigacijski izbornici glavni su pregled osnovne strukture sadržaja svake web stranice. Primarna navigacija postavljena je prema glavnim temama s većim podizbornikom koji je zaslužan i za bolji vizualni dojam na stolnim računalima. Kako smo prema analitici saznali da korisnici jako često koriste tražilicu, postaviti smo je na istaknuto mjesto u razini s navigacijom te odmah vidljivim poljem za unos.
Slijedili smo standardni postupak izrade web stranica prvo kreirajući strukturu pomoću vizualne mape stranica te smo potom prešli na grafički dizajn i izradu prototipa. Razvoj je time tekao nesmetano i dovršen je unutar predviđenog roka.
Programiranje i optimizacija
Najveći izazov bio je automatizirati spajanje velikog broja podataka koje su prožete kroz čitav niz kategorija i međusobnih tipova objava ali na način da ne koči rad u adminu što zbog stresa na serveru uzrokuje velik broj spajanja na bazu. Dakle, iako je ono što se prezentira korisnicima bitno, veliki naglasak je bio poraditi na backend optimizaciji.
Veliki izazov je velika količina sadržaja koji je trebalo dobro strukturirati u administraciji i u unutar teme programirati predloške za svaki dizajn unutrašnjeg tipa stranice.
Radi potrebe rječnika etimologije i velikog broja podataka bilo je nužno izraditi prilagođeno sučelje unutar administracije radi rada sa zasebnim tablicama u bazi podataka koje su izvan klasičnog modela rada WordPressovih tablica. WordPress po zadanim postavkama pruža jedino izradu prilagođenih tipova objava (Custom post types) ali takav sustav bi bio neoptimalan za održavati jer se ovdje radi o tisućama kratkih podataka. Također je svaki opis bio nužno programirati da automatski pronađe svaku inačicu srodne objave te ispod opisa prikaže linkove na vrste sa srodnim nazivljem.
Na karti kod prikaza lokacija vezanih uz prirodna bogatstva, programiralo se rješenje koristeći varijantu OpenStreetMap što je alternativa Google Maps. Iako je Google Maps besplatan u osnovnom obliku i dopušta kontrolu prikaza svega što se god želi napraviti uz prilagođeno programiranje, ovdje se radi o iznimno velikom broju prikaza karte na svakoj od stranici koja se dodatno može generirati u raznim varijantama preko filterima. A Google tada to debelo naplaćuje. Ishod je u ovom slučaju isti zbog korištenja licence otvorenog kôda a projekt koji nije komercijalan neometano nastavlja s radom.
Što se tiče ostalog, ne moramo posebno naglašavati da su web stranice prilagođene za svaki uređaj; od mobitela, tableta i laptop uređaja pa do velikih stolnih ekrana, da je korištena dobra praksa optimizacije za tražilice i pristupačnosti korisnika.
Završne riječi
Unatoč WordPress platformi koja nagoviještava lako postavljanje projekta, portal je znatno veći zalogaj u odnosu na klasične web stranice koje su karakteristične za tvrtke. Zbog iznimno visoke posjećenosti i raznih kalkulacija koje se izvršavaju, sve je moralo teći glatko na serveru. Stoga je važno bilo programirati po mjeri “od nule” a ne instalirati pluginove koji sa sobom nose brdo dodatne prtljage i koče cijeli sustav. Programiranje je izvršeno glatko i na front-endu što se očituje i u brzini otvaranja web stranice krajnjim korisnicima.
Sve u svemu, kvalitetna web stranica na više razina čemu pomaže informativni sadržaj a veliki priljev posjete svakako govori u prilog uspješnosti projekta.