WordPress oldal készítés lépései

Bemutatjuk a WordPress oldal készítés lépéseit. Tudj meg többet arról, hogyan készül egy WordPress alapú weblap!

A WordPress a legelterjedtebb tartalomkezelő rendszer (röviden: CMS - content management system). A WordPress oldal készítés lépései egyszerűek, logikusak és könnyen végrehajthatók. A WordPress használható laikusok számára is, de van az a bonyolultsági fok, ahol érdemes profira bízni a céges weblapfejlesztést.

A világ weblapjainak 65%-át WordPressben készítik, ha CMS rendszert is tartalmaz a weblap. Ha az összes weblapot nézzük, akkor annak "csak" a 43%-a készült WordPressben.

Elképesztő piaci részesedés, ami mellett nem lehet elmenni egy legyintéssel. Hatalmas lehetőség a WordPress használat mindenkinek, aki akár saját blogot szeretne készíteni, akár annak, akinek hivatalos, céges weboldalra van szüksége.

Ha szeretnél az alapoktól indulni és nem tudod, mi az a WordPress, olvasd el kapcsolódó blogcikkünket: Mi a WordPress és mire használható?

1. Honlap típusának meghatározása

Első lépés annak meghatározása, hogy miért akarsz weblapot készíteni és pontosan milyen típusú honlapot akarsz csinálni. Weboldalak fejlesztésére többnyire az alábbi célok miatt lehet szükséged:

Személyes blog készítése

A WordPress is innen indult: a WordPress fejlesztésének célja az volt, hogy minél egyszerűbben és mindenféle technológiai ismeret nélkül bárki képes legyen személyes blog oldalt készíteni. 

Ez a mai napig elvégezhető, pusztán némi technikai érzék kell hozzá. Menete viszonylag egyszerű: tárhely előfizetés, domain regisztráció, WordPress telepítés és beállítás és már kezdődhet is a blogírás. A teljes munkafolyamat néhány órát vesz igénybe és ténylegesen nincs szükség IT szakemberre ahhoz, hogy elindíthasd személyes blogodat.

Vállalati weblap készítése

Céges weblap készítése az esetek többségében statikus weblapok és 1-2 külső rendszerkapcsolat kialakítását jelenti.

Statikus oldalak alatt a nem változó, nem dinamikus weblapokat értjük, tehát az olyanokat, amik a cég szolgáltatásait írják le, és a cégról szóló információk bemutatására szolgálnak (pl. rólunk oldal, kapcsolat oldal, stb.)

Dinamikus oldalak alatt azokat a weblapokat értjük, ahol a tartalom változik, annak forrása egy külső rendszer. Ilyenek lehetnek például álláshirdetések, képzések, vagy bármi egyéb információ, melyeknek kezelését külső rendszerben végzed el.

Napjaink vállalati weblapjai statikus és dinamikus oldalakat is tartalmaznak. De mielőtt általános megállapítást tennénk, fontos leszögezni, hogy a legfontosabb útmutató a weblapkészítés során az, hogy a céged weblapja pontosan azt kell, hogy tartalmazza, amire a te cégednek szüksége van.

A cél meghatározás másik fontos része az, hogy kimondásra kerüljön, a weblap azért jön létre, hogy a cég ismertségét növelje és/vagy azért, hogy bejövő megkereséseket generáljon, vagy más okból (például terméket értékesítsen). Csak ezek ismeretében készíthető olyan weboldal, aminek valós értéke lesz, ami értéket generál.

Webshop készítése

Weblap készítése során meghatározandó, hogy a weboldal tartalmazni fog-e webshopot vagy sem. Mindkettő esetben hasonló a WordPress weblap készítés menete. A webshoppal rendelkező weboldalak készítéséről külön oldalunkon is tájékozódhatsz: webáruház készítése.

2. Domain- és tárhely előfizetés

A domain és tárhely regisztráció kéz a kézben jár, de természetesen külön-külön is elvégezhető. Javasoljuk először a tárhely kiválasztását és ezt követően a domain megvásárlását az adott tárhelyről. Azért érdemes így csinálni, mert ebben az esetben nincs szükség a domain átregisztrációjára, hanem a tárhely és domain már a kezdetektől egy helyen van.

De mi pontosan a domain és tárhely?

Tárhely jelentése

Tárhely az a fizikai tárolási hely, ahol a weblapod (kódja, forráskódja, adatbázisa, stb.) tárolásra kerül és ahonnan a weboldalad megjelenítésre kerül. Az "ahonnan" szónak az a magyarázata, hogy a böngészőből érkező kérést fizikailag erről a helyről szolgálja ki a weblapod. 

Ennél is egyszerűbben fogalmazva: tárhely az a szerver, ahol a weblapod van.

Domain jelentése

A domain név a honlap neve. Például: bluebird.hu 

