Weboldalkészítés folyamata 10 lépésben

Mint minden gyártás, a weboldal-készítés sem kivétel a folyamatmenedzsment alól. Még a legegyszerűbb weboldalak elkészítése is tud a vártnál hosszadalmasabb és bonyolultabb procedúra lenni, ha nem megfelelően készítjük elő a munkát. Az ilyen esetek sem a megrendelői, sem a kivitelezői oldalnak nem kedveznek, ezért fontos szem előtt tartanunk és lépésről lépésre végigkövetni a folyamatot, amit azért fejlesztettünk ki, hogy minél hatékonyabban érjük el a közösen kitűzött célt:

A funkcióit maximálisan kielégítő, felhasználó- és keresőbarát, a mai trendeknek megfelelő, vagy épp azok előtt járó weboldal létrehozása.

A Next Ship-nél 10 lépéses folyamatot alakítottunk ki a fentebb leírt cél elérésének érdekében. Vannak olyan folyamatrészek, amik egymásra épülnek és vannak olyanok, amelyek egyidőben végezhetőek. A sorrend betartása nem elhanyagolható, mivel ezzel tudjuk elkerülni az esetleges csúszásokat, nem várt extra költségeket.

1 // Igényfelmérés

A legfontosabb része a sikeres együttműködésnek, hogy minél közelebb kerüljünk a termékhez, szolgáltatáshoz, vagy akár a személyhez, aminek, vagy akinek a weboldalát készítjük. A Next Ship erre a célra kifejlesztett egy igényfelmérő kérdőívet, aminek a kitöltése és értékelése részletes rálátást nyújt az adott probléma megoldására, feladat elvégzésére. A kérdőív kitöltése után egy személyes találkozó alkalmával átbeszéljük azt és az esetleges felmerült kérdéseket tisztázzuk.

2 // Benchmark prezentáció

Az igényfelmérő alapján egy gyűjtést készítünk, amiben funkció és esztétika szempontból egyaránt releváns példákat sorakoztatunk fel. Ez azért fontos, hogy megtaláljuk a közös hangot, biztosak legyünk abban, hogy közös nyelvet beszélünk. Ezután kezdődhet az oldal kialakítása.

3 // Sitemap

A sitemap-ben meghatározzuk közösen a weboldal felépítését. A fő és al-menü pontokat, valamint a hierarchiát. Ez alkotja a vázat, amire építjük az oldalt. Ebben a fázisban fontos átgondolni olyan funkciókat mint például a többnyelvűség, amik a későbbiekben nehezebben és extra idő hozzáadásával beépíthetőek.

4 // Funkciók tervezése – User Experience

A sitemap kialakítása után minden oldalon meghatározzuk, hogy milyen sorrendben és milyen funkciókkal rendelkezik az adott oldal – a felhasználót hogyan vezetjük végig egy jól kiépített úton, milyen képekkel, szövegekkel és call-to-action felületekkel kell találkoznia az oldal böngészése közben. Ha ezt a részt nem megfelelően találjuk ki a megfogalmazott célok figyelembevételével, akkor a felhasználó könnyen elvész az oldalon és nagy valószínűséggel elhagyja azt. A Next Ship-nél szakemberek segítenek abban, hogy a felhasználói élmény és a kívánt cél elérése a lehető legsikeresebb legyen. Előfordul természetesen, hogy egy-egy funkció nem hozza a hozzá fűzött reményeket, ezért ezeket folyamatosan monitorozni kell az oldal indulása után és adott esetben formálni, újragondolni azokat.

5 // Képek / Szövegek

Egy sikeres weboldal titka a megfelelő funkciókon túl a professzionális képi világ és a könnyen olvasható, jól strukturált keresőbarát szövegek. Egy honlapra érkezve a képeket észleli az agyunk elsőként. Az első benyomás fontos szempont. A szövegek azok az alkotók, amik megalapozzák a bizalmat az információ megfelelő átadásával. Ez a két fontos alkotó kéz a kézben jár: a bizalom kiépítésének első számú eszközei. 

6 // Statikus design – User Interface

A képek összeállításával és a szövegek szerkesztésével egyidőben indul a oldal design-jának kialakítása. Konzisztens, áttekinthető, egyértelmű. Színek, tipográfia, kép és szöveg stílusok kialakítása, fejléc és lábléc megtervezése. Ekkor már van elég információnk a szövegek és képek mennyiségéről, ezek arányáról, amelyek segítségével már egy nagyon pontos képet lehet tervezni arról, hogyan fog kinézni az elkészült weboldal.

7 // Fejlesztés – első fázis

Elkészült az elfogadott statikus design az oldalak funkciójával és az alap layout-tal. Elméletileg minden információnk a birtokunkban van és el lehet kezdeni a weboldal készítését.

8 // Interakció tervezés

Amíg folyik a fejlesztés, addig meg lehet tervezni az interakciókat, ami a gombok animációján a menük működésén át görgetési effektekig mindent magába foglal, ami a felhasználói élményt fokozhatja.

9 // Fejlesztés – második fázis

Amikor az oldal teljes funkciójában működik, elvégezzük azokat az utolsó simításokat, amelyek egésszé teszik a felhasználói élményt. Ebben a fejlesztési fázisban kerül elkészítésre a végleges, reszponzív működés: minden eszközön és kijelzőn a tervezett élményt biztosítjuk a látogató számára.

10 // Tartalomfeltöltés és SEO

Ezek után következik a szövegek és képek, illetve videók feltöltése. A tartalmakat úgy írjuk meg és úgy nevezzük el, hogy SEO barát eredményt kapjunk. Elvégezzük az oldalak SEO beállításait és a képekhez tartozó szükséges leírásokat. Ellenőrizzük az oldal sikerességét különböző Search Engine Result Page (SERP) szolgáltatóknál mint a GTmetrix, a Pingdom és a Page Speed Insight. Ezek alapján kellő visszajelzést kapunk az oldal keresőkben való sikerességére. Ezek összességét nevezzük on-site optimalizálásnak. Az off-site SEO stratégia külön egyeztetés és megállapodás kérdése.

Bízom benne, hogy e kidolgozott folyamat segített egy átfogó képet adni arról, hogy miként születik egy weboldal. Amennyiben kérdése maradt, vagy felkeltette érdeklődését szolgáltatásunk, vegye fel velünk a kapcsolatot.

Fignár Levente
Fignár Levente
Designer és ambient zenész. A Next Ship társalapítója. Fő szakterületei a branding és terméktervezés, de az online jelenlét is fontos szerepet játszik érdeklődési körében.

Ha tetszett az írásunk

Íratkozzon fel hírlevelünkre. Havonta jelentkezünk értékes tartalmakkal a brand és design világából.

Kapcsolódó írásaink
Fignár Réka

SEO-barát szövegezés

A SEO, vagyis Search Engine Optimization egy olyan marketing stratégia, amellyel növelhetjük a weboldalaink látogatottságát.

Dobi Zoé

Brand megújulás a Covid utáni időszakban

A lassan két éve húzódó járványhelyzet mindenkit érintett, személyes vagy az üzleti érintettségből egyaránt. Az érzékelt változásokon túl azonban az egészségügyi válság tartós változásokat hozott

Köszönjük, hogy
kapcsolatba léptél velünk!
Hamarosan megkeresünk
a megadott elérhetőségeden.

Üdv, Next Ship