Weboldal készítés trükkök, tippek és aranyszabályok

Hogyan készítsünk olyan weboldalt, ami profitot is termel?

A weboldal készítést, ha megfelelően művelik rengeteg dologból tevődik össze, sok apró részletre figyelnünk kell, hogy hatékony legyen. Eljön az a pillanat, mikor elhatározzuk magunkat és szeretnénk kiragadni az online világ tortájából egy szeletet vállalkozásunk leendő weboldalával. Beszélhetünk akár induló vagy meglévő vállalkozásról ez égető gondot okozhat, ha nem rendelkezünk elég információval a szakszerű weboldal készítéshez. Egy weblap elkészítése nem atomfizika a mai világban, aki kicsit is utána jár a témának az tudja.

Rengeteg egyszerűen kezelhető tartalomkezelő van, amit programozási tudás nélkül is olyan szinten tudunk kezelni, hogy publikálhassunk egy honlapot.

Igen ám, de kicsit gondoljuk tovább… Ilyen egyszerű lenne? Akkor mindenki csak készítene saját maga egy weboldalt és folyna be a pénz az ablakon, ha meg van a megfelelő szolgáltatás vagy termék. A beruházásunk pikantériája itt kezdődik. Ennek a weblapnak ügyfeleket kell hoznia, forgalmat kell generálnia, e-mail feliratkozásokat, profitot termelnie újra és újra.

· Milyen legyen a weboldal struktúrája?

· Hogyan ragadjuk meg a látogató figyelmét a másodperc töredéke alatt?

· Miért és hogyan legyen gyors egy weboldal?

· Hogyan lesz több látogatónk?

· Hogyan lesz jobb helyen a weboldalam a keresőkben?

· Mit kell tennünk, hogy jó konverziós arányokat érjünk el?

Sorolhatnánk szerintem ezeket az ésszerű kérdéseket most együtt a monitor vagy a telefon előtt ülve egy pár óráig, de minek. Olvasd végig cikkünket és nem tartom valószínűnek, hogy maradni fognak kérdéseid a kezdéshez.

Weboldal készítés trükkök és tippek Magyarországon egyedülállóan részletesen! Statisztikákkal és kutatásokkal egyértelműen alátámasztva.

Weboldal készítés alapok.

Hogyan kezdjünk neki egy hatékony weblap készítéséhez?

1.Egyértelmű célok meghatározása

Sokan lehet túlerőltetettnek érezhetik, hogy arról beszéljünk mi legyen a weboldal célja,mivel egy vállalkozó tudja már mit akar elérni ezzel. Eladni, kapcsolat felvétel elősegíteni, blogolni esetleg forgalmat generálni másik testvér weblapra, szolgáltatásokat nyújtani vagy szimplán egy erős fizikai, offline vállalkozás márka építését kezdené meg. Ezen a ponton mindig biztosak vagyunk a célban, hiszen ezért fogalmazódott meg a weboldal készítés ötlete. Erre egy idézetet szoktam felhozni…

"A cél terv nélkül csak álom marad"

ami nagyon jól lefedi az ember szellemi énjének hibáját. A konkrét határidős célokat felállító emberek egyszerűen hatékonyabbak, sikeresebbek az élet minden területén. A fókusz mindig megmarad és elősegíti a sikert. Másként hajlamosan vagyunk dolgok felett elsiklani, telnek a napok nap után és a „decemberben” felállított terveink intenzitása folyamatosan kopik. Ez szimpla pszichológia és stratégia. Ezt a célt minden esetben dokumentáljuk egy online marketing tervben és „nem tévesztünk célt” a weboldal készítéssel. J Továbbá ezt valahogyan mérnünk is kell, mert ha adatunk nincsen akkor nem tudunk megfelelően optimalizálni és hatékonyabbá tenni weboldalunkat.

Összegezve:

· Fektessük le a weboldal fő célját

· Fogalmazzunk meg mellék célokat is

· Foglaljuk bele egy tervezetbe, online marketing tervbe

· Határozzunk meg időpontokat, felelősöket

