Weblap készítés 10 + 1 lépésben

Egy bemutatkozó oldal, online névjegykártya, személyes blog, céges weblap, pláne egy webáruház elkészítése igencsak összetett feladat tud lenni. Összeszedtem 10 + 1 lépést, amiken mindenképpen célszerű végigmenned, ha professzionális weboldalt szeretnél, és nem elégszel meg egy ingyenes weblap "tudásával". Arról, hogy mire lehet elég egy ingyen, saját magadnak összedobott oldal, itt írtam pár mondatot.
1. lépés: A célok és a célcsoport meghatározása

Ha megkérdezem egy leendő ügyfelemet, hogy milyen célt, milyen célcsoportot szeretne elérni az új weboldalával, többnyire kiderül, hogy egészen váratlanul érte őt a kérdés. Ha hiszed, ha nem, ez egy kulcsfontosságú lépés, amit nem szabad kihagyni. Oké, 2020-ban már természetes, hogy a szomszéd pékségnek is van weblapja, meg elvárás, meg tök jól mutat a névjegykártyán is, de ennél kicsit jobban bele kell ásnod magad a témába.
Mi a cél? Nyilván nem csak annyi, hogy legyen végre egy honlapod, hanem minimum az, hogy minél többen rátaláljanak a cégedre, megismerjék a szolgáltatásaidat és kapcsolatba tudjanak lépni veled. Ez egy szimpla bemutatkozó weblap célja. Vegyünk egy másik példát! Jártál már úgy, hogy megváltozott a telefonszámod, a beosztásod vagy a munkahelyed? Ugye, mennyi nyűggel jár mindenkit értesíteni, akit ez érinthet? Az online névjegykártyák célja az üzletkötés, kapcsolattartás elősegítése a folyamatosan naprakész információkkal. Egy webáruház célja a vállalkozás termékeinek megjelenítése, valamint az online vásárlás lehetővé tétele. Persze egy weboldalnak nem csak egy célja lehet, hiszen a meglévő ügyfeleket megtartani, az újakat viszont magunkhoz csábítani kell.
Mi a célcsoport? Ha röviden akarjuk megfogalmazni, a célcsoport az, akiket a weboldaladon keresztül el szeretnél érni. Ez lehet nem, életkor, élethelyzet, foglalkozás, érdeklődési kör, tulajdonképpen bármilyen olyan csoportosítás, amivel szűkíthető a megcélzottak köre. Elég ritka, amikor egy weboldal "mindenkinek" szól, ezért tényleg érdemes elgondolkozni azon, kiket szeretnél megszólítani.
A cél és a célcsoport meghatározásakor első lépésben nem kell sebészi pontosság. Elég, ha nem üres lappal állsz a webfejlesztő elé, hogy "kellene egy weblap". Ha nem így teszel, a webfejlesztő nem biztos, hogy olyan weboldalt tud készíteni, ami eléri a kívánt eredményt, és könnyen az ablakon kidobott pénz lesz a befektetésedből.
2. lépés: Előzetes egyeztetés, árajánlat kérés
A weboldal céljának és célcsoportjának sikeres meghatározása után ideje felvenni a kapcsolatot velem! Ez megteheted e-mailben vagy telefonon is, nem szükséges személyes találkozás hozzá. Az előzetes egyeztetés nem kerül semmibe. Nincs veszíteni valód, nincs kockázat. Maximum az idődet áldoztad fel, ha mégsem én lennénk számodra a megfelelő választás.
Az előzetes egyeztetés során tisztázom veled, mit vársz tőlem, milyen weboldalt szeretnél, vannak-e konkrét elképzeléseid, igényeid? Egyeztetjük a rendelkezésre álló időkeretet is, ugyanis tegnapra csak a gimnazisták, holnapra pedig csak a főiskolások vállalnak munkát. Én ugye, meg már rég kinőttem ebből a korszakomból...
Miután minden lényegi kérdést tisztáztunk, elkészítek számodra egy részletes árajánlatot, amely tartalmazni fogja, hogy mit kapsz a pénzedért és azért milyen ellenérték illet meg engem. Az árajánlat - az éppen aktuális feladataim és a projekt függvényében - pár nap alatt készül el. Elektronikus úton (e-mailben) juttatom el neked, és persze hagyok bőven időt a mérlegelésre. Lesz lehetőséged kiegészítő információkat kérni, esetleg módosítani a paramétereken.
3. lépés: Szerződéskötés