A domain név megválasztása leginkább üzleti döntés, ezt követően pedig SEO döntés.

3. Sablon kiválasztása

Kezdjük azzal, hogy mi is az a sablon?

Sablon kiválasztásánál az alábbi tényezőket érdemes figyelembe venni.

A sablon fejlesztése / továbbfejlesztése biztosított-e.

Amennyiben a sablont fejlesztő cég működik és folyamatosan újabbnál újabb verziókat ad ki, akkor vélhetően élő és aktív a sablon.

Sablon elterjedtsége

Elterjedt-e a sablon, sokan használják-e. Ha sokan használják, ennek nyilván az az oka, hogy használható, esetleg nagyon jó használható.

Sablon fókusza

Azt mutatja, hogy mi az, amiben jó az adott sablon. Léteznek konverzió fókuszú sablonok, léteznek SEO barát sablonok. Ha tudod, hogy mi a fontos számodra, ennek megfelelő sablont válassz.

Tapasztalat

Sablon használatában való jártasság. Rendkívül fontos, hogy olyan sablont válassz, amiben jártasságod van, vagy amivel kapcsolatban tudsz kérdezni valakitől.

Ingyenes / fizetős

A sablon használatáért kell-e fizetni vagy ingyenes. Létezik ilyen is, olyan is. Nem szabad, hogy ez legyen a fő szempont. Legyen szempont inkább az, hogy a weblappal sikerül-e elérni azt a célt, ami miatt létrejött.

Mi a Bluebirdnél leggyakrabban a Thrive megoldásait használjuk (a bluebird.hu oldal is ezzel készült), mivel általában ügyfeleinknek konverzió fókuszú, SEO barát weboldalra van szükségük. Olyanra, ami megrendelőket és megrendeléseket hoz.

4. Arculat kialakítása

Arculat kialakítása alatt két dolgot is érthetünk: egyrészt a weblap design-t, másrészt a kisarculatot.

Kisarculat elemei (weblap esetén)

Weblap vonatkozásában a kisarculat elemei: logó, brand szín, preferált színek, tipográfia, favicon. 

Nézzük egyesével, melyik mit jelent és miért fontos!

Logó

Céged logója. Ezt használod minden céges megjelenés esetén, a weboldaladon is természetesen meg kell jelennie. A logó feltöltésére a WordPress lehetőséget biztosít, sőt WordPress oldal készítés első apró lépéseinek egyike.

Brand szín

Céged vagy megjelenésed elsődleges színe. Ezt tekinti a későbbiekben alapértelmezett "céges szín"-nek a WordPress. Gyakran a logóból származó szín, definiálása mindenképp javasolt.

Preferált színek

Ezek a színek az úgynevezett globális, előre definiált színek. Nagyon nagy szerepük van. Nem kell minden oldalon emlékezni arra, hogy minek milyen színűnek kell lennie, egyszerűen a globális színként definiált színek közül kell választani. Nagy szerepe van a tipográfiában is.

Tipográfia

A weboldalad különböző kinézetű és típusú szövegeket fog tartalmazni. Lesz a sztenderd szöveg, lesznek headingek, lesznek linkek. A WordPress oldal készítés első lépéseinek egyike a megfelelő tipográfia kialakítása. Ennek keretében beállítod a szövegtípus (paragrafus, címsorok, linkek) méretét, színét, a betűk közötti távolságot, a szöveg előtti és az utána lévő távolságot (padding), stb. Miért fontos ez? Azért, mert ezek a beállítások a weboldalad minden oldalát érinteni fogják. Minden H1 címsorod annak megfelelően fog megjelenni, ahogy beállítottad a tipográfiánál. Minden szöveged olyan színű és méretű lesz, ahogy előre meghatároztad. Rá kell szánni az időt és energiát és be kell állítani rendesen minden egyes szöveg típus megjelenését.

Favicon

A favicon nem más, mint a böngésződben a weboldalad címe előtt bal oldalon megjelenő kicsi ikon. Jó esetben a logód központi elemével megegyezik, de lehet ettől eltérő is.

5. Oldal sablonok kialakítása

Mik azok a template-ek?

Oldal sablon fogalma

Az oldal sablon (angolul template) a weboldalad weblapjainak alaptípusai. Ezek az oldalsablonok határozzák meg, hogy a weblapjaid, blogod, blogposztjaid hogyan néznek ki.

Nagyon fontos lépés WordPress weboldal készítés során a megfelelő template-ek kialakítása. Nem kell ugyanis minden egyes weblapot egyesével designolni, elég az előre elkészített template-eket használni. Template típusok az alábbiak lehetnek.

Nyitólap