· Tervezzük meg az optimalizálási folyamatot( Google Analytic, adatelemzés, optimalizálás)

2. Tartalommarketing a weboldal készítésnél

Logikai menetünkben a cél meghatározás után el kell gondolkoznunk az oldal tartalmán. Még, ha meg is bízunk valakit akkor is tisztában kell lennünk azzal mit szeretnénk a gyakorlatban látni. Még nem készül a weboldal, de így már annyi ötlet és elképzelés van a kezünkben, amire a szakember ténylegesen fel tud építeni egy számunkra megfelelő weblapot és ami a legfontosabb MI felkészültek leszünk már hogy mit szeretnénk a célközönségünk elé tárni. Az ideális tartalommarketing fegyvere a nyelvezet és a szavak megfelelő használata. A figyelem felhívás használata, az érzelmekre ható kontextusok alkalmazása mind elengedhetetlen, hogy az online térben másodpercek alatt meggyőzzük az olvasót.

Hé ez érdekelhet! Csak tovább olvasom…

Az érdeklődést fent kell tartani, ahogy a szöveg halad. Mindig újabb és újabb figyelem felkeltés biztosítja azt, hogy a konverziós célunk teljesüljön a weboldal készítéssel bármi is legyen az. Meg vannak azok a posztok Facebook-on, amikor ahhoz, hogy megtekints egy videót meg kell osztani a bejegyzést? Tudjuk azt, hogy megint ilyen hülyeség, de abban reménykedve hogy megtudjuk nézni mégis rákattintunk és utána lépünk is, mert nem akarjuk megosztani( sokan azért megosztják J) Jön a kérdés:

Miért érdekelt mégis minket annyira, hogy többszörösen bedőljünk neki? A FIGYELEM FELHÍVÓ CÍM!

„Brutálisan baleset Romániában. A medve megtámadta a kirándulót. Erős idegzetűeknek!”

Ez a cím 3x-osan is felkelti figyelmünket és olyan dolgot ígér, ami arra késztet minket, hogy a kattintást tehát a cím célját elérje.

Összegezve:

· Legyen egy tartalom tervezetünk weboldal készítés előtt

· Rövid, de hatékony szövegeket használjunk figyelemfelkeltő címekkel

· A szöveg közben figyeljünk az érdeklődés fenntartására

· Használjunk olyan szavakat, amik a nekünk szükséges érzelmeket váltják ki( bizalom, hitelesség, biztonság stb…)

· Ne legyen túl hosszú sem, arra ott van a blog

· Értsük meg a célközönségünk problémáit és mondjuk el miben segíthetünk

· Használjunk nekünk releváns cselekvésre ösztönzést

Ha szeretnétek kicsit jobban belemélyedni a tartalommarketingbe igaz, hogy angolul, de a Wordstream összeszedett pár tippet, amik nagyon jók!

3.Weboldal struktúra elemzés – Elemezzük a vezető konkurenciát - Piackutatás

Minden iparág más és más weboldal kialakítást kíván meg, olykor csak nüansznyi különbségeket, de néha ez a kevés kell ahhoz, hogy a konkurenseinknél hatékonyabbak vagy legalább ugyanolyan hatékonyak legyünk. Vezető versenytársaink már valószínűleg jó pár óra tesztelésen és pénzráfordításon vannak túl. A piackutatás kettős célja minden esetben hasznunkra válhat felméri célközönségünket, termékeink és szolgáltatásaink iránti igényt és a konkurencia erősségét, hogy egyáltalán érdemes-e weboldalt készítenünk vagy készíttetnünk.

Jó megoldás és költséghatékony lehet a már meglévő weboldalak elemzése a piacunkon, de tudjuk is, hogy mit nézzünk? Szedjük össze pontokban a hatékonyság érdekében.

· Milyen a menü elrendezés?

· Mennyi aloldal van?

· Vannak-e gyors hivatkozások?

· Milyen grafikai effektek vannak?

· Van e blog? (keresőoptimalizálás szempontjából később bővebben)

· Mekkora a „header” (felső menü sáv)

· Mennyire terjedelmes a „footer” (alsó menü sáv)

· Vannak-e közösségi média hivatkozások?

· Mekkora mértékben és hogyan változik az oldal mobilnézetben?

· Hol vannak kapcsolat felvétel űrlapok?

Nézzük meg a weboldalak vizsgálata alatt, hogy hol jelenik meg egy minta, sűrű egyezés az 100%, hogy működő képes a piacon! Gyakorlati példaként, vannak olyan iparágak, ahol kész öngyilkosság gyors linkeket elhelyezni már a főképernyőn, viszont, ahol nem kell a meggyőzés, hanem inkább a gyors „kiszolgálás” ott sikereket érünk el vele.

Ne féljünk rajzolni! Csináljunk skicceket!

A különféle struktúrák vizuális tervezése nagy segítség

4. Weboldal készítés kezdete

Most már végre eljutottunk arra a pontra, ahol fizikálisan is elkezdődik a weboldal készítése a felhasznált információk alapján. Most vonatkoztassunk el attól, hogy ezt önállóan mi szeretnénk vagy kiadjuk külsősnek. Kell egy ütős, céges domain név! Ha valami ingyenes tartalomkezelővel is építjük oldalunkat minden esetben tudunk hozzá kötni egyedi domain nevet. Miért fontos? Saját márkánk építése elengedhetetlen, ahhoz hogy igazán nagy sikereket érjünk el ehhez az online világban egy frappáns, hozzánk jól kötődő domain névre van szükségünk, ami keresőoptimalizálás szempontjából is megfelelő. Itt tudtok keresni, hogy mik az elérhető nevek .hu kiterjesztéssel. Választhatunk nagyon sok tartalomkezelő felület közül, de az üzleti cél, amit az első pontban tárgyaltunk segíthet a szűkítésben. Fontos feltételek, hogy ez a CMS legyen biztonságos, könnyen integrálható más IT megoldásokkal például online fizetés, hírlevél feliratkozások stb. Sorolok fel pár elterjedtebb megoldást a döntést pedig a saját célunk határozza meg. Járjátok jól körül, hogy nektek a legjobb megoldás születhessen meg.

4.1 Weboldal és webáruház motorok:

· Shoprenter

· Webnode

· Shopify

· Joomla

· Wordpress

· Wix

· Egyedi fejlesztés

Személy szerint a legkiforrottabb webáruház motornak a Shopify-t a legjobb weboldal CMS-nek pedig a Wix rendszerét tartom. Testre szabhatóság, biztonság és egyediség szempontjából. Mindegyik nagyon jól integrálható külsős appokkal legyen az online fizetés, analitika.

4.2 Weboldal készítés design elemei

Fontos megemlíteni, hogy a weboldalon közzétett elemnek valamilyen funkciót minden esetben be kell tölteni és nem csak úgy fel rakjuk őket. A grafikai elemeknek, tartalomnak el kell érnie a látogatóban, hogy valamilyen érzelmet váltson ki és konverzióra késztesse.

a, Weboldal készítés szín tippek

A színek a weblapok lelke és nagyon sok mindent elárulnak a cégünkről. A színek segítenek megragadni a látogató figyelmét akár tudat alatt is, érzéseket keltenek, cselekvésre ösztönöznek vagy akár bizonyos üzeneteket tudnak erősíteni a megfelelő használatukkal.

Három színcsoportot különböztethetünk meg:

· Hideg színek

· Meleg színek

· Semleges színek

A weboldal készítés elején nagyrészt fehér fekete szín összeállításokat találhatunk. A háttér fehér a szöveg fekete. A színek variációjával nagyon jól feltudjuk hívni a figyelmet fontos üzenetekre, gombokra és olyan gyors hivatkozásokra, amik segítenek elérni céljainkat. A színek segíthetnek abban, hogy márkánkat kiemeljék a piacon. Gondoljunk csak a Telekom példájára. Az általuk létrehozott pink színről (#e94097) akkor is tudjuk, hogy a nagyvállalatról van szó, ha semmilyen rájuk utaló szöveget nem találunk.

Egy hasznos alkalmazással a Google Chrome bővítmények közül mindenképpen telepítsük az Eye Dropper alkalmazást, ami konkrétan megmondja a színekről, hogy milyen színkódúak. Ezzel megkönnyítve munkánkat vagy akár már konkrét általunk összeállított színeket adhatunk a weboldal készítő külsős cég számára.

Az Eye Dropper minden weboldalon képes megmondani a színek kódját

Hideg színek

Nyugodtságot, passzivitást, hozzáértést és megfontoltságot sugallnak a megfelelő arányukkal. Fontos, hogy ezek színek tágítják a teret a weboldalon ezt kihasználva tovább maradásra, nyugodtságra ösztönözhetjük a látogatóinkat. Sokszor előfordul a meleg-hideg színek kombinációja a kívánt egyensúly elérésében. Hideg színek: kék, zöld, lila. Vannak olyan zöld színek, amik árnyalatukkal melegséget sugallnak, tehát nem lehet minden esetben általánosítani. Mélyebb szín elemzést találhattok magyarul.

Meleg színek:

Melegséget mutatnak, dinamizmust és örömöt. Túlzó használatuk, viszont már olyan agresszivitást, ami a mérleget rossz irányba fordítja. Tehát óvatosan a használatukkal. A meleg színek a nyár és ősz tipikus színei. Lehetnek meleg sárgák, pirosak, barnák. Ezekhez a színekhez kéket keverve egyre jobban a hideg hatás felé megyünk el. Elég összetettek a meleg színek variációja. Meleg színek: piros, narancssárga, sárga, barna.

Semleges színek:

Az örök aduászok a fekete, fehér és a szürke. Szakszerű használatuk, minden weboldal típusnál nagyon jól kombinálhatóak. Ezek a színek kifinomultságot, nyugalmat és, ami nagyon fontos komolyságot és eleganciát kölcsönöznek weblapunknak. Túlzó használatok passzivitást és unalmasságot mutatnak ezért minden esetben érdemes kizárólag valamilyen meleg színnel feldobni a design-t. Meleg és semleges színek összhangja egyedülállóan jó!

Tehát a színekkel úgy kell „játszanunk”, hogy azok illeszkedjenek ahhoz az elvárásokhoz, amiket a céljaink meghatározásánál felállítottunk. Például egy klímákat áruló webáruház esetén a hideg színek legyenek uralkodóak. A Marketo vizsgálata szerint megtudhattuk, hogy a világ nagy márkái milyen színeket használnak és milyen színek uralkodóak napjainkban.

A TOP 100 nagy márka 33%-a a kék színt és kombinációit használja. 29% a pirost, ami intenzitását ennek a színnek nem is meglepő. A sárga és arany színt pedig 13%. Fontos megállapítás volt, hogy a színeket nem kell túlzásba vinni a TOP 100 nagy márka csak 1 vagy 2 színt használ összesen.

A kék szín népszerűsége nem meglepő. A színvakság ezt a színt érinti a legkevésbé, a művészet is egyre jobban a kék pigmentek felé húzódik. A kék pszichológiája esetén megfigyelték, hogy növeli az emberekben az interakciót. Csak említésképpen Facebook, Skype, Twitter, LinkedIN és még sorolhatnám.

A kék a legnépszerűbb szín a világon

b, Grafikai effektek és animációk weboldal készítésnél

Ezek azok a megoldások, amivel kifejezhetjük cégünk modernitását és egyediségét. Egy weboldalt ezeknek az effekteknek az alkalmazása kiemelheti weblapunkat a konkurens tömegből, amire látogatóink felkapják a fejüket és azt mondják, hogy „HMM, ez marha jól néz ki”. Ilyen opciók lehetnek dinamikus keresésmezők, hover animálások, parallax görgetés, háttér sötétítés, videó effektes weboldal, képek közelítése görgetés esetén stb. Olyan összhatást tudunk elérni ezeknek a megfelelő kombinációjával, ami lebilincselő felhasználói élmény nyújt a látogatónak.

Dinamikus keresési mező

Ennek a lényege, hogy a háttér, ahol éppen a keresőre mentünk megmarad viszont az előtérbe a keresési mezőt helyezi. Ez egy minimalista weboldal esetében rettentően jó megoldás. Ilyen például a Snowbird weboldala. Esztétikusan megtudjuk jeleníteni a keresési előzményeket egész képernyőn és így további ötleteket adva az oldalon tartózkodásra.

Hover effekt

A Hover effekt a kurzor és az ujjunk mozgására élesedik. Kifejezetten jó megoldás webáruházak termék képeinek kiemelésére és javítja a felhasználói élményt, ami keresőoptimalizálás szempontjából is jó hatással lesz weblapunkra. Ilyen oldal például a Snowe weboldala. Gyakorlati példaként, ha árulunk egy felfújható gumicsónakot az első megjelenő kép lehet egy csomagolt állapot és, ha az egérrel vagy az ujjunkkal oda megyünk a képre megjelenik a termék kész, felfújt állapota.

Parallax görgetés

Ez a megoldás egy 1 oldalas landing oldal(görgetős weboldal) esetében tökéletes döntés. Növelve az esztétikát és a weblap UX-ét(user experience). Ilyen weboldal Melanie cipő gyártó cége. További mélységet az oldalnak, ami beszippantja a felhasználót.

Háttér sötétítés

Rengeteg webshop használ háttér sötétítést a termékek gyors nézeténél. Ez segít összpontosítani a felhasználónak az adott termékre és megteremti a kínálat életérzését.

Termékünk külön történetet kaphat alkalmazásával

Videó effektes weboldal

A videók egy külön történetet biztosítanak a termékünknek és szolgáltatásainknak. Növelve a látogatók interakcióját. Például az Adobe online marketing tanulmányaiban egyértelműen növelték a felhasználói élményt és az aktivitást. Sokkal több információ mondható el, mint egy sima képpel vagy szöveggel.

5. Weboldal készítése a keresőoptimalizálásra figyelve

Nem elég egy weboldalt elkészíteni azt nem magunknak csináljunk, valamit elvárunk tőle, de legfőképp, hogy látogatóink legyenek. Ezt keresőoptimalizálás nélkül nagyon lassan tudjuk elérni. Erre van egy jó idézet, amit fel szoktam hozni az ügyfeleimnek, ami lefedi a lényeget.

„A weboldal, amit nem látnak a keresők, pont annyit ér, mint a szekrény mögé csúszott méregdrága katalógus”

Szerencsére már Magyarországon is egyre többen tisztában vannak a SEO fogalmával. Elfogadják azt a tényt, hogy a weboldal készítés párban jár a keresőoptimalizálással, ha eredményeket akarnak a lehető legrövidebb időn belül. Mire figyeljünk oda, ha magunk szeretnénk végezni?

· Legyen a weboldal gyors

· Legyen a weboldal mobil barát

· Szövegünk tartalmazzon nekünk releváns kulcsszavakat

· Képeink legyenek tömörítve és legyenek ALT szövegei

· Használjunk megfelelő tagoltságot és H1-H6 címeket kulcsszavakkal

· Az oldal legyen vertikálisan és horizontálisan is összekötve

· Legyenek megfelelő számú belső linkünk

· Legyenek külső, más weboldalakról ránk mutató linkjeink

· Legyen jó a felhasználói élmény ezáltal több időt töltve weboldalunkon

· Szakmai tekintélyünket támogassuk a közösségi médiával

· Tartalmunk legyen egyedi országos szinten is

Rengeteg mindent lehetne még írni, ezek azok amik csak hirtelen eszembe jutottak. Írtam egy bővebb, kiveséző és országosan vezető cikket, hogy egyáltalán Mi az a keresőoptimalizálás? Érdemes-e megtanulni a SEO-t? itt sok kérdésetekre választ kaphattok.

6. Weboldal készítés utáni élet - Analitika és web CRO javítás

Elkészült a weboldalunk, megpróbáltunk figyelni arra, amire lehetett már a tervezésnél és kivitelezésnél. Kizárt dolog sajnos, hogy ez 100%-ban sikerüljön még egy profi weboldal készítőnek is. A weblap készítés után jön még csak a fekete leves, figyelnünk a kell a meghatározott cél alapján a teljesítményünket. Adatot gyűjteni, elemezni és optimalizálni. Ez egy véget nem érő folyamat!

Hála isten már rengeteg opciónk van, amivel mérni tudjuk a weboldalunk hatékonyságát, de én csak kettőt emelnék ki az így is hosszúra nyúlt cikkemben. Ez a Google Analytics és a Hot Jar.

Google Analytics

A Google által létrehozott analitikai szoftver alapkelléke annak az információ tengernek, amiket elemeznünk kell. Szegmentálhatunk idő szerint, célközönség szerint és igazából minden szerint, amit el tudunk képzelni. Azt is megtudja rólunk mondani, hogy mikor, mennyi ideig, milyen eszközön és hol tekintettünk meg egy weboldalt. Beállíthatunk vele konverziós célokat például egy kapcsolat felvételi űrlap elküldését, e-mail feliratkozást és még sok minden mást, ami hasznos lehet a weboldal készítés után az elemzésben. Bekötése kötelező!

Hot Jar

Egy kicsit vizuálisabb irányt megfogva a Hot Jar követőkódjának bekötésével hő térképen tekinthetjük meg weboldalunk látogatóinak viselkedését. Konkrétan fel vehetjük videóra a felhasználók útját weblapunkon és így olyan javításokat eszközölhetünk, amik segítenek elérni a céljainkat. Láthatjuk, hogy hol lépnek ki az oldalainkról a legtöbbször és ezeknek 99%-ban oka is van megfelelő adatmennyiség esetén.

GY.I.K

Milyen weboldal szerkesztők vannak?

1. Wix

2. Webnode

3. Ucoz

4. Wordpress

5. Joomla

6. Magento

7. Xara Web Designer

8. Godaddy

9. Weebly

10. SimpleSite

11. BigCommerce

12. Site123

13. web.com

A top 11 weboldal analitikai eszköz

1. Google Analytics

2. Spring Metrics

3. Hot Jar

4. Woopra

5. Clicky

6. Mint

7. Chartbeat

8. Kissmetrics

9. Usertesting

10. Crazy Egg

11. Mouseflow

Weboldal készítés tippek és trükkök konklúzió

A rengeteg információ után érdemes azért valamennyire összeszednünk azokat a támpontokat, amik fontosak egy weblap készítésénél. Lássuk:

1. Határozzuk meg a weboldal egyértelmű, fő célját

2. Végezzünk nagyon részletes piackutatást

3. Elemezzük ki a konkurenciát a végletekig, nézzük végig az összes weboldalt

4. Legyen egy tartalom tervezetünk készítés előtt

5. Válasszuk ki a mi egyedi célunknak legmegfelelőbb tartalom kezelőt, amivel a weboldal készül

6. Válasszunk mindenképpen egyedi, ötletes domain nevet!

7. Weboldal készítésnél tudatosan használjuk a színek kombinációit annak érdekében, hogy a weblap célját és a rólunk kialakítani kívánt érzelmeket elérjük

8. Használjuk a tartalommarketingnél bevált módszereket( cselekvésre ösztönzések, figyelem fenntartást, figyelem felhívó címek, érzelmekre ható szavak kombinációja)

9. Használjuk az iparágunkban bizonyítottan bevált weboldal design effekteket

10. A weboldal és tartalma készüljön a fő keresőoptimalizálási tényezőket szem előtt tartva

11. Weboldal készítés után kössünk be minél több analitikai eszközt, hogy megfelelően tudjuk optimalizálni oldalunkat

Ha szeretnéd megkímélni magad a teszteléstől keress meg minket bátran! Ingyenesen, kötöttségek nélkül beszélhetünk a céljaidról! Konzultáció!

#hypermarketing #weboldalkészítés #weboldaltippektrükkök