A szerződéskötésre csak akkor kerül sor, ha te is, és én is úgy látjuk, hogy én vagyok a jó választás a projektedhez. Ha elnyerte a tetszésedet az árajánlatom, megkötjük az üzletet. Ehhez sincs feltétlenül szükség a személyes jelenlétre. Két példányban postázom a szerződést, amelyből az egyiket aláírva vissza kell juttatni számomra. Na jó, természetesen én is haladok a korral, és mivel imádom kihasználni a technika adta lehetőségetek (talán túlságosan is), a szerződést digitális aláírással, na meg persze időbélyegzővel hitelesítve is el tudom juttatni hozzád. Amennyiben te is alá tudod írni digitálisan, nem kell bajlódnunk a postázással. Mivel rendíthetetlenül hiszek a korrekt, mindkét fél számára előnyös üzleti kapcsolatokban, minden jogi kihatású dolgot igyekszem tisztázni az aláírandó dokumentumban. Kérlek, olvasd át figyelmesen, és ha szükséges kérd ki jogi tanácsadód véleményét is! A szerződés rád is, és rám is kötelezettségeket ró, amelyekkel tisztában kell, hogy legyél.
4. lépés: Weboldal funkcióinak meghatározása
A tulajdonképpeni tervezési munka itt kezdődik. Megkérlek, hogy a lehető legrészletesebben pontosítsd velem együtt az 1. pontban megfogalmazott igényeidet. Mivel alapelvem, hogy ha te meg tudod álmodni, én el is tudom készíteni neked, a lehető legtöbbet meg kell tudnom arról, szerinted milyen a "jó" weboldal. Elemezzük a versenytársak internetes megjelenését, megnézzük a piaci hátteret, felderítjük a leendő weboldal célcsoportjának leginkább megfelelő online trendeket. Ezek alapján teszek javaslatot arra, hogy milyen funkciók kerüljenek megvalósításra, illetve melyik navigációs megoldás illik a képbe. Ez az a munkafolyamat, amely során szükségem lesz az aktív együttműködésedre, nélküled ugyanis csak találgatni tudnék, mit is szeretnél.
Az egyszerűbb felépítésű honlapok esetében sokszor elegendő ehhez pár e-mail üzenet váltás, és néhány felsorolás jellegű bekezdés. Az online névjegykártyák, bemutatkozó weblapok, személyes blogok jellemzően ilyenek. Egy üzleti weblap, pláne egy webáruház esetében azonban előfordulhat, hogy ennél többre lesz szükség. Amennyiben szükséges folyamatábra segítségével tisztázzuk, mik az elképzelések és a tényleges igények, hol lehetnek a korábban csak fejben létező folyamat buktatói.
5. lépés: Arculattervezés, grafikai tervek

