Jelenlegi hely

Utolsó változások

2.1.13. HTML 5

Bár a HTML 5-ös változata még nem végleges szabvány, folyamatosan erősödik a támogatása. Emiatt mindenképpen érdemes megismerkednünk a még fejlesztés alatt álló, de holnap már szabadon használható megoldásokkal. Többek között a 2.4.7, 2.7.3 és 2.10.2 fejezetekben olvashatnak ennek részleteiről.

2.4.7. A HTML 5 újdonságai

A struktúra kialakítása területén igen sok újdonsággal készül a HTML 5-ös. Nézzünk meg néhány fontosabb megoldást. (A fejezet több példája A List Apart: Articles: A Preview of HTML 5 oldalról származik.)
A HTML 4 használata esetén igen gyakori a következő ábrán is látható elrendezés. Jól megfigyelhető, hogy a div elemek, valamint a class és id attribútumok sora szükséges az oldal kialakításához.

Tipikus két hasábos oldalelrendezés

2.1.4. Hogy nézzük meg egy oldal HTML kódját?

Gyakran előfordul, hogy a weben böngészve megtetszik egy oldal, és szeretnénk megnézni a forrását. (A szerző véleménye szerint ez az egyik legjobb módszer a tanulásra.) Hogyan tehetjük ezt meg?

Keressük meg a böngészőnk Nézet menüjét, majd Forrás, vagy Oldal forrása (vagy valami hasonló nevű, böngésző függő) menüpontot.

Oldal forrása

1.4.2. Szerver alkalmazások

Felmerülhet a kérdés, hogy miért érdemes lokális szerver kialakításával foglalkozni, és miért nem egyből távoli szerveren dolgozni.

  • A saját gépen történő fejlesztés gyorsabb, és bizonyos alapismeretek enélkül nehezen lennének elsajátíthatóak.
  • A távoli szerver használata többnyire nem ingyenes, és egyes funkciók korlátozottak lehetnek, vagy az ideálistól jelentősen eltérő működésűek lehetnek.

Természetesen a hátrányáról is szót kell ejteni:

1.3.1. A honlap célja

A szerző a megrendelővel való kommunikációt egy interjú formájában javasolja kezdeni, az alábbi kérdésekkel. A kérdésekre adott válaszok között persze nagy lehet az átfedés, az interjú célja az elérendő célok teljes körű feltérképezése. Egy konkrét esetben tehát bizonyos kérdéseket ki is hagyhatunk, ha azok feleslegesnek, értelmetlennek tűnnek. Más esetben további kérdések is szükségessé válhatnak.

3.1.2. A PHP konfigurálása

Ha az XAMPP megfelelően telepítve van, a http://localhost/xampp/phpinfo.php címen alapvető információkat tudhatunk meg az Apache, PHP és egyéb konfigurációról. Ha távoli tárhelyszolgáltatót használunk, akkor célszerű pl. egy i.php nevű állományt létrehozni a következő tartalommal, és FTP-vel feltölteni a tárhely gyökér (vagy public_html) könyvtárába:

2.10.3. Űrlapok formázása

Az űrlapok formázásánál nem az új technikai lehetőségeket, hanem a szemléletmódot érdemes hangsúlyozni. Nézzünk meg egy rövid, de szemléletes példát Antonio Lupetti tollából. Ezt szeretnénk elérni:

Form dizájn

A HTML kód:

2.10.2. Új lehetőségek a HTML 5-ben

A HTML 5 sok hiányt pótol ezen a rendkívül fontossá vált területen. A HTML 5 nélkül különböző kliens és szerver oldali megoldásokkal próbáltuk pótolni azokat a hiányosságokat, amelyek a jelenlegi űrlapok használata esetén mutatkoznak. De nézzük meg, melyek azok a lehetőségek, amelyek könnyíthetik a munkánkat.

Kezdjük először az újfajta űrlap elemekkel.

Szám mező

Gyakran van szükségünk arra, hogy számadatot kérjünk be a látogatótól. A következő példa mutatja, hogy milyen lehetőségeink vannak.

2.9.1. HTML szintaxis

Táblázatokat a table tag segítségével lehet létrehozni. Egy tábla sorokat tartalmaz (tr tag), és minden sor cellákat (th vagy td tag). A tábla cellái szöveget, képet, bekezdést, listát, űrlapokat, újabb táblázatokat is tartalmazhatnak.

Nézzünk egy egyszerű, 2x2 cellás táblázatot:

2.2.5. Média típusok

Ma már egy weboldalt többféle környezetben használhatunk. Egy weboldalt megnézhetünk képernyőn, kézi-számítógépen, mobiltelefonon, vagy akár kinyomtatva is.

Célszerű minden médiához a hozzá legjobban illő formázást elkészíteni. Pl. nyomtatásban a talpas, képernyőn a talp nélküli betűket tartjuk olvashatóbbnak. Bizonyos elemeket (pl. menüket) felesleges kinyomtatni, míg weblapról kifelé mutató linkek href értékét nagyon hasznos megoldás.

Oldalak