Weblapod nyitó oldala. Nagyon nagy szerepe van abban, hogy a weblapodra érkező forgalom mekkora százaléka fordul vissza vagy megy tovább. Persze, ez minden oldalra igaz, hiszen mindegyiken az a cél, hogy a látogató a weblapon maradjon és megtalálja, amit keresett. A nyitólap mégis komoly jelentőséggel bír, hiszen ha céged nevét ismerik, akkor nagyon nagy valószínűséggel ezzel az oldallal fognak találkozni.

Egyszerű weboldal

Célszerű lehet 1, de ennél akár több oldal template-et is készíteni. Általában jól mutat, ha például a szolgáltatások oldal sablonja azonos, de más típusú oldalak (pl. cégtörténet, vezetőink, stb.) ettől eltérőek, de az is lehet jó, ha sokféle template-et használsz. Teljesen azon múlik, hogy milyen tartalmat akarsz megjeleníteni, melyiknek milyen a szerkezete. Igény szerint tetszőleges számú weboldal template létrehozható a WordPress-en belül.

Blog oldal

Ez az oldal az, amelyik a blog cikkeid fejléc adatainak megjelenítéséért felel. Például: https://bluebird.hu/blog/. A blog oldaladat célszerű az első elkészült blogcikkek után kvázi végleges formájára hozni. A későbbiekben tetszőlegesen módosítható ez a template is természetesen.

Blogpost oldal

Blogpost oldal alatt egyszerű blogcikket értünk. Amennyiben a WordPress oldal készítés közben felmerül igényként saját blogcikkek készítése, akkor célszerű egy blog cikk template-et készíteni. Később minden blog cikk ezen az előre definiált módon fog megjelenni. Egyszer kell jól beállítani és utána nincs más teendő, mint írni a jobbnál jobb blogposztokat. Nagyon ajánljuk a blog cikkek írását, mert egy SEO szabványok szerint elkészített blogcikk aranyat ér. Miért? Azért, mert folyamatosan látogatókat hoz a weboldaladra azáltal, hogy a Google keresőben az első találatok között szerepelsz. Erről a témáról többet itt találsz: SEO és tartalom stratégia.

A helyes menürendszer megalkotásakor ugyanis strukturáltan kell látni a céged számára fontos információkat és azokat olyan módon kell alábontani, hogy önálló elemeiben önállóan értelmezhető és könnyen kereshető, SEO-képes tartalmak legyenek. Tipikus hibaként jelenik meg a szolgáltatások egy oldalon történő bemutatása (ez SEO szempontból 99%-ban teljesen hibás irány), továbbá "kevés tartalom - szinte nulla menü" szindróma is. Ez utóbbi azért problémás, mert ha nincs mondanivaló, akkor miért nézzék a weblapod? Kényes kérdések ezek a weblapfejlesztés során, de pont ezek azok a pontok, ahol értéket lehet előállítani.

7. Szöveges, képi és videós tartalmak elkészítése

WordPress weblap készítés nem létezik content (tartalom) nélkül. Nagyon fontos, hogy a weboldal készítésekor (vagy röviddel azt követően) rendelkezésre álljanak azok a statikus szövegek, képek és videók, melyek a weboldalad mondanivalóját fogják adni.

A szöveges tartalom elkészítése előtt célszerű tisztázni az alábbiakat:

Sokat nagyon alábecsülik a tartalom fontosságát. A Google keresőből nem a kinézet alapján fogják megtalálni weblapodat, hanem a tartalma alapján. A tartalom miatt kerül előre a keresőben 1-1 weboldalad, ez az, ami forgalmat generál (részletesen kifejtjük később a weblap forgalom típusokat). Ezzel nem azt mondjuk, hogy a kinézet mindegy. Nem. De a tartalom mindennél fontosabb.

Jó tartalmat írni komoly felkészülést és gyakorlatot igényel. Nem elég leírni a gondolatokat. Rendszerezni kell azokat, egyszerűen és érthetően meg kell fogalmazni és nem utolsó sorban SEO szempontoknak megfelelően kell elkészíteni. 

Léteznek ragyogó cikkek különböző témában, melyek a megjelenést követően sosem kerülnek az olvasók szeme elé. És léteznek olyan tartalmak is, melyek szinte azonnal elfoglalják első, második helyüket a Google keresési találatok között. Véletlen, hogy melyik tartalom hol végzi? Korántsem. Tudj meg többet erről SEO oldalunkon.

A szöveges tartalmakon kívül képi megjelenésre is szükséged lesz. Óvakodj a netről letöltött képektől, ezek többnyire jogvédelem alatt állnak. Helyette tudsz használni saját képeket vagy előre készített profi fotókat (pl. Shutterstock), melyek azonban elég drágák. Mégis, a profi megjelenés szinte minden esetben megéri az árát, hiszen a képi világ, amivel a weboldalara látogató találkozik, rendkívül fontos.

Ha megteheted, használj saját videókat, YouTubera feltöltve és azt belinkelve a weblapodra. Ennek számos haszna van, többek között növeli az oldaladon töltött időt a videó megnézésével, továbbá a Google nagyon komolyan előnyben részesíti a YouTube tartalmakat. Próbáld ki ha teheted, de abban biztos lehetsz, hogy egy jó minőségű videó nem feltétlen olcsó mulatság.

8. Statikus tartalom feltöltése

A WordPress egyik legnagyobb előnye az, hogy a CMS rendszere nagyon kiforrott és rendkívül könnyen használható. Szinte olyan, mintha Word dokumentumot írnál, azzal a különbséggel, hogy webes komponenseket is használhatsz. Beszúrhatsz képeket, videókat, testimonialokat készíthetsz, logót vagy Google tértképet illeszthetsz be. Bármit, amit a választott sablonod lehetővé tesz.

A statikus tartalmat oldalanként és blog cikkenként egyesével tudod feltölteni. Kezdetben sokan Wordben írják meg a tartalmakat, de később szinten mindenki úgy használja a WordPress-t, hogy már eleve ott kezdi el írni egy-egy új oldal tartalmát. 

A WordPress oldal készítés kényelmi részét képezi az, hogy weboldalakat tarthatsz vázlatként, azaz külső szemek által nem láthatóként, majd ha már minden szempontból rendben van a weboldal, publikálhatod.

Azok számára, kik szeretnek írni, valóságos kánaánt jelent a WordPress, annak minden könnyűségével, egyszerűségével és gyorsaságával. Sőt! Akár a cég fejlesztéséhez is könnyen hozzájárulhat a WordPress-es tartalomkészítés, hiszen a kirakat nézegetésekor számos kérdés felmerülhet, ha a weboldal látogató szemével nézed saját oldaladat. Mik lehetnek ezek? Nem egyszerű és érthető, hogy kik vagyunk? Nem érthető kellően a fő üzenet. Nincs is fő üzenet. Kinek is szól a weblap? Ezekhez hasonló kérdések tucatja előjöhet a weblap készítés során. "Nagy baj, ha így van." - mondhatják sokan. Lehet, de még mindig sokkal jobb, hogy előjönnek ezek a kérdések, mintha senki soha végig sem gondolja.

9. Külső rendszerkapcsolatok kialakítása

A WordPress projektek ezen a ponton szoktak megakadni. Amint külső rendszerhez kell csatlakozni, máris fejlesztőre van szükség. Igen. Bár véleményünk szerint WordPress weboldal készítése ugyan egyszerűnek tűnő feladat, valójában jó tartalommal rendelkező és jó teljesítményadatokat mutató weboldal fejlesztése már nem az. Persze mindenki ért a focihoz, valójában alaposan igen kevesen. Ugyanez a helyzet a weboldal készítéssel is és ez kicsúcsosodik a külső rendszerkapcsolatok fejlesztésekor is.

Mik lehetnek a külső rendszerkapcsolatok? Bármilyen olyan tartalom, ami külső forrásból származó adatra épül. A Bluebird oldalán például az IT állások és IT projektek rész külső adatforrásból, a saját vállalatirányítási rendszerünkből (ERP) származik. Karbantartása az ERP rendszerben történik, megjelenítése pedig a weblapon.

A külső rendszerkapcsolatok fejlesztése a legtöbb esetben egyedi fejlesztést kíván, melynek alapja a megrendelői követelmények megértése, specifikálása. Ezt gyakorlott rendszerszervezők vagy fejlesztők végzik.

11. Tesztelés

Amennyiben elkészül a weblap statikus és dinamikus tartalma, indulhat a tesztelés. Persze lehet több lépésben is tesztelni és nem feltétlen kell bevárni a teljes készültséget. Weboldal tesztelése során ellenőrizni kell, a menürendszert, az oldalakat tartalom és design szempontjából is, az egyedi kódok működését (lásd külső rendszerkapcsolatok rész). 

Tesztelés során ki kell térni a használhatóságra és a teljesítménymutatókra, továbbá gondoskodni kell a weblap biztonsági paramétereinek ellenőrzéséről is. (Weboldal tesztelésről külön olvashatsz weboldalunkon.)

12. Weboldal indítása

Ha mindezeken túl vagy, indulhat a weboldalad. És ha azt gondolod, hogy ezzel végeztél is, elkészültél, lehet foglalkozni mással, akkor azt kell mondanunk, hogy valószínűleg tévedtél. A munka második része még csak most kezdődik, hiszen hiába van weblapod, ha nincs látogatód, ha nincs megkeresésed a weblapon keresztül, ha nincs értékesítés, nincs bejelentkezés. 

Ha webfejlesztővel készítteted el a weblapod, általában eddig a pontig jutsz el. Véleményünk szerint azonban innen kezdődik egy másik érdemi munka: weblapod forgalmának növelése, céged forgalmának növelése.