Az arculattervezés indulhat egy neten megvásárolható weblap sablonból kiindulva is, de természetesen a teljesen egyedi elképzelésektől sem hátrálok meg. Ez az a pont, ahol valószínűleg vissza kell, hogy rántsalak a Földre. Nem véletlen, hogy először a célokat, és a szükséges funkciókat tisztázom veled. Így könnyebben belátod, miért nincs szükséged a "tök menő" és "trendi" vizuális káoszra, amit a sablonok sugallnak. Hogy miért? A több millió honlap világában az a szép, hogy mindenki különbözni akar a másiktól, mindenki egyedi akar lenni, de ha egy weblap "nem úgy működik, ahogy várom", azonnal keresek egy másikat, remélve, hogy ott nagyobb gondot fordítottak arra, hogy megtaláljam a lényeget.
Van maximum 5 másodperced arra, hogy betöltődjön a weboldalad és felkeltse a látogató érdeklődését, aztán pedig még maximum 5 arra, hogy maradásra is ösztönözze. Ha gondolkodnia kell rajta, hogy hol találja a számára érdekes tartalmat az oldaladon, könyörtelenül tovább fog lépni. Nem vicc! A túlzott "kreatívkodás" pont ellentétes hatást válthat ki, mint amit szeretnél.
A weblap design tervezésekor készítek neked egy látványtervet, amelyen természetesen van lehetőséged módosításokat kérni, sőt kérhetsz teljesen újat is. Ha nincs konkrét elképzelésed, akkor segítek kitalálni, hogy a tevékenységedhez milyen szín- és formavilág, milyen stílus illeszkedik a legjobban. Abban az igen ritka esetben, ha három teljesen különböző grafikai terv közül sem sikerül választani, további tervezési díj ellenében készítek újabbakat.
Mivel mi csak jogtiszta anyagokból dolgozok, a leendő weboldaladon megjelenő fotókkal kapcsolatban pár alapvető tudnivalóval nem árt, ha tisztában vagy. Ha nem kizárólag saját készítésű képekben gondolkozol, esetlegesen számolnod kell azok árával is. A kreatív, alkotó tevékenység is egy munka, én pedig becsülöm annyira mások munkáját, hogy nem dolgozok lopott tartalommal. Egy másik bejegyzésben lesz majd róla szó, hogy milyen forrásokat ajánlok átböngészésre a megfelelő minőségű képek és illusztrációk után kutakodva. Teljesen egyedi képre van szükséged? Jó hírem van: a webNpro csapat egyik tiszteletbeli tagja - Albert - profi fotográfus. A mobiloddal lőtt kép tökéletes, amikor a nagyinak mutogatod az unokákat, de hidd el, ő igazán igényes, profizmust sugalló munkát ad ki a kezei közül. Arról már nem is beszélve, tuti, hogy nem találod meg ugyanazt a képet egy másik weboldalon, amit vele készíttettél.
A grafikai terv, és persze a végleges weboldal szempontjából is kiemelt jelentőséggel bírnak a szöveges tartalmak. Ez az egyáltalán nem elhanyagolható részlet, amin el szokott csúszni egy weblap átadási határideje. Már az előzetes egyeztetés alkalmával igyekszem némi iránymutatást adni, mekkora terjedelmű szövegre lesz szükség, hogy megtöltsük tartalommal a honlapod, de tudom, hogy ezek megírása sokszor nem egyszerű feladat.
Van pár egyszerű kérdés, amiket megválaszolva máris előrébb leszünk: "Mi az a probléma, amire pont a te weblapod nyújt megoldást?", "Mi a célod a weblapoddal?", "Mik a legfontosabb célkitűzéseid?", stb. Próbáld meg a célcsoport által használt nyelvezetben megfogalmazni a választ, úgy sokkal hatékonyabb az üzenet! A szakzsargonnal teletűzdelt, önéletrajzszerű fogalmazások általában senkit sem érdekelnek. Szívesen segítek az általad megírt szöveget átalakítani olyanra, ami megállja a helyét az igényes látogatók szemében is. Fordulj hozzám bizalommal!
6. lépés: Keretrendszer vagy teljesen egyedi fejlesztés
Az előzetes tervezés, illetve a grafikai terv elfogadása után, attól függően, hogy mi a koncepció, kiválasztásra kerül az a keretrendszer, amely segítségével megvalósítom a honlapodat, vagy döntés születik a teljesen egyedi fejlesztés szükségességéről. Az általam is alaprendszerként használt nyílt forráskódú CMS rendszerek, mint például a WordPress nem véletlenül uralják az internet több, mint 60%-át (forrás: https://w3techs.com). Jelen pillanatban csak a hivatalos WordPress bővítménytárból több, mint 59.00 bővítményből válogatva bővíthetjük ki egy weboldal tudását (forrás: https://hu.wordpress.org/plugins/). Ehhez még hozzájön számtalan prémium (fizetős) és egy csomó máshol fellelhető kiegészítő. Na persze ebben a hatalmas választékban nem egyszerű megtalálni a valóban hasznos kódokat, de ne aggódj, ez is az én dolgom, és nem fogok kétségbe esni akkor sem, ha az egyedi igény, teljesen egyedi megoldást kíván. Igazából ezzel nincs túl sok teendőd, de mint minden projektedet érintő dologgal kapcsolatban, erről is tájékoztatlak majd.
A WordPress egy olyan webes alapú keretrendszer, amely használatával a legtöbb esetben a weboldalad jóval rövidebb idő alatt készül el, mintha ugyanazt a feladatot teljesen a nulláról indulva, egyedi kóddal oldanám meg. Számodra vitathatatlan előnyként fog megjelenni, hogy akár te magad is könnyen megtanulhatod az oldalad tartalmának szerkesztését, nem leszel mindenképpen ránk utalva. A keretrendszereknek rengeted előnye van, de persze tagadhatatlanul akad hátrányuk is, de ezekről majd egy másik bejegyzésben írunk, ha kíváncsi vagy rá...
7. lépés: Tartalomfeltöltés

A tartalomfeltöltés során a végleges szövegek, képek, esetleg videók a helyükre kerülnek. Beillesztem a látogatók által letölthető tartalmakat is, mint például használati utasításokat, brossúrákat, ha vannak. Amennyiben eddig szépen sorjában mentünk végig az összes lépésen, elvileg már minden készen áll, "csak" meg kell tölteni tartalommal az oldaladat.
8. lépés: Domain név és tárhely
A domain név megválasztása a világ legegyszerűbb feladatának tűnik. A témában járatlanok nem is igazán értik, mit kell annyit gondolkodni rajta? Az internet egyre népszerűbb, egyre több a weboldal is. Mindenki könnyen megjegyezhető, frappáns domain nevet szeretne a weboldalának.
A jó domain név rövid, könnyen megjegyezhető, utal a tartalomra, felkelti az érdeklődést, és nem utolsó sorban szabad, azaz előtted még senki másnak nem jutott eszébe. A domain végződés nem feltétlenül kell, hogy .hu legyen. Ha inkább magyarul értő látogatókat várunk, akkor célszerű ennek használata, míg a külföldi célcsoportok esetén szerencsésebb a .com, .eu, .info, stb.
A domain név kiválasztásakor jó módszer, ha az összes variációt, ami eszedbe jut, felírod magadnak. Később ezek közül könnyebb lesz például a kollégák, barátok segítségével kiválasztani a legmegfelelőbbet. Megszokott, hogy a több szóból kerül megalkotásra egy domain név. Ügyelj arra, hogy még véletlenül se lehessen más jelentéssel kiolvasni ezeket, mint az eredeti szándék. A mókásra sikerült domain név választásokról még biztosan írunk egy másik posztban.
A tárhely kiválasztásakor nem csinálok titkot belőle, hogy számomra az az ideális, amelyik fölött kontrollal rendelkezem. A magyarázat rettenetesen egyszerű: csak így tudom garantálni, hogy az elkészült weblapod valóban működőképes lesz, és az is marad.
9. lépés: Élesítés a végleges tárhelyen

Eddig a pontig egy ideiglenes tárhelyen, ideiglenes domain név alatt érhető el a weblap. A közös munkában az i-re a pontot a végleges tárhelyen történő beüzemelés teszi fel. A folyamat általában pár órát vesz igénybe a részemről, és minden esetben, minden funkciót újratesztelek, hogy biztos legyek benne, hibátlan végeredményt adok át. Az ellenőrzés folyamatában mindenki részt vesz, aki él és mozog körülöttem. Tudod, több szem, többet lát...
10. lépés: Tartalom- és keresőoptimalizálás, online marketing
A webfejlesztés, illetve a weblap üzemeltetés leginkább misztifikált területe a tartalom- és keresőoptimalizálás. Hangzatos marketing cikkek üzenik: egyedül képtelen vagy olyan webtartalmat készíteni, ami előkelő helyet biztosít az oldalad számára a keresők találati listáján. Sőt! Örülj neki, ha még nem nyelt el téged is az internet legmélyebb bugyra az honlapoddal együtt!
Én úgy gondoljuk, ez egy olyan szakterület, amely a többihez hasonlóan tanulható. Kérdés az, hogy akarsz-e ezzel foglalkozni az üzletmenet helyett? Van-e időd arra, hogy utánanézz annak, mire keresnek éppen a leggyakrabban az interneten, és hogyan tudod a megszerzett információt a magad javára fordítani?
Ha van külön marketing részlege a cégednek, biztos lesz pár jó ötletük. Ha nincs, szívesen segítek! Teljesen "véletlenül" akad egy barátom, aki játszva hajtja igába a legnépszerűbb keresőóriást is.
+1. lépés: Utókövetés
Na, ez az a pont, ahol a legtöbb webfejlesztő (tisztelet a kivételnek) elengedi a kezedet. Én a weboldalad átvételét követő három hónapig figyelemmel kísérem annak működését, és segítek felszámolni a problémákat. Félreértés ne essék, ez nem azt jelenti, hogy az új ötleteidet beépítem a weblapodba! (Nem, az utókövetés során nem fogom "csak" a hírlevél feliratkozó űrlapot sem beilleszteni.) Ezek majd egy új szerződés tárgyát fogják képezni, ha igényled.
Jó, jó! De mennyibe kerül?

Kérlek vedd figyelembe, hogy továbbra sem tudok – és nem is akarok – árajánlatot adni a “Mennyiért dobsz össze egy weblapot?” jellegű kérdésekre. Én ennél ugyanis sokkal többre tartom ügyfeleimet.
Mivel a webfejlesztés és a webdesign kreatív tevékenységek, nagyon ritka kivételektől eltekintve nem órabérben, hanem egyedi projekt árazással dolgozok. Úgysem fog nyugton hagyni a kérdés, úgyhogy elárulom: indulásnak nyugodtan számolhatsz 50.000 - 100.000 Ft körüli összeggel, persze csak akkor, ha éppen egy online névjegyre, vagy az egyéni vállalkozásod bemutatkozó weblapjáról van szó.
Igen, tudom. A szomszéd gyerek olcsóbban bevállalja. Biztos jó lesz. Te adsz neki egyet Szent István királyunk képmásából, ha nagyon pofátlan, akkor Deák Ferencéből, cserébe ő lekap egy jó esetben ingyenes sablont a netről, feldobja rá azt a pár mobillal lőtt, vagy innen-onnan lelopott képet, meg azt a néhány mondatot, amit te adtál neki. Ha nem tetszik a végeredmény, te leszel a hibás, hiszen te adtad a tartalmat. Ja, hogy itt-ott látszik még a "lorem ipsum", és gyanús, hogy vevő egy sem jelentkezik? Hát igen. Ilyen ez a popszakma. Lehet szuper olcsón is weboldalad, csak az a kérdés, hogy tényleg megéri-e?
Kulcsszavak

Kőrösi Zoltán
webfejlesztő és webdesigner