Mi kell egy weboldalhoz? + A HTML alapjai

A videó a tananyag.net portál szponzorálásával készült, a kezdő webprogramozó videósorozatunk 1. része. A sorozat további részei megtekinthetők a tananyag.net YouTube csatornáján. Az akadálymentesítés jegyében ennek a résznek a teljes szövegét elérhetővé tesszük alább.

A videó leírása

Sziasztok, Rápli András vagyok és a webprogramozás videósorozatot nézitek, abból is az első részt. Ebben az egész részben az alábbi három témával foglalkozunk: hogyan készítsünk weblapot, milyen technikák, programnyelvek ismerete szükséges, és még egy kis betekintés a HTML alapjaiba bele fog férni.

Kezdjük azzal, hogy hogyan kell elkészíteni egy weblapot. Ingyenes automatizált szoftverekkel, mint például a FrontPage, lehetőségünk van, hogy úgy elkészítsünk egy oldalt, hogy közünk nincs a programozáshoz, nem kell tudnunk annak a kódját, hogy mi csinálja meg valójában, hogy piros legyen a betűszín. Mi csak rákattintunk és működik. Ezt jelenti a WYSIWYG (What You See Is What You Get) rövidítés, ami zárójelben van.

Ingyenes webes alkalmazásokkal is dolgozhatsz, mint például a mindenkilapja vagy a gportal. Nem kell csinálnod semmit, annyi az egész, hogy beregisztrálsz, kapsz egy oldalt, te töltöd fel a tartalmat, de nem igazán tudsz beleszólni, kapsz egy sablont és sok lehetőséged nincsen.

Ingyenes CMS-ek. Ha ezekkel dolgozol, egy kicsit könnyebb dolgod van. A sablonokat te magad szerkesztheted, használhatsz HTML-t, CSS-t, PHP-t is, ugyanakkor aki nem ért hozzá, annak ott vannak az ingyenesen elérhető sablonok, leírások. Ez a CMS-ek nagy előnye, elérhető rengeteg anyag róluk, mert ismertek. Ilyen tartalomkezelő például a WordPress, a Joomla vagy a Drupal.

Dolgozhatsz még számos egyéb weboldallal, például a Blogger - a Google blogszolgáltatása, korábban Blogspot néven futott, biztos ismeritek ezt is. Itt is csak annyi, hogy feltöltheted a tartalmat, esetleg egy kis CSS-t módosíthatsz és sablonozhatsz, de PHP-t például nem használhatsz - ezekről majd később. A Wix is hasonló a már említett oldalakhoz, a külföldi hasonló közül a legismertebb.

És akkor marad az az opció, hogy írjuk meg a kódot mi magunk. Mit lehet mondani, ennyi igyenes megoldás van, nem kerül semmibe, akkor miért írjuk meg a kódot magunk?

Például ingyenes online weblapszerkesztőknél gyakran előfordul, hogy felraknak egy nagy reklámot a tetejére, és az egész oldal egy iframeben fut. Ez elég kellemetlen megoldás, az iframe a múlt évezred favorizált megoldása, sok gondot okoz és butaság az egész, ráadásul te nem is tudod kézzel eltávolítani. Nem használhatsz adatbázist, nem tudod tárolni az adatokat, de PHP-t sem. Aki használt gportált vagy régebben még talán az extra.hu volt még ilyen, az tudhatja, hogy mennyire meg van kötve az embernek a keze, ha hasonló ingyenes megoldásokban gondolkozik.

WYSIWYG szoftverek: lassú, körülményes használat, átláthatatlan spagettikód - ezeket írtam ide a diára, ez azt jelenti tulajdonképp, hogy a gép generálja le a kódot és eléggé rossz dolgok szoktak kisülni abból, ha te valamit meg tudsz írni öt sorban, erre a gép megcsinálja neked ötszáz sorban. Lassú lesz az oldalbetöltés, inkompatibilitási problémák jelentkeznek. Ha SharePoint-on megcsinálsz valamit, az valószínűleg Internet Exploreren jól működik, de Firefox-on már nem biztos.

És akkor elérkeztünk oda, hogy milyen technikákat kéne elsajátítanunk, ha magunk csináljuk ezt az egészet.

A weblap miből is áll?

Kezdjük ott, hogy HTML. A HTML a világhálón használt hiperszöveges jelölőnyelv, ami annyit tud, hogy ha te megnyitsz egy weblapot, mindent, amit ott látsz, azt a böngésző HTML-ként kap meg és értelmez, és átalakítja számodra hasznos információra, például képet mutat meg, szöveget formáz, videót jelenít meg, satöbbi. Ez egy egységes szabvány arra, hogy hogyan lehet különféle tartalmakat hogy lehet eljuttatni a felhasználóhoz a szervertől. Később részletesen beszélek még ennek a működéséről - ebben a videórészben is. Egyelőre menjünk tovább arra, hogy mi az a CSS!

A CSS - ez a lépcsőzetes stíluslap dokumentum elnevezésből származik. Egy olyan nyelv, aminek segítségével az oldalnak a dizájnjával tudunk foglalkozni és nagyon frankó dolgokat össze tudunk vele hozni. Bizonyos dizájnmegoldásokat HTML-ben is el tudunk készíteni, de ezek általában a legalapabb változtatások, például szövegszínt tudunk módosítani HTML-ben is, de árnyékolásokat már nem igazán. Mindenféleképpen szükségünk lesz a CSS-re, ha jó kinézetet szeretnénk az oldalnak.

A PHP a legelterjedtebb szerveroldali programnyelv, '95 óta van jelen. A segítségével működésre bírhatjuk az oldalt, úgyhogy ez nagyon hasznos lesz. HTML kódban te nem végezhetsz kalkulációkat, nem számolhatod ki a kör kerületét, de a PHP erre lehetőséget ad. Adatbázis-kezeléshez is szükséges, ez a weboldalunk motorja.

MySQL. A relációs adatbáziskezeléshez szükséges, az adatokat meg kell őrizni, ha a látogató már nincs aktuálisan az oldalon, de mondjuk beregisztrál egy felhasználónévvel és jelszóval, akkor azokat az adatokat el kell tárolni, mi legyen velük? A megoldás természetesen, hogy adatbázisba írjuk ki, erre pedig a MySQL-t fogjuk használni, ami a talán a legelterjedtebb adatbázistípus az MSSQL mellett.

// a videószöveg további kidolgozása folyamatban van

Vélemény, hozzászólás?

Az email címet nem tesszük közzé. A kötelező mezőket * karakterrel jelöljük.