Itt egy cheklist mielőtt weboldalt fejlesztünk – 57+1 fontos teendő

Valljuk be, ha egy új weboldalt fejlesztünk az minden esetben stresszes, még akkor is ha sokat tapasztalt ügyfél vagy, vagy akár az on-line területen van tapasztalatod. Mindez persze azért van, mert egy weboldal, webáruház vagy bármilyen más webes szoftver indítása nem csak technikai és szakmai kihívás, hanem üzleti szempontból sem kisebb kockázat.

Egy weboldal fejlesztés során olyan de olyan sok apróságra kell figyelni, hogy még ez a lista sem lesz teljes, sőt… Egy weboldal indítása során még a legapróbb helyes írási hiba is bosszantó lehet, főleg ha nem mi vesszük észre. Itt egy cheklist mielőtt weboldalt fejlesztünk, weboldal készítés előtti fontos teendők egy helyen összeszedve. Ha weboldalt fejlesztünk az minden esetben stresszes lehet.

A weboldal (webáruház) indítása üzleti befektetés

Ezért nem engedheted meg magadnak azt a luxust, hogy céltalanul csak úgy bele a vakvilágba kitálaljunk egy weboldalt – vagy webáruházat – majd azzal nem foglalkozva, esetleg üzleti cél nélkül létrehozva azt, elhanyagoljuk. Ezzel gyakorlatilag foghatunk 3 köteg húszezrest, bedobhatjuk egy fém vödörbe benzint rá és had égjen 🙂

És persze számtalan sok dolog mehet el a rossz irányba, mi történne akkor ha egy kapcsolatfelvétel űrlap hibás címre küldené az adatokat, mert elfelejtetted tesztelni azt. Vagy mit lenne akkor, ha elfelejtettük volna beállítani az új weboldaladra mutató 301-es átirányításokat és ezáltal sok sok látogatót vesztenél a Google felől?

Aggódás helyett írjunk listát

Mennyire jönne jól, ha minden típusú fejlesztésre lenne egy – egy ilyen listánk amely alapján minden apróságon végig tudnánk menni, hogy mire kell figyelni az adott helyzetben? (Az agilis módszertanok mellet ez nagy előny, ilyen fejlesztési elvek szerint ezek a listák elkészülnek a fejlesztés közben, de erről később írunk majd cikket.) Minden esetre most próbálunk egy olyan listát írni amely megfelel az egyszerű weboldalak, micro-siteok és landing oldalak számára egyaránt.

Ez a lista a saját weboldalad alapján módosítható, bátran írhatunk hozzá vagy vehetünk el belőle. Ezt a listát sokoldalúan használhatjuk a jövőben. A lista alapvetően 7 főbb témakört ölel fel: oldal tartalma, web design, funkcionalitás, SEO, analitika, biztonság és biztonsági mentések, jogi viszonyok. A listát minden weboldal fejlesztés során érdemes elővenni, hozzáírni vagy átolvasni, nehogy valami kimaradjon.

Oldalak tartalma

Az első lépés, hogy igen alaposan vizsgáljuk át a honlap minden tartalmát, mintha egy sűrű fogú fésűt használnánk. Természetesen különös figyelmet kell fordítani a prémium tartalmakra, prémium ügyfeleknek szánt tartalmakra. Az adatokon alapuló tartalmak esetében célszerű meggyőződni a képek, videók (hanganyagok) elérhetőségéről, azok működéséről minden eszközön. Legyen minden a helyén és legyen szép.

Ezért a következőket nézzük végig majd minden esetben

1. A felhasznált szöveget lektoráltassuk Vagyis valaki(k) olyan(ok) nézze(ék) át helyesírásilag aki még soha nem olvasta!
2. Bekezdések, címek (H1-H6), listák és szöveg formázása legyen helyes. Erre vigyünk fel olyan teszt tartalmat amiben mindenből van.
3. A láblécben a Copyright és az évszám legyen minden évben az aktuális évszám.
4. A céged kapcsolattartási információi (telefon – email) legyen pontos, minden helyen ellenőrizd!
5. Az általánosan használt “Lorem ipsum” szövegeket cseréljük le és keresünk rá a kódban
6. A képek legyenek a helyükön és minden eszközön jól jelenjenek meg
7. A videók legyenek a helyükön és minden eszközön jól jelenjenek meg
8. Az audói fájlok – ha vannak – minden eszközön jól jelenjenek meg és szóljanak.
9. Minden prémium tartalom, mint például az e-könyvek, vagy letölthető termékek legyenek lektorálva, helyesírási és nyelvtani szempontból is.
10. Minden tartalom a megfelelő helyre legyen feltöltve, a feltöltések működjenek. A feltöltött tartalmak (videó, kép, hang) jól jelenjenek meg.
11. A tartalmak, betűtípusok és képek legyenek jogtiszták. A képeket vásároljuk, vagy ingyenesen használható képeket használjuk. A szövegekhez legyen jogunk közzétenni őket – írjuk magunk – vagy jelöljük meg a forrást és legyenek idézetek.

Web Design

A második témakör a weboldal készítési folyamat ellenőrző listánkban a web design, vagyis az elkészített designhoz képest a kész weboldal pontosan olyan legyen, vagy jobb :). Ha az oldal responzive – azaz mobilra optimalizált oldal akkor a tervezést lehetőség szerint a mobil verzióval kezdjük, vagy olyan technológiára tervezünk (pl bootstrap) amely garantálja a jó megjelenést minden eszközön. Az oldal nézzen ki jól minden eszközön, ne csak irodai gépek nagy monitorán hanem tableten és mobilon is használható legyen.

1. Az oldal legyen responzive és minden eszközön és minden böngészőben jelenjen meg jól. (Google Chrome, IE8-9, Firefox, Safari)
2. Legyen a weboldal kompatibilis a mobil böngészőkkel, és azokban is jelenjen meg jól.
3. A HTML és a CSS legyen validálva
4. A scriptek legyenek optimalizálva a teljes weboldalon
5. A képek legyenek progresszív JPG tömörítéssel kezelve maximum 70%-os tömörítési aránnyal
6. A favicon legyen a helyén, jelenjem meg jól.
7. A bekezdés stílusok – weboldal typográfia – feleljen meg az eredeti designnak. A betűtípusok, méretek és színek legyenek rendben.
8. A CSS és a JS file-ok legyenek tömörítve, optimalizálva.

Weboldal funkcionalitás

Funkcionalitás

A weboldal funkcióit kell egyenként végig tesztelned. Egy egyszerű céges site esetében ez valószínűleg nem túl sok funkció, de ettől még tesztelni kell például a kapcsolat felvételi űrlapokat, ajánlat kérő formokat. A forgalom konverziós pontokat alaposan át kell nézni, CRM integrációt, számlázást és minden mást ami az oldalban működni fog.

1. Az űrlapokon elküldött adatok érkezzenek meg a megfelelő helyre és formában
2. Az űrlapok utáni köszönő oldalak jelenjenek meg jól.
3. Az elküldött adatok biztosan a címzetthez érkezzenek meg és/vagy legyenek tárolva a rendszer adatbázisában
4. Az automatikus válaszok működjenek, az automatikus üzeneteket a rendszer megfelelően küldje el.
5. A belső linkek megfelelően működjenek
6. A külső oldalakra mutató linkek működjenek megfelelően és új ablakban (fülön) nyíljanak meg.
7. A közösségi média linkek (ikonok) működjenek megfelelően.
8. A hírcsatorna linkek működjenek rendesen (RSS)
9. Fejlécben a céglógó linkeljen a nyitó oldalra.
10. Betöltődési idő a lehető legkevesebb legyen.
11. A 404-es oldalak legyenek kreatívak és lehessen rajtuk tovább jutni valahova (erről későbbi cikkben bővebben is írunk majd)
12. A külső forrásokból származó komponensek integrációja legyen megfelelő, ezekre kiemelt figyelmet kell szentelni

Kereső optimalizálás – SEO

A negyedik téma – amivel már az alkotáskor – foglalkozni kell, ez a SEO vagyis a kereső optimalizálás. Ahhoz. hogy a honlapod eleve jól vegye az akadályokat nem kell mást tenned, mint már a kezdetekkor meghatározni a keresőoptimalizáláshoz szükséges információkat. Eleve ezen elvek mentén kell megírni a tartalmakat. A megfelelő meta adatok és az XML sitemap mellet még a következőkre figyelj oda:

1. Az oldalak egyedi címet tartalmazzanak (max 70 karakter) ezek legyenek kulcsszavakban gazdagok
   

   kereső optimalizálás (SEO)

2. A meta leírás legyen kulcsszavakban gazdag, és ne legyen több 155 karakternél
3. Az összes kulcsszó (kb 10 db optimális) jelenjen meg a tartalomban.
4. Az RSS csatornákban is legyenek meg a megfelelő meta adatok
5. A meta adatokat a közösségi megosztások során is kezeljük a megfelelően
6. A helyesírási és nyelvtani helyesség fontos a meta adatok esetében is.
7. Minden képnek legyen – kulcsszavakban gazdag – alt tag-je.
8. Legyen dinamikus XML oldaltérkép
9. Az XML oldaltérkép legyen beküldve a kereső motorok számára
10. Az oldal URL szerkezete tükrözze az oldal tartalmi hierarchiáját
11. A régi URL-eket 301-el irányítsuk a megfelelő új oldalakra
12. rel=”nofolow” hivatkozásokat használjunk ott ahol olyan linket helyezünk el amit a keresőrobotnak nem kell követnie.

Anallitika

A sikeres működés titka, hogy a legfontosabb analitikai eszközök valóban mérjenek. Tehát a legnépszerűbb google analyitcs legyen bekötve és mérjen megfelelően. A megfelelő mérés révén folyamatosan fejleszthető a tartalom és egyre jobb és jobb helyezés érhető el a honlappal a keresőkben.

1. A google analytics kódok kerüljenek bele a weboldalba, webáruházba.
2. Azokat az ip címeket melyekről a tulajdonos sokszor nézi a honlapot vegyük kivételnek a google analytics -ben
3. Alkalmazzunk csatornákat és célokat a sikerek méréséhez.
4. A google webmaster tools és az analytics legyen összekötve

Biztonság és mentések

Az adatvesztések igen nagy bosszúságot okoznak, de addig amíg ez nem következik be, sokszor nem tartjuk ezt fontosnak. Ezért a következő listán található pontokra érdemes odafigyelni

1. A rendszer amin a szoftver fut legyen felügyelet alatt, minimálisan 24/7 órás szervertermi felügyelet szükséges
2. Legyen egy teszt oldal (ami az utolsó élesítés előtti állapot), egy fejlesztői teszt oldal (amin folyamatosan fejlesztünk) és egy éles oldal.
3. A rendszerről készüljön napi biztonsági mentés (szerver szinten) és ez legyen tárolva 30 napig
4. A jelszavak és weboldalt tároló rendszerek jelszavai biztonságos adatbázisban legyenek tárolva
5. A rendszerről készülő havi biztonsági mentések legyenek tárolva 12 hónapig vissza menőleg

Jogi háttér

Legutolsó pont, győződj meg arról, hogy a weboldalad megfelel a törvényi előírásoknak. Sok esetben – nem egyszerű céges oldalaknál – ezt már a tervezési fázisban érdemes átnézni, és felmérni. A legjobb megoldás, ha konzultálsz egy jogi tanácsadóval aki kifejezetten internetes jogi területen dolgozik. A válóperes ügyvéded – hiába lett a barátod 😀 – nem jó választás.

1. Lehetőség szerint az oldal kínáljon hozzáférhetőséget a fogyatékkal élők számára
2. A cookie használatra vonatkozó szabályok legyenek benne a megfelelő jogi szövegkörnyezetben
3. Az oldal feleljen meg a vásárolt, vagy ingyenesen használható kódok, kódrészletek szabályainak.
4. Az adatvédelmi nyilatkozat legyen megírva, megfelelően, és látható helyre helyezve.
5. A weboldal legyen PCI kompatibilis, illetve feleljen meg a megfelelő törvényi előírásoknak ha hitelkártya adatokat tárolsz benne.

Egy új weboldal fejlesztése, készítése mint látható egy igen aprólékos munka, és még ez a lista sem tér ki mindenre ami fontos. De talán segít abban, hogy pár dolgot – főleg azt amit hajlamosak vagyunk elfeledni – szem előtt tartson 🙂

+1

Soha de soha ne feledd, a fejlesztő csapat nem azért van, hogy szívasson, az indulás előtti stresszt sosem csökkenti az idegeskedés. Próbáljatok meg a csapattal együtt nyugodtak maradni, hiszen ez sokkal eredményesebb, és sokkal jobban előre visz. Bármilyen kiélezett helyzetet megoldani csak együtt lehet, egymás nélkül